Menu
When designing a website, there are three core things we need to consider at all times: function – what it does, aesthetic – what it looks like and experience – what it fees like to use.
However, these three elements can’t be separated, so when considering the user experience (UX) of a website, we need to also consider the aesthetic and function.
First and foremost, from my own experience of implementing UX design for clients – UX auditing is an invaluable step in the process. I always look to make notes on the positives and negatives of a pre-existing website. This is great for identifying existing pain points, as well as anything that is already really working and defined design conventions – why fix what isn’t broken? I also recommend you have a look at competitor websites too. The info you gather from this research analysis will form the backbone of your design.
Once you’ve completed your analysis, these would be my next steps:
Personas – Create personas that represent your target audience, identify what they are trying to achieve by using your website and what pain points they may experience – this will guide you in design decisions. If you have already created personas, make sure to add web considerations such as how and why they use your website.
Usability Testing – If your budget doesn’t stretch to primary research, use software like HotJar to track how users are moving through your existing website, identify their pain points and map their journeys.
Clear Structure – Use a simple, intuitive navigation structure and consider using breadcrumbs to help the user identify their current location.
Simplified User Journey – We want the user to find what they are looking for as quickly and easily as possible. Try to keep the number of clicks to a minimum by merging similar pages, removing unnecessary clicks and adding internal links to pages.
Consistency – Ensure buttons, fonts and colours are consistent across the site and follow established design conventions such as red for cancel, green for success messages.
Branding – Align all design elements of the website with your brand identity.
Mobile First – Use your analytics to check which type of device is most commonly used by your audience. If this is mobile, design for mobile first, ensuring the site is fully functional on smaller screens before rolling out to tablet and desktops.
Adaptive Layouts – Ensure your site automatically adapts to different screen sizes and orientations.
Optimise Images – Use Photoshop or TinyPNG to compress images without sacrificing quality to reduce load times.
Use A Video Host – Upload any videos to YouTube or Vimeo and embed them rather than host them directly on your website.
Alt Text – Provide descriptive alt text for images to assist users with disabilities and help search engines.
Hierarchy – Use header tags, size, colour and placement to guide users’ attention to important elements and headers.
Whitespace – Use plenty of whitespace to prevent clutter and make content easier to read.
Fonts – Choose easy to read fonts and ensure there is plenty of contrast between the text and background. You can use Coolors Contrast Checker to check contrast levels.
Placement – Place CTAs in noticeable areas at relevant points on the user journey.
Language – Use compelling, action-orientated language.
Interactive Elements – Provide visual feedback such as underlining text, buttons changing colours etc to show elements are clickable.
Messages – Display clear, helpful messages such as error and successful submission messages to guide users.
Testing – Regularly test your site with real users to identify pain points and areas for improvement.
A/B Testing – Experiment with different design elements to see what works best for your audience.
Personas – Create personas that represent your target audience, identify what they are trying to achieve by using your website and what pain points they may experience – this will guide you in design decisions. If you have already created personas, make sure to add web considerations such as how and why they use your website.
Usability Testing – If your budget doesn’t stretch to primary research, use software like HotJar to track how users are moving through your existing website, identify their pain points and map their journeys.
Clear Structure – Use a simple, intuitive navigation structure and consider using breadcrumbs to help the user identify their current location.
Simplified User Journey – We want the user to find what they are looking for as quickly and easily as possible. Try to keep the number of clicks to a minimum by merging similar pages, removing unnecessary clicks and adding internal links to pages.
Consistency – Ensure buttons, fonts and colours are consistent across the site and follow established design conventions such as red for cancel, green for success messages.
Branding – Align all design elements of the website with your brand identity.
Mobile First – Use your analytics to check which type of device is most commonly used by your audience. If this is mobile, design for mobile first, ensuring the site is fully functional on smaller screens before rolling out to tablet and desktops.
Adaptive Layouts – Ensure your site automatically adapts to different screen sizes and orientations.
Optimise Images – Use Photoshop or TinyPNG to compress images without sacrificing quality to reduce load times.
Use A Video Host – Upload any videos to YouTube or Vimeo and embed them rather than host them directly on your website.
Alt Text – Provide descriptive alt text for images to assist users with disabilities and help search engines.
Hierarchy – Use header tags, size, colour and placement to guide users’ attention to important elements and headers.
Whitespace – Use plenty of whitespace to prevent clutter and make content easier to read.
Fonts – Choose easy to read fonts and ensure there is plenty of contrast between the text and background. You can use Coolers Contrast Checker to check contrast levels.
Placement – Place CTAs in noticeable areas at relevant points on the user journey.
Language – Use compelling, action-orientated language.
Interactive Elements – Provide visual feedback such as underlining text, buttons changing colours etc to show elements are clickable.
Messages – Display clear, helpful messages such as error and successful submission messages to guide users.
Testing – Regularly test your site with real users to identify pain points and areas for improvement.
A/B Testing – Experiment with different design elements to see what works best for your audience.
So, to wrap things up, UX design isn’t just simply making a website look good – it’s about creating a positive experience for users. By paying attention to how your site functions, looks, and feels, you’re not only making it easier for people to use but also boosting their confidence and trust in your brand.
UX Design is not a one-time thing though – we all need to be constantly refining and testing to make sure our site meets the needs of our users. So, whether you’re starting your website from scratch or just looking to tweak what you’ve already got, incorporating UX Design is key to building a site that will bring people back, again and again.
Download our handy cheat sheet for more tips!
If you would like us to conduct a UX Design audit on your site, contact claire@macmartin.co.uk.
Winner of Best Small Business in the Rural Business Awards 2021
Finalist of Best Digital/Creative Upscaler in the Mainframe Awards 2021
Esme Wade Finalist of Apprentice of the Year in the Enterprising Women Awards 2022
Finalist of Small Business of the Year in the Chamber of Commerce Business Awards 2022
