Designing your first web page with WordPress can feel a bit daunting. I know, I’ve been there.
Before you jump in and get into your first web page design, I’ll outline some key factors, including the most important, user experience (UX).
User experience (how website users interact with your website) is one of the biggest factors impacting your website.
If visitors experience poor UX when visiting your website, Google will penalise it heavily. It is the same for website responsiveness for tablets and mobiles.
User experience relates to any aspect of the website that encourages ease of use and good navigation.
Websites with good user experience would cover the following:
- Easy Navigation:
- Information is useful
- Create desire
- Is mobile responsive
- Accessible for all users (see below)
A great read for those who want more information on user experience is this book:
Fonts and Colours
Fonts and colours are closely linked to user experience, especially accessibility.
Google will now penalise websites that aren’t accessible for all users. Fonts and colours contribute towards accessibility and therefore need careful consideration.
Fonts should be legible, and when using a font that is harder to read for some visitors, alternatives should be available. For example, many calligraphy fonts can be hard to read.
Colour, and especially color contrast, needs to be thought-out. Font and background colours that blend in can make it impossible for visitors to read the text. Colour blind visitors also need to be considered.
We use this useful tool to help with colour contrast when designing websites.
This tool will offer feedback on the colour contrast and what the text will look like in greyscale (for colour blind users).
Web flow relates to how the web page is structured and, as the word suggests, the progression.
The content should be easy to read and have a natural flow to it. Think about a newspaper or magazine article.
A user having to move their eyes all over the web page will find it hard to read and likely to leave, informing Google that the page content or user experience is not that great, resulting in poor SERP (search engine results page) position.
Another element of web flow is the use of header tags (e.g., H1, H2, H3, etc.). These should be used correctly to help Google and accessibility. I’ve outlined below what each header tag should be used for:
H1 – The post or page title
H2 – This is a sub-header(s) that specifies the different paragraphs. Keywords should be used where possible within an H2 tag.
H3 – Can be used for further sub-headers if required.
Other header tags can be used for additional sections (e.g., bullet points).
Design for browsing
The design of your website should make it easier for users to navigate and browse. Website visitors shouldn’t have to search endlessly for information and will invariably leave the website if they do.
This image shows a website that has a poor design.
Check out this link (www.dallamano.co.uk) for an example of a website well designed for browsing.
Most website templates will provide the basis for good website design and layout that will enable users to design a website that is optimised for mobile and tablets and engages with visitors.
This blog follows on from recent series providing hints and tips on WordPress for beginners including:
We also provide video tutorials on our YouTube channel.
Click here to visit our channel.
Designing your first web page for your website can be an exciting time. If you follow the advice given and use the resources I recommend then I’m sure your website will be successful.