The easiest way to explain┬áSEO is to simply say “Think like Google” but how? Well, when you take away all the glitz and glamour of beautiful graphics, layout, JQuery animation and cunning use of Flash – what exactly are you left with?

That’s the thing.

I think most people on the Internet, or certainly most web designers, are familiar with WordPress – though a lot of designers might mistakenly believe they are above it and WordPress is only really for complete beginners, and yes, I do understand their point of view. I was like that myself just over a year ago, the days before my epiphany, the days before I started using WordPress. To them I would just say this – “Don’t re-invent the wheel, and there’s no point swimming against the tide. There are thousands of WordPress developers and plugin authors all over the World working round the clock to make WordPress an even better platform than it already is (and it’s free) – just work with it. Integrate your work into it and you won’t look back.”

This post is about one particular enhancement to WordPress’ arsenal. It’s the plugin that most WordPress users know and love and it’s called the ‘All in One SEO plugin’.

In and of itself WordPress does a great job of optimising for search engines, but combine it with a plugin like the All in One SEO plugin, you really do have an advantage, which is why whenever you search for anything on the Net you’ll generally find a WordPress site or two in amongst the top 10.

Firstly; if you don’t already use Firefox, I suggest you download a copy. I’m not going into a browser war rant. IE is easily the fastest browser for displaying Flash content – hands down! However as a web designer/developer the plugins available for Firefox make it a CSS designers dream, there’s a free plugin called Firebug and if you don’t already have a copy I strongly suggest you download it and give it a go, and while you’re at it, it would be a good idea to also download the ‘Web Developer Toolbar’ – but that’s enough of that!

This post is about SEO and the All in One SEO plugin for WordPress, and here’s the crucks of the matter right here –

The H1 tag.

Or maybe I should put it like this:

The H1 tag

Yes, we all know it looks nasty, but that’s what CSS is for, and that’s not necessarily to make it look nicer. CSS can also be used to move it completely off screen, not hidden per se, but just well off screen.

All search engines see once you remove the glitz and glamour of graphics and styling is just text, which is why I mentioned Firebug and the Web Developer Toolbar earlier. With the Web Developer Toolbar you can easily disable all CSS styling and just see the raw text that a search engine will also see.

With that in mind, try disabling CSS on your website and see how it looks.

See what I mean? Maybe your site is stunning, but when you look at it the way a search engines like Google or Bing etc… see it, then it’s a lot easier to see where the search engine rankings are going. Having said all this; being at the top of the search engines will always be a game of cat and mouse, because 10 billion websites can’t all be in first place in the search engines and thus the ranking formula and criteria to rank above another website vieing for the top position has been and always will be a dynamic process – out of pure necessity.

Anyway, I will philosophise in another post. To sum it all up in one punchy paragraph do this to your website to improve is search engine ranking position:

With the All in One SEO plugin, go to it’s settings. Near the bottom of the page you will see a box that looks like this:

all-in-one-seo

Under where you can see ‘Additional Home Headers’ you can see I’ve place my text inside an h1 tag, which is wrapped in a ul tag. It’s unlikely that this combination of HTML tags are used elsewhere in the site (I know on my site they’re not). It’s just called ‘specifisicity’ which allows me to create a custom tag in my stylesheet for this specific combination of HTML tags.

This style is added to the stylesheet for my site:

ul h1{height:0;margin:-31px 0 0 -9000px}

What this does is to allow me to use the power of the h1 tag – all search engines that I know of will see the h1 tag as important. By combining this style with CSS, it means when CSS stylesheets are active in a browser the important text I have (that looks dreadful) will not be hidden, just displayed a long way off screen.

So when the stylesheet is disabled or ignored (as it is with Google and other search engines) the text contained within the h1 tag will be visible. Not only that the text within the tags will be given more weight thus improving your performance/ranking within a search for those ‘key words’.

Simon

2 comments

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>