In today’s global economy, advertisers and marketers can use digital marketing campaigns to literally reach millions of people in a matter of minutes. With a hefty advertising budget, any e-business or ecommerce business can take the digital world by storm. Surely, by attracting millions of users, sales will soar to unknown heights. Well it all depends on engagement.
If a website is unable to retain user attention then despite all the new visitors, sales, downloads, appointment bookings, or any other desirable actions are unlikely to change significantly. Consequently, engagement has become an all-powerful buzzword expertly wielded by web developers, content creators, and marketers alike in order to convince businesses to change their outdated ways and engage consumers. But what does “engagement” actually mean?
We might be tempted to equate engagement with actions like clicking, downloading, submitting or buying, but there are other, more passive ways of engaging with a website, such as simply reading, exploring, or scrolling through content. In this article we are going to use a broad definition of engagement that encompasses all types of actions and reactions that users experience or undertake when they choose to remain on any given website.
Website engagement is thus inextricably linked to the user’s experience, but can UX and UI design help improve engagement rates? The short answer is YES. And here’s why.
UX design (i.e. User Experience Design) focuses on streamlining all user interactions from the first to the last. It maps out all potential interactions a user could engage in and then organizes them in a logical sequence. In a nutshell, UX design makes sure users can achieve their goal with as little effort as possible, by making the entire user journey intuitive and effortless. Naturally, this is crucial when it comes to creating an engaging platform.
Users are not proactive by nature. They need guidance and are more than willing to respond to simple visual cues that guide them towards their desired outcome. And UI does just that. User Interface designers add extra shine and colour to the bare-bones processes created by UX designers. When UI and UX design work together certain website features catch the user’s eye leading them from one phase of the conversion process to the next. This translates into an engaging experience for users and increased conversions for the website.
If by now it has become rather obvious that the user’s experience and the interface’s design can, in theory, influence website engagement, when it comes to the practical steps one can take in order to make changes that positively impact engagement, things are much less clear. That’s why in this article we will explore UI and UX best practices ecommerce platforms, or any other type of online business, can implement in order to significantly boost engagement.
UX best practices
UX encompasses subjective aspects of the user experience, such as tone of voice, as well as technical aspects, such as button positioning. In order to create an engaging user experience, you need both engaging content and engaging functionality, but, presently, usability takes precedence.
Page loading time
User experience starts before visitors actually come into contact with your website. The first few seconds, while a website is still loading, are crucial on both desktop and mobile. For the last ten years, Google representatives have been saying that a 0.5 seconds loading time would be ideal. However, for a content heavy e-commerce website, 2 seconds can still be acceptable. According to Google, a website’s bounce rate increases by 32 % if page loading time increases from 1 second to 3 seconds. And if one considers the mounting cost of consumer acquisition, even a 10% increase in bounce rate is unacceptable.
Besides, a slow loading time can also impact your SEO and make attracting new users even more difficult than it already is. There are many ways to reduce a website’s loading time, from code optimisation to content reduction. Keep in mind that a good UX experience does not require extensive content, but it should however still provide the right content at the right time. It’s all about finding balance.
Website content is not the only component that should be stripped down to the bare minimum. Similar rules apply for your website’s code as well. It needs to be as compact and as well structured as possible. Using minified CSS, HTML and JavaScript files, and enabling compression for files larger than 150 bytes are great first steps. But you should also consider more subtle adjustments like server response time optimisation and CDNs (content display networks). Making sure to optimise the images depending on viewport size has also become a standard practice, due to its positive impact on mobile loading time.
Navigation
At first glance, navigation might not seem an important factor to consider when trying to boost engagement. However, users only engage with content they are truly interested in and effective navigation helps them find that content with as little effort as possible. The connection between navigation and quality engagement is now obvious. So, how can we improve this part of the user experience?
For starters, we should avoid the pitfalls of inaccessibility and poor categorisation. Good navigation is first and foremost accessible and well-structured using relevant categories. Instead of creating an all-inclusive navigation that provides too many links, menus and submenus, stick to the most important categories and include a search box in order to allow users to explore more freely. Since searching for the search box is quite the paradox, it’s recommended to place it above the fold, in a visible location, usually the top-left part of the screen. In order to maximise the impact of your search box on engagement, you can also add a drop-down or an auto-suggest feature to make the experience even more straight-forward.
Consider also adding internal links within your website in order to improve navigation and increase engagement. Brief recommendations, links to infographics, images or user cases can be great opportunities for nurturing engagement.
CTAs
UX design is always focused on creating websites that respond to user expectations. And this is perhaps the most obvious when it comes to button placement. Users expect and love predictability, so, classical layouts that place the most important CTAs above the fold are a good choice for websites looking to generate both engagement and conversions.
This love of predictable actions and outcomes should also be taken into consideration when naming buttons. In order to make your website as straight-forward as possible, be as explicit as possible with button names. For instance, if a button deletes or removes something make sure it actually has an appropriate label, even if it answers a yes or no question. Furthermore, including a relevant description of the outcome in the CTA has also been shown to improve engagement. So, instead of a generic submit button, opt for a more descriptive text like: Download my free e-book.
Suggested content
In today’s highly competitive digital world, up-selling is an essential part of any online strategy. So it’s no surprise that the suggested content or related content feature has become ubiquitous on all business websites. From e-commerce platforms to online publishers, everyone is trying to convince users to add more to their carts or to simply spend more time on a website browsing articles. However, this feature is also extremely useful for consumers looking for relevant information or other similar products, so it really is a win-win situation that positively impacts both conversions and engagement.
Engagement opportunities
Sometimes increasing engagement rates can be as simple as creating more engagement opportunities for users. Even users who might not be ready to convert can still engage with a given brand by subscribing to a newsletter or participating in a webinar. You can incentivise users to perform more complex actions such as reviewing a product by creating contests or offering a small discount for a future purchase.
A great UX design allows for plenty of interaction and engagement without distracting users from the website’s main goals. These engagement opportunities are intermediary, more accessible steps, that lead to the main goal.
Micro-interactions
Websites should never become a brand monologue. In order to engage, users need to feel like they are part of a conversation, and subtle micro-interactions provide that needed “go on, I’m listening” people need in order to feel comfortable asking questions. Micro-interactions encourage users to take advantage of all the engagement opportunities already included in a page by letting them know, through subtle visual cues or animations, that they are performing the right action. For instance, when toggling a certain feature on and off, colours are used to communicate the fact that the feature is active or that it has become unavailable. Micro-interactions are usually built-into all buttons, search-boxes and forms, precisely thanks to their ability to guide users towards the final goal.
UI best practices
A great UI interface uses fonts, colours, layout and other design elements in order to create a clear visual hierarchy that gently guides users down the predetermined path the UX team carefully assembled.
Fonts
Font choice is one of the most important decisions a UI designer has to make. An inappropriate font can make even the most appealing content seem dull, leading to decreased engagement and a high bounce rate.
It can be tempting to choose fonts that stand out and attract user attention, but this is not a good practice, particularly when it comes to large bodies of text. By choosing a simple, yet, elegant font, designers allow the content to shine without other distractions. Lato, Roboto, Open Sans are popular sans-serif options, but more traditional brands can also opt for serif fonts like Garamond, Caslon or Georgia.
Each font can help a company communicate a particular set of values, so it’s best to look into font psychology before making a final decision. It’s also considered good practice not to use more than two fonts in one interface. The more fonts a user interface includes, the more difficult it is to maintain a clear information hierarchy. Plus, including too many fonts can also have a detrimental impact on website performance and loading speed, particularly for mobile versions.
Colour Schemes
Similarly, to choosing the right fonts, choosing the right colours for a website can have a significant impact on a website’s engagement. Colours are an easy way to grab user attention and direct it to interactive elements like CTA buttons. But in order to ensure that certain elements pop, others need to be more subdued. That’s why, today, most websites use a primary colour, a secondary colour, and one or more neutrals. Primary colours are bold and vibrant so it’s considered good practice to use them to highlight important headlines, CTA buttons or other important information users should be aware of. Secondary colours are usually used for highlighting secondary buttons, sub headlines, active menu icons, and supporting content like testimonials. Last but not least, neutral colours should be used as background for text-heavy sections, but can also be present in more colourful sections in order to create contrast and allow the user to focus his gaze on important information.
Layout
While fonts and colours can help guide users towards a desired goal, adding more visual interest to certain website components, the website’s layout is the main tool UI designers use to create a clear informational hierarchy and to make sure users know what actions to undertake. Size is one of the clearest indicators of importance for users, so layouts will typically magnify important information and use white space to draw even more attention to essential features. White space can also be used to suggest connection or disconnection between different information blocks, providing more clarity when used correctly.
A great layout leaves nothing to chance and maintains a consistent look and feel throughout the website. In order to achieve this goal, many designers choose to work with grids that allow them to arrange content optimally. Different design elements have different weights within a visual field, and grids can help UI professionals create perfectly balanced interfaces that expertly guide the user along a predefined path to conversion.
Final Thoughts
As more and more people embrace mobile browsing and apps, implementing sound UI and UX principles is fast becoming a market standard. Small viewports and limited bandwidth leave no room for errors and flamboyant effects, so engagement needs to be nurtured using more simple tactics based on a thorough understanding of user expectations.
In today’s mobile world, practical factors such as a website’s loading time or responsiveness are more important than aesthetic considerations. Simplicity and familiarity reign supreme. However, this does not mean that there is no more room for originality, quite the contrary. Users want to see original design solutions, but these solutions need to address real user problems in order to be valuable and not just provide extra fluff. The modernist principle of “form follows function” truly does apply to today’s most successful websites.