Don’t lose out on online donations – get your website’s UX nailed with these 7 amazing tips 

By Jennifer Corfield

User Experience, or ‘UX’ as it’s commonly known, can positively or negatively affect the usability of your charity webpage or website and in turn, the behaviour of your audience. Last year a UX mistake reportedly cost LinkedIn over £9m reminding us just how damaging bad UX can be.

For charities, encouraging visitors to donate and to keep donating is paramount, and ensuring your web pages are easy to use is a critical part of this. Ultimately good UX = more conversions, which means more funding for your cause.

Remember, it’s far easier to plan for and implement good UX in the first place than to correct it when it’s not working. So, the earlier you start planning and thinking like your audience, the better the results. Gathering user insight and asking for feedback before you begin will help you avoid having to make time-consuming and possibly expensive changes further down the line.  

Here are my seven top tips for getting it right:

1. Make your website accessible for all

Making websites accessible is an absolute must. If we don’t do this, we run the risk of excluding some user groups and alienating a proportion of our audience. People with a visual impairment like colour blindness for example, would not be able to use a website effectively if it relied heavily on colour to convey its purpose, hierarchy or content, and this could severely impact upon the success of a project and the perception of your organisation.

Test it: Try colorfilter.wickline.org and put a colour filter on top of your webpage, testing it for different kinds of colour blindness.

2. Avoid/reduce repetitive actions where possible

Having to fill in a form that asks for your address more than once isn’t just annoying; it could be seriously hindering your conversion rate. There are lots of ways we can tackle repetitious actions, for example using tick boxes where you can select your billing address as the same as your shipping address. Remember, web visitors can have very short attention spans and anything we can do to speed up and streamline a process will inevitably pay dividends.

Test it: Make sure there is always a way of facilitating repetitive actions. Notice how successful online retailers like AO.com manage their order process and remember the rule – it’s never nice typing it twice!

3. Don’t let accessing help get in the way

Users ask for help when they're stuck, but that shouldn’t mean dropping everything when it’s needed. Try to make sure that going back to check details or accessing a help menu won’t interfere with a process or worse, mean having to start it all over again. Allowing the user to stop and save part way through completion of longer online forms can be a good option.

Test it: Put yourself in the position of audience and consider the points at which they’re more likely to need some help – can they easily find it from here? Will they need to click away from the current screen and if they do, will any data entries be lost in the process?

4. Ensure website navigation is easy, intuitive and consistent

Getting lost on a website isn’t productive; it wastes time and can lose the viewer’s interest all together. Visitors to your website or web page should be able to find their way around easily, achieving their goals as they go.

Test it: Make sure that navigation options are available on every page, as ASOS have done here and that your pathways are as intuitive as possible. A visible sitemap is a really effective way to show your visitor exactly where they are and how to find their way back – think of it like leaving a trail of breadcrumbs.

5. Make sure your website’s foreground and background are sufficiently contrasted  

This is especially important for anyone with a visual impairment. Clear distinction between the foreground (interactive) and background (not interactive) aspects of a website aids with navigation, draws more attention to buttons and increases usability.

Test it: Test the contract of two colours usual an online contrast checker

6. Don't use much more than two distinct font families

Although this isn’t a strict rule, sticking to two font types is best for accessibility. For usability and visual purposes, simplifying your typography will improve comprehension and help visitors to achieve their goals.

Test it: Simply check that your design isn’t mixing more than two type families. You should also make sure that the ones you choose are properly matched, with an online font checker like Type Genius 

7. Make sure that your website is responsive (mobile friendly)

While the desktop version of your site or page might render beautifully on a PC, unless it’s built to be responsive it will probably look less than beautiful on a mobile phone or tablet. Vertical and horizontal scroll bars all over the screen and having to swipe your finger to view the content on the right side of the page creates terrible UX. This combined with elements so small they’re barely readable and links so tiny they’re not even clickable make unresponsive websites horribly difficult to navigate on mobile devices.

Test it: Build your website to be responsive and not only will you improve its UX, but it will improve your Google ranking too. Check with your web designers that they are building the site to be responsive and then test it on all popular mobile devices. It may be time consuming, but you’ll be glad you did!

Jennifer Corfield is business development manager at focusgov. If you’d like advice on your next digital project then please get in touch on 0117 949 8008 or email hello@focusgov.co.uk