UX considerations you need to make across devices – Part 1 B2B

As highlighted in our recent whitepaper ‘Whitepaper: how Covid-19 impacted online behaviour, part one‘, in the initial months of lockdown, we saw a huge shift in website traffic, digital advertising performance and online behaviour across both the B2C and B2B sectors. We are continuing to monitor the situation, but anticipate that long-lasting attitude and behaviour changes are likely, meaning businesses must be flexible and continue to respond to changing customer behaviour! 

The businesses that will continue to thrive are those who learn to harness these changes and adapt – focusing on refining user experience through UX design and embracing new advancements in digital advertising. Being agile in your thinking and approach online will be fundamental. 

One of the biggest observations from our whitepaper findings was the difference in website behaviour across devices. This is a key consideration when designing any website, but is sometimes overlooked. Covid-19 has brought this to the forefront for many businesses, as many have been encouraged, or guided towards having an effective online operation. 

In this two-part blog, we will explore both B2B and B2C functions, to determine three key considerations to maximise your web offering and provide an opportunity to drive new business, even in these unpredictable times.

Read on for our main UX considerations across devices for B2B companies:

B2B 

Ensure content is front-and-centre

Overall, customer behaviour on B2B websites remains relatively unchanged. However, session length has increased slightly, suggesting that those who are accessing B2B websites are more likely to be sticking around to read the content. 

Lead generation is typically the primary goal for the B2B market. Having a content strategy in place – providing informative or valuable blog posts to your audience – is key to aiding conversion. There is no better time than now to implement a comprehensive content strategy. 

Using your blog, you can update your site visitors on business news and create content to help your customers find a solution, educate them on your subject matter and show how your products or services will help them. While the content must be high quality and focused, it must also be accessible and considered in the website journey, across devices. 

On desktop, think about dedicating some space on your homepage to key content such as case studies or blogs. Think about how you can use content to guide your audience to your product, with ‘you might like this’, or ‘recommended product’ widgets, or in-content links. Consider how the content looks – are images responsive, do they take up too much space? Are there clear CTA’s on the blog page? How do people navigate to the next blog?

When it comes to mobile devices, you need to ensure it’s optimised for smaller screen sizes. Lots of your site traffic will be coming from mobile users. If your content isn’t optimised for mobile, it may be hard to read or formatted poorly, which can lead to increased bounce rates, and ultimately make you lose site visitors. Therefore all content must be designed vertically so that it stacks and is easy to read. When uploading content, always review the layout and order on a mobile device too – sometimes animation or videos can also cause problems on mobile – review the file sizes and be sure to review that it works across devices. Also, you must consider how CTA’s feature in content on mobile; with no visible navbar, you need to feature a strong CTA menu at the bottom of the screen directing users to your onsite forms.

The importance of a clear and compelling call-to-action (CTA) 

On desktop, CTA’s need to be above the fold of your landing page. This ensures that site visitors see the CTA before taking any other actions on your website. Not all your site visitors will scroll below the fold, so it’s essential that you draw them in before they lose interest or leave your site. 

On mobile devices, however, CTA’s need to be mobile-friendly. There is a big difference between desktop and mobile. On desktop, due to larger screen sizes you have space to play with, meaning you can feature lower priority text. Whereas on mobile, you don’t have as much room on screen, therefore it’s best practice to prioritise CTAs over other content. Many people also only use their thumb to interact with content, so this must be taken into account. Think about those key hotspots and place your CTA buttons where you are more likely to get the click!  On both desktop and mobile, one thing is key – you must ensure your CTA features ‘above the fold’. As soon as a visitor lands on your site, you need to hook them in and encourage them to take action, without having to scroll down the page! If you grab their attention with a strong message / direction, they are much more likely to stick around, explore your site and convert.

You also need to entice your visitors… For smartphone users, CTA’s work well as buttons that are clearly visible. For extra clarity, ensure there is plenty of breathing space around your CTA buttons and that the area is not overwhelmed with other content, such as images or body text. This will help draw attention to your buttons and increase click-through-rate. It is also important that any other links are not placed too close to CTA buttons in order to avoid mis-clicks, which can confuse the user journey on the site. 

If choosing a button as your CTA to highlight its location and draw attention to it, consider the design of the button itself. On desktop, the hover state can provide an interesting design feature that encourages a user to click the button or take action. On mobile, however, the hover state function is not possible, so can cause major issues, not enabling the user to see what they’re clicking on.

Remember, choices a user can take on one webpage should be limited, so ensure your website isn’t cluttered with CTA’s – plan ahead and define the key actions you want your user to take on your site. Placement is key, but also think about how you can use sizing and styling to make your primary CTA’s easily identifiable and prioritise hierarchy, especially if there are a couple of actions you want your users to take. If you have certain CTA’s that you know users look for on every page, you could place them at the bottom of the mobile screen so users can always see the floating buttons, without taking up too much content real estate.

Simplifying forms

For any B2B company, onsite forms are a must-have when it comes to lead generation. If you have a form on your website where site visitors have to input details, either to contact your business or download an asset, consider how forms work across devices and review how much information you are asking your website visitors to submit. Whatever the device, if you ask for too much personal information, you could lose a prospective customer.  

On desktop, consider how you can make all form requirements visible on-page. Similar to CTA’s, keep your form above the fold, with no nasty surprises. If you require a long-form, make sure you are transparent and group the questions into easy-to-digest chunks. If you provide a  progress bar you are more likely to keep users interested! Your form should be front and centre, concise and easy to complete; auto-fill can help make this process more simple for site visitors and save them time inputting their details. Consider a postcode lookup if you require address details to simplify this process for users, or on mobile utilise geolocation technology and integrate the Google places API to intelligently predict location.

On mobile, forms need to be even more condensed and simple if you want someone to make an enquiry, or submit information via your website. You need to make it as easy as possible to access and fill in the forms. Again, auto-fill helps here but you can also make things easier by implementing a single column layout, minimal form fields, automated actions and clear action buttons/CTA’s. Avoid drop-down buttons and provide matching keyboards (if a user is entering a phone number, provide this keyboard!)

These three simple, yet incredibly effective considerations will help you improve user experience across your site and hopefully drive more conversions. 

---

In Part 2 we will explore three key considerations B2C companies need to make across devices, focusing on e-commerce requirements. If you need help with your digital marketing or would like a UX audit, our digital specialists can help. Get in touch today to speak with one of the team!