K.I.S.S. - Web Design for SEO :: Part 2
 

Back | Print Version

Web Development (Coding)Web Design (Visual)Search Engine Optimisation

Oyster Web Articles

K.I.S.S. - Web Design for SEO (and Happy Users) :: Part 2

K.I.S.S. - Web Design for SEO :: Part 2


by Bill Marshall
of http://www.oyster-web.co.uk

Last updated: 11 Sep 2007

Copyright Bill Marshall, CSS Guru October 2005

Remember those old HTML files with the grey backgrounds and Times Roman text with headers. Make up a page now - a simple enough page - a main header to tell people what the page is about, a couple of paragraphs of text, a lesser header introducing a subsection, another paragraph or two, a section about yourself or your company, a few navigation links. Throw in a page title and a meta description. There, now you have an ideal structure. People can understand it, search engines will love it.

What? it looks dreadful?

Ok, now just attach an external CSS file to the page and you can make it look like anything you want. Define the H1 and H2 tags - give them a colour, font-style, margins, borders, background colour or image. Style the paragraphs as well. Give the body tag a background colour or image too. Want to have the second header section in anotehr part of the page? Put a div tag round that section and give it an ID. Give that ID a position, border, margins and padding, and you can put it anywhere you like and make it look anyway you like. Define the paragraph tag relative to that ID and you can make it entirely different to the main text.

That list of internal links - wrap it in a div too, position it wherever you like; along the top of the page of down the left hand side or anywhere else that takes your fancy. Hide bits of it until other bits are clicked on. make it look like buttons with 3D borders. All this is in the CSS file apart from the wrapper divs and maybe a few classes in the page code if you get really fancy. If you later expand that page to a hundred pages then it'll still be the same CSS file controlling them all. You can add new divs and classes as it grows and change all the pages instantly whenever you want. Total control. But the important thing is - the structure is always there. You can add more H tags to it. Add lists, tables (they're still useful for tabular data), columns, javascripts, even Flash if you must, but the basic structure remains secure and the site will be understandable. The Content will be easily updated when necessary too - it'll be so simple that any text editor will suffice. Complete separation of content and style. And it'll look as good as you can make it. Happy users, happy search spiders, happy clients!

Article Continued

If you are interested in having optimized web site design methods applied to your website simply contact us.

Search Engine Friendly design and Redesign Consultancy

Related Content
Free Search Engine Positioning Report

Search Engine Optimization