9 search engine-friendly website design tips

Attractive web designs can get you customers, but only if the website is achieving a good ranking on search engines. Therefore, as a freelancer, you can attract potential customers by making your web pages SEO friendly.

search engine-friendly website design

Here are nine design tips that will make your site rank and get noticed, as told by Sam Sayer, Creative Director of DeType.

Follow standards that SEO loves

The World Wide Web Consortium (W3C) is an international group that develop open standards to ensure the long-term growth of web development. Their aim is for websites to use neat and readable code. By following W3C standards:

  • Visitors can view your web page in various browsers and devices (including smartphones and tablets).
  • Your site will use Cascading Style Sheets (CSS). This design code makes web pages loading faster and CSS sites consume less bandwidth, keeping your hosting cost low.
  • With CSS, it’s easier to change your site’s colours and fonts. You don’t have to edit every individual page, reducing your cost and time spent.
  • Search engines will have an easier time accessing and indexing sites designed according to web standards.

Keep your HTML documents lean

Don’t include any JavaScript and CSS codes in your HTML document. Keep these two in a separate document or file. By making your HTML document clean of clutter, search engines can index your site faster. Also, consider avoiding programs like Flash since it can slow down search engines from indexing your site. If you want flashy effects, use CSS and JavaScript instead.  

Add readable content to your web pages

As a freelance web designer, you know that even well-designed sites can’t attract search engines with little content. While it’s easier to use images for your site’s text, search engines can’t read it. If your site is made up of mostly images, consider adding headings and links. You could also add short paragraphs to describe your images or web page. DeType.com is an example of a web page that combines images or videos with text.

Use the URL to describe your site

You may notice that some URLs contain special characters and numbers. Don’t let that happen to your site’s URLs because search engines will have a hard time “reading it”. Instead, create URLs that are readable and contain keywords that best describe each page.

Prevent search engines from seeing unwanted pages

Often, there are pages on your site you don’t want search engines to see. There are various reasons why you don’t want them to be visible because they are:

  • Server-side scripts
  • Pages for testing your web designs

If you don’t hide these pages, the search engine may penalise you for duplicating content and diluting your site’s content density.  However, you can use ‘robots.txt’ or protect the hidden pages with a password to prevent search engines from indexing them.

Always include Alt attributes in images

Consider adding an alt attribute to every image in your site. Make it descriptive and add a keyword if possible. This practice is also 100% W3C-compliant. Search engines like Google may rank the alt attribute as a relevant factor if it’s in the search terms. Aside from SEO, alt attributes help users identify images they can’t see.

Keep your pages updated with fresh content

If your site has a blog, consider placing excerpts of your latest posts on your pages. Such an approach will indicate that the site is updated with fresh content and attract the search engine’s attention. By routinely changing the content, search engines will come to your site more often. Just don’t show the full post to avoid ‘duplicate content’ issues. 

Meta tags are still useful

Meta tags are the short text that describes your page’s content. You won’t see them on the page since they are in the page’s code. Don’t forget to include the following:

  • Title tag – Often, this is the text you see at the top of the browser and search engines consider this as a page’s title.
  • Meta description attribute – Give a simple introduction about your page.
  • Meta robots attribute – This is where you give “instructions” to search engine crawlers or robots on what to do with the page.

The Meta keyword attribute was once a valuable tag, but that’s no longer the case. Due to abuse, Google no longer considers this Meta tag for SEO purposes.

Use the right heading tags

Heading tags can help your web content by providing search engines with information on your HTML documents. Search engines like Google often value these tags on the page except maybe hyperlinks.

For your page’s main topics use the <H1> tags. Use other tags <H2> to <H6> to provide a hierarchical order to your content. It’s also best to use one <H1> tag per page so that you don’t dilute your main topic. 


Freelance web design is not an easy task, however, don’t let that distract you from your ultimate goal – to attract web traffic. To achieve this you need to ensure every part of the design is search engine friendly from the content to the coding standards and tags. For an existing website, check and update its design to make it search engine optimised and achieve high ranking results.

More on marketing for your freelancer business and starting up