Here is a compilation of 10 Checklists to Improve Website UX if you are currently running a website. These tips and references will help tackle user experience problems such as readability, usability and uniformity. I definitely believe after reading this guide, your UX thinking skills will improve up a notch. Now, let’s begin with one of the most important point:
Content-first design is a principle that users are given readable and clear information in each site page. We might overlook this while placing importance of the Theme Design over content. Is there too many images or ads that distracts the reader? Ask yourself, how can I make every article more valuable and useful for visitors instead of focusing on where to place your ads.
Here’s a good read on “Designing Content-First for a Better UX” by Gather Content
2. Information Architecture
IA is how the main information of your site is organised. Usually this is where the navigational header shows how your site is structured. Submenu’s need to be relevant to main menu items. Upon navigating to blog posts, there should be relevant articles that guide users to the next content. Evaluate based on importance, and write down what needs to go up or down in the structure of your pages.
To learn more, read the “Complete Beginner’s Guide to Information Architecture” by UX Booth
3. Noise & Clarity
Another way to improve website UX is to evaluate if there are redundant ads or content that distracts your target audience from the message. You can use a number of tools such as Heat Maps to see if how your visitors are using your site.
Hotjar is a heat map tool that can run tests to improve site pages. You can read more here – “8 Heatmap Tests That Reveal Visitor Behaviour”
4. Clear Buttons
Buttons are tricky. But a good rule of thumb is it has to be be clear. Making a button too small or hidden will confuse users. Psychologically, we are drawn to bright and big buttons and if designed correctly, will look pleasant. For Responsive Websites, always check how your navigational items are placed when in mobile or tablet size. As a tip, buttons work great when horizontally centred in mobile devices.
Check out Smashing Mag’s excellent guide on “How To Design Better Buttons”
5. Color Contrast & Consistency
Is there uniformity and a concise colour style throughout your website? Decide what is the Primary colour and Secondary colour that you want to project. Colours should have a good contrast when put together with coloured backgrounds. A general tip is by using white text on darker backgrounds, and black text on grey or white backgrounds.
If you need to a tool to check, try the Colour Contrast Checker
Here’s a good article by Smashing Mag on design inclusivity in regards to colour for different sighted people – “Everything About Colour Contrast And Why You Should Rethink It”
6. Minimalism: Less is More
Discarding what’s unimportant will give greater focus to what is.
When I think about a page, I think of personality. If you run a website with tons of links and ads, what will people remember of you once they leave your site? Sometimes our information needs to be clear and on-point. Think of that best method to convey a message, whether it is Picture, Text, Audio or Video. Discard the rest that doesn’t seem fit.
Have a look at Awwwards list of Best Minimal Websites to gather some inspiration.
7. Stick to Guidelines
This applies to HTML5/CSS3 code, SEO & Design guidelines. An example would be, H1 Headings should be kept for Main Titles and Blog Titles. Many sites are still unresponsive or mobile-friendly, and the easiest way is to use a framework such as Bootstrap to craft a responsive site.
If you need some help with this, we can help you by converting your website. Come talk to us!
8. High-Res & Optimized Images
It’s always good practice to gather high-quality photos and reduce the size that is optimum for the browser. You can find cool and commercial free images on Unsplash.com or Pixels.com.
For more on the topic, I highly recommend reading “Optimizing Images for Web: A Step-By-Step Practical Guide” by Richard Lazazzera
9. Clear. Bold. Typeface.
To improve website UX, make headers and paragraphs clear to read. The choice of typeface is also important to convey the message of your brand. When in doubt if your content is readable, gather comments from friends if they think your website needs work. Take a look at Tobias Van Schneider’s blog and see how bold and clear typography grabs attention.
If you’re looking for modern fonts, check out 50 Best Free Fonts for Designers by Creative Bloq
10. Gather Feedback
Any site or app deserves a voice to be heard and improved upon. Implement a feedback form and gather improvements that can be made for better web user experience.
Thanks for reading, “10 Checklists to Improve Website UX”. Leave comments below if you have anything to share.