A 10-step guide to website design

1. Website Purpose

Your website needs to accommodate the needs of the user. Therefore, it is crucial to have a clear understanding of the purpose of your website as it will guide the design, content, and functionality of the site. A well-defined purpose will improve the user experience, increase engagement, and ultimately achieve the goals you have set for your website. Having a simple clear intention on all pages will help the user interact with what you have to offer. We therefore believe it is important to map your website pages and relate them to that page purpose. This should be reviewed regularly, as new pages are created. 

2. Simplicity

The layout of a website can make or break the user experience. Keep the layout simple, uncluttered, and easy to navigate. The main goal is to make sure that the user can quickly find the information they need.

Consistency is key in website design. The overall look and feel of the website should be consistent, including the layout, colour palette, typography, imagery, and other design elements. Consistency helps build trust with the user, making them feel more comfortable and confident using you website.

Responsiveness. In today’s world, more people are accessing websites from mobile devices than ever before. It’s important to make sure your website is responsive and optimized for all devices. This means that the website should adjust to different screen sizes, ensuring that the user has a positive experience, no matter how they access your website.

By following these guidelines, you can simplify the design of your website, enhancing the user experience, and helping to achieve your goals. 

3. Navigation

Website navigation serves as a guide for visitors to easily locate and interact with the information they are searching for. A well-designed navigation system is crucial in retaining visitors and keeping them engaged. Confusing navigation can lead to a negative experience and cause visitors to seek information elsewhere. To ensure a successful navigation system, it is important to keep it simple, user-friendly, and consistent on all pages. In our research we have found that many search tools on foundations’ do not work. It is important that pages are tagged properly and are relevant. We recommend an annual external audit evaluating your search engine will help to keep this in check.

The next parts are more technical but your website designer should be able to help you. 

4. F-Shaped Pattern Reading

The F-shaped pattern is the most commonly observed pattern in eye-tracking studies on how visitors scan text on a website. The layout is designed to align with the natural reading pattern of Western audiences, who tend to scan text from left to right and top to bottom. The top and left areas of the screen receive the most attention. An effective website design should take into account the reader’s natural scanning pattern to improve the overall user experience. If you intended audience is not a wester audience you may need specialist advice on how best to approach pattern reading. 

5. Visual Hierarchy

Visual hierarchy refers to the prioritization of elements on a page based on their level of importance. This can be achieved through various design techniques such as size, color, imagery, contrast, typography, whitespace, texture, and style. The purpose of visual hierarchy is to guide the viewer’s eye to the most important information on the page by creating a clear focal point. By using visual hierarchy, designers can effectively communicate the most important information to the viewer. 

6. Content

An effective website has both great design and great content. Using compelling language great content can attract and influence visitors by converting them into customers. 

7. Grid Based Layout

A grid-based layout is an essential component of structured and organized design. Grids help align elements on the page and maintain a clean appearance. The use of columns and sections that line up in a rigid grid structure enhances the overall look and feel of the website by creating a sense of balance and imposing order, leading to a visually appealing result. I would recommend using WordPress and the tool Divi, in my experience they are easy to use. 

8. Load Time

Fast loading speed is crucial in retaining visitors. Research shows that about half of web users expect a website to load within 2 seconds or less, and they may abandon a site that takes more than 3 seconds to load. To enhance the loading speed, it’s important to optimize the size of images on your website. Google offer a free to use speed test: https://pagespeed.web.dev/ 

9. Mobile Friendly

Having a website that is optimized for mobile devices is essential as an increasing number of people use their smartphones and other devices to access the internet. A responsive layout ensures that your website can adapt to different screen sizes, providing an optimal user experience for all visitors. 

1O. Acessibility

Web accessibility refers to the design and development of websites, tools, and technologies to ensure that they can be used by people with disabilities. This includes being able to perceive, understand, navigate, and interact with the web, as well as contribute to it. The disabilities that affect web access can include auditory, cognitive, neurological, physical, speech, and visual impairments. The concept of web accessibility not only benefits individuals with disabilities, but also those without, such as people using small screen devices, those with temporary limitations, or those with slow internet connections. A 7-minute video is available to demonstrate the importance of web accessibility for individuals with disabilities and its benefits for everyone in various situations: https://www.youtube.com/watch?v=3f31oufqFSM

We recommend using the tool recite me. They also offer training on how to use their toolbar.