loading loading

How SEO and web design should work together


We adopt these 10 techniques to ensure our digital work is Beautifully Effective®

How SEO and web design should work together

As an agency, we have had to work out how great web design and great SEO can co-exist and work together in harmony. The truth is that this relationship is not a simple one and there are lots of strategic decisions and small compromises that need to be made along the way – but it is possible.

With many of our clients’ projects presenting this challenge, we’ve spent a lot of time developing and refining an effective process. We’re happy to be honest and say ‘it is not easy’. It takes the right skilled people in the right process. But we live in a sales-driven world where many agencies suggest it is simple and most clients don’t have visibility of it being complicated.

This guide will provide you with some directional advice for designing, building and writing a website that works across all the required areas. If you use your website as a direct sales channel or a channel to drive enquiries, then can you really afford not to?

SEO Tips for Web Design

Tip 1: Introduce image overlays

Overlay images are an effective way to include important SEO text without compromising design. Initially when viewed, the image will appear as intended, but when a user rolls over the image, key SEO content is revealed. Search engines will ignore the image and read the overlaid text – a great tool for including key product descriptions.

A Guide To: SEO and Web Design Working Together

Tip 2: Position important content at the top of the page

Search engines can become lazy and only read the initial contents of a page, therefore it is vital that any key subheadings, phrases and navigation links are designed at the top. Key H1 headings should be included first, with any homepage brand straplines positioned secondary to these.

Tip 3: Remember H2 subheadings

Whilst it is necessary for every page to have a key H1 heading to benefit SEO, H2 subheadings are often forgotten about. These subheadings should be introduced at natural points throughout the design to ensure the page is easy to read. Search engines will read H1’s first and subsequently H2’s before the reading the remaining page text, therefore subheadings should be keyword-rich to help the search engine determine the page content.

Tip 4: Keep images sizes to a minimum

Large images can have a significant impact on your page load speed, which is a key contributor to SEO performance. Optimise your images and ensure that the dimensions and dpi are no larger than necessary to keep page load times at an optimum speed. For icons, it’s worth considering the use of SVGs as they often have smaller file sizes than PNGs and JPGs, with an added bonus of looking crisp on retina screens.

Tip 5: Limit the number of web fonts

Web fonts enable us to craft websites that are beautiful and on-brand. But the inclusion of several different fonts can be detrimental to page load speed. Google Fonts offers useful and practical guidance about the use of web fonts, making it easier to understand their speed implications.

A Guide To: SEO and Web Design Working Together

Tip 6: Introduce animation

Interactive elements like animation offer users a more engaging experience, which can help to increase dwell times and conversion rates, and also have a positive impact on ranking. Animated infographics, process graphics and engaging hover effects are just some of the animated tools we use to help boost engagement and improve user experience. It’s worth noting that slow-loading animations can have a negative impact on page load times, so try to ensure these are optimised.

Tip 7: Incorporate breadcrumb navigation

Breadcrumb is a form of secondary navigation that reveals a user’s journey through a website, enabling them to keep a track of their location. Its essential to integrate this into a site’s design for a seamless user experience, and it’s an effective way for search engines to understand the structure of a site, which can improve rankings.

Tip 8: Embed videos

It’s a common misconception that video has no implication on SEO as it’s not text-based content. However including video on your website can engage users and increase dwell time. An increase in views can also demonstrate a higher page engagement, helping websites climb up Google’s rankings. Hosting videos on platforms such as YouTube or Vimeo and embedding them on your website will ensure your site’s speed is not affected by slow-loading content.

Tip 9: Think about the user journey

As I’ve mentioned previously, keeping users on a website for as long as possible will help to improve SEO performance. User experience (UX) can be instrumental in increasing dwell time, so providing a simple and intuitive experience can help users find exactly what they’re looking for. Users can become frustrated by dead ends so ensure the site’s navigation is simple and clear.

Tip 10: Add footer links

If a page is linked to several times in a website it can help search engines recognise the importance of the page, thus helping it to be listed more prominently. Footers are an ideal location to include links to pivotal web pages such as those in the top level navigation, any key sub navigation pages and sitemap links. Including these in the footer design will increase the number of times they are linked throughout the website without impacting the user experience. In-page links can also be used to help boost a page’s visibility.

We hope these tips help you and if you are looking for a new website design that is both beautiful and effective, striking the right design and SEO balance, then please do get in touch with us at [email protected] or by calling 01202 330 000.