Web design mistakes that hurt SEO

Key takeaways

Some design decisions quietly stop search engines understanding or ranking a site: important text inside images, navigation that works only with JavaScript, headings used for styling rather than structure, one page trying to rank for every service and heavy effects that slow pages. Fixing them helps search engines, AI tools and visitors at the same time.

• Keep key text as real text, not inside images.
• Use real, crawlable links for navigation.
• Use one H1 and logical H2s on every page.
• Give each service its own page with a unique title.

How does design affect SEO?

Search engines read a page's HTML: its text, headings, links and structure. Design choices decide what ends up there. A beautiful page whose headline is an image, whose menu only appears after a script runs and whose headings are just bold paragraphs gives search engines far less to work with. Google's Search Essentials set out the basics.

• The most common business website design mistakes
• On-page SEO checklist for business websites

Mistake 1: text inside images

Headlines, offers and price lists baked into images are hard for search engines to read and impossible to quote in AI answers. Keep important wording as real text, and use alt text to describe images.

• Text in images: why it hurts your website

Mistake 2: links that are not real links

Menus and buttons built with click handlers on plain elements, rather than proper anchor links with addresses, may not be followed by crawlers. Google's link guidance says it can reliably crawl links only when they are a proper anchor element with a link address.

Mistake 3: content that depends on JavaScript

Sites where content appears only after heavy scripts run can be slower to index and sometimes miss content. Google can render JavaScript, but its guidance explains the extra steps involved. Server-rendered content is safer for the pages that matter.

• Parallax and scroll effects: when motion hurts a website

Mistake 4: headings used for styling

Designers sometimes pick heading levels by size rather than meaning, or style paragraphs to look like headings. Use one H1 describing the page and H2s for main sections, styled however you like. Clear headings help search engines and screen reader users understand the page.

Mistake 5: one page for everything

One-page sites and pages that cover every service struggle to rank for specific searches. Give each main service and location its own page, with its own title and description.

• One-page vs multi-page websites for small businesses

Mistake 6: slow, shifting layouts

Heavy hero videos, sliders and animation libraries slow pages, and late-loading banners make layouts jump. Core Web Vitals measure loading, responsiveness and visual stability; they are part of how Google assesses page experience. Lighter design usually scores better.

• Core Web Vitals for business websites
• Why your website jumps around while it loads

Mistake 7: intrusive pop-ups on mobile

Pop-ups that cover the main content as soon as a mobile visitor arrives frustrate users, and Google has said intrusive interstitials can affect how pages rank. Use small banners or delay offers until visitors have engaged.

• Intrusive interstitials: pop-ups Google marks down on mobile

What does this look like in practice?

A pattern we see: a redesign launches with headlines as images and a script-driven menu, and search visibility drops. Restoring real text headlines and proper links gives search engines the content back without changing the look.

• See client work
• Website Design & Development for UK businesses
• Website design review: score your own site in 30 minutes

SEO design checklist

• Keep key text as real text.
• Use proper anchor links for navigation.
• Render important content in the HTML.
• Use one H1 and logical H2s.
• Give each service its own page.
• Keep pages light and stable.
• Avoid intrusive mobile pop-ups.

Next step

View your homepage with images turned off. Whatever disappears, search engines may not see either.