Basic Rules for an Impressive & SEO compatible Web Design

This is a guest post by Audrey Zucker. Audrey is the Managing Director at Mozaik, an Online Marketing and Web Development Agency specialising in providing SEO and Digital Marketing services. Mozaik has been awarded several times with web design and development prizes since 2005. Feel free to follow her on Twitter.


“Less is more”. With a generation of web users that absorb as much visual information in one day as our parents did in months, there is only one secret: be precise and concise. You will gain in readability and of course in loading times.

Menu & Navigation: Strategical Positioning of the elements

  1. Place your Menu on the top of the page. This is what a user needs in order to access your main pages at once and it should contain the main keywords of our SEO strategy inside the links. Place it Horizontally for less items and vertically for listing or for large menus.
  2. Submenus should be as visible as the main menu but at the same time they have to be placed strategically. Don’t ask yourself why you don’t receive traffic in the sub sections of your website if they just can not be seen. Also note that even if some of the submenu items are “no followed” or they are less important from SEO perspective this does not mean that those pages are not interesting for the visitors.
  3. Avoid as much as possible the third level menus. Note that it is usually better to implement the content in an attractive and easily accessible way in the second level pages or by using listings.
  4. Work on your internal linking strategy. Placing direct links from your homepage to the most important pages of your website can help both the SEO and improve conversion rates.
  5. When possible avoid using the “ back” button because it really shows that your navigation has issues and that the website was not seriously conceived according to the content and despite all rules of usability. Instead you should use a breadcrumb navigation.

Colours: Ensure Brand impact and Readability


Too much info kills the info and this applies also to colors. Revise your company profile and accordingly define a main set based on 3 to 4 main colors that match harmoniously. You need:

  1. 1 intense/flashy color that will stand out and that will be used for the links and for the H1-6 tags.
  2. 1 readable colour for the main text & content. It should be relaxing for the eyes and easily distinguished from your background.
  3. Up to 2 unique “signature” colours that will communicate the image of your website. Those colours have to marry harmoniously with the 2 previously selected.
  4. Don’t forget to choose dynamic and “clean” colours for titles and links and “cool” tones for the background and text. If you need more colours, use only variant tones based on the main color set.

Graphics & Fonts: it should not cost your SEO when 90% of users won’t see the difference


Surfing on the wave of the minimal trend that invaded the world of design, there will be some elements in your web design that will make the difference, while some others that only you will be able to see.

Just think seriously what is your target group and how much sensible it is to loading time versus advanced design. Then ask yourself: is it really necessary to use this element? The answer is not systematically no, since some details will really make a difference and differentiate your website from the mass. It’s all about balance.

  1. Ask yourself if a special font or visual effect that you insist on placing is actually worth using a Flash or a JavaScript library that costs you a lot in loading time.
  2. If you have to use it, make sure it will not affect your SEO campaign or your internal linking strategy.
  3. If you have to go for a Flash menu, make the proper HTML menu replacement. This can really help your SEO and improve your indexing.
  4. Prefer beautiful buttons and original details than heavy image backgrounds, huge images or gradient backgrounds.
  5. Keep it cool with the images and don’t confuse your visitors with too many visuals.
  6. Don’t forget to use the main keywords of your SEO campaign in the image names and in their alt descriptions.

Applying the above tips will not only provide you a clear and modern design but also they will help you structure your website information and proceed to the organization of the content. Moreover you will be able to positively affect your SEO by reducing the loading time and by improving the indexing process of your website.

  • Pingback: Basic Rules for an Impressive & SEO compatible Web Design | Web … :PC & Internet Lifestyle

  • Pingback: Top Motion | Internet Marketing blog » Basic Rules for an Impressive & SEO compatible Web Design | Web …

  • Pingback: Basic Rules for an Impressive & SEO compatible Web Design | Web … | SEO News & Views

  • Pingback: Basic Rules for an Impressive & SEO compatible Web Design | Web … | Articles about the world

  • Pingback: Basic Rules for an Impressive & SEO compatible Web Design | Web … | SEO Now Blog

  • Mladen

    To much color is not denial if we set thoose colors on right places. Colorful can be very fun and interesting. Especially if the site is intended for a younger population.

  • Mark

    This is useful information. However I am surprised you don’t clarify the issue with “h1″ header tags. The category keyword for the webpage should be in the “h1″ header tag. Often times it gets used for the website domain name.

  • Web Designing Mumbai

    Really very nice article. Thanks for sharing it with us. Looking forward for some more posts from your end.

  • Matt

    Props to Audrey for a helpful and concise article of tips. Are there any particular sites that you have found to be especially effective? I am always looking for inspiration.


  • Pingback: The 10 most common Landing Page Optimization mistakes | Web SEO Analytics

  • Jack Russell Training

    SEO marketing is such a huge help for small companies as well as huge ones. This is because SEO marketing is like promoting your product or service though word of mouth except that it is done digitally. If done right, it could mean huge sales growth. No wonder why almost everybody is doing it right now.

  • OS Blog

    Keeping the site snappy is absolutely crucial, much more important than most designers realize. Google and Amazon both published studies that found a fraction of a second increase in page load decreased user satisfaction.

  • Amber

    as per above shown web site structure is beneficial for online business. each and every part of website perfect visible to the visitor and also east to navigation bar so visitor perfectly browse it. its a complete SEo friendly

  • Ethan Hinson

    As another best practice. Ensure that you always use a Title Tag with keyphrases towards the front of the tag. This is probably the most important aspect of on page SEO. Your META descriptions should also contain an exact match keyword and be around 170 characters.

    In my experience the META descriptions do not have as much effect on keyword ranking, but can dramatically increase organic search click through rates since they are shown to users in search results.

  • annuity calculator

    Great tip! I really like the word/tag cloud bit. I’m discussing this with my web developer now and would implement this.

  • Aerial Installers Bracknell

    Over SEO’d content is always a turn off when I consider the SEO of the website. I hate going to a website and seeing repeated content again and again. Less really is more!

  • web design

    Hi it’s an excellent post. Really informative sharing. Thanks for it. When designing your site with SEO in mind, it is important to provide usability for your visitors and accessibility for the search engines.

Leave a Reply