Schematically correct Markup and SEO

Website structure is important for SEO. I find out a lot of people including myself is guily for not correctly structuring websites schematically. For SEO websites should contain h1, h2, p , strong and other elements to scructure a document. I am sure alot of people are guilty for this, including me applying h* tags to make text bigger.

I noticed an issue about one of our website rankings were dropping, we included lots of key text phrases, everything we thought had been done right and could not think of a way why our ranking were doing below average.

I looked at the structure, what was behind the scenes within the HTML language. As I found that the admin was using his updatable website to present all his text in h1 format. Thus givng priority over h2. So when google comes to check for keywords within the title tags it was seeing paragraphs of text with random works instead of just a few words which tells google the purpose of page.

While our site was great from a user point of view, schematically, it was very bad.  I have found alot of people having this problem but it is easy to get sidetracked. Another issue is using strong tags on text for styling rather than emphasising.  font-weight: bold and <strong> are very different regarding to structure.

Before even writting one peice of code it is important to design a website by graphics package or pen and paper.I use Photoshop, it is easy and you can generate results within half an hour.   But what happens if you can’t afford expensive designer equipment? Here are a few alternatives on different packages which are not only cheap, they are free.

GIMP (open-source) http://www.gimp.org

This is probably the best free graphics package. While not as easy to use than Photoshop it is a great alternative.

Paint.net http://www.getpaint.net

This is a free windows package that allows simple graphic manipulation. Not tried this myself so do some research.

It is important to set out a template, I tend to do with fixed width design instead of fluid design. They are easier to design because you do not have to deal with expanded widths which could mean extra whitespace. Anyway, a template is required so you can create the design within the bounderies of the site. Designs I go for are around 980 this seems to be standard in todays browsers.

So here what a sample template would look like…..

Still needs some work but you get the idea on how it is constructed. A header section, body, menu if the design is multi-column and a footer. There is no footer design yet.