In part 1 of Learning the Anatomy of a Web Page we looked at the things you don’t see on a website as a user, but are important to both the user experience and search engines – those things called Meta data. Today we are going to take a look at the “in page” factors which users in general will see on your website and in many cases are what contribute most to your “on site seo”.
Everything we are talking about today lives in the “body” of the webpage. In theory, anything in this section is visible to the user though their browser. The area looks something like this.
... <body> <Main Content Area / Section> Your Content Here, Including Images <End of Main Content Area / Section> <Sidebar> Sidebar Content <End of Sidebar> <Footer Section> Footer Information <End of Footer Section> </Body> <!-- end of body-->
To examine each area / section in detail we need to understand a few things first.
HTML (HyperText Markup Language) is the code behind websites, its the framework everything sits on – on top of this you can have some neat CSS (Cascading Style Sheets) and JS (Javascript). Below it, in the framework, you will have things like your CMS (content management system) such as WordPress and your Database (which holds all the data in storage). This post concentrates on the HTML of the website, not it’s presentation (CSS & JS) and not its back end (CMS and Database).
There are now 2 common forms of HTML, HTML 4 which is now slightly old but most commonly used, and HTML 5 a new standard which is quickly being adopted. This post doesn’t concentrate on either, though examples in both forms (at times) may be given.
Main Content Area / Section
The main section of any web page is of course it’s primary content. A good example of this primary content would be this article. It is made of up an image, text, header tags and links. As such it’s a fairly standard piece of content to dissect and understand.
Textual Content
Text is the main content on almost every website, it is certainly the most common form of content and the easiest for a search engine to parse and understand semantically. Textual content can include many things such as emphasis (italics), strength (bold), understokes, strike through’s and more. They should be used sparingly as they can have some effect on SEO, though the extent of this is not known – so be aware and use with caution.
Textual content should be clean and easy to read. In most cases it should be free of spelling mistakes and grammatical errors – though not in all cases. For example a blog such as this may have many typographical mistakes but not so many as to detract from the quality or meaning of a post – therefore it does not always matter to get everything perfect in web content.
As we will spend more time on each of these sections and how to optimise them in coming posts I won’t spend too long explaining these areas of content.
Images and Graphics
Images, such as Photographs of Weddings, can be amazingly useful on a web page, for both giving a focus point and expanding your content in general. As they say, one photo is worth a thousand words.
Optimising an image is down to a few things. 1) always using “alt” text with each and every image to explain what is in the photo to search engines (and browsers for visually impaired users). 2) place the image using CSS not inline styling (this speeds up load time). 3) optimise the image for web usage in terms of file and physical size, using software such as photoshop or GIMP. Doing these 3 things can help optimise your images for SEO.
Again we will look more at SEO for images in coming posts.
Header / Heading Tags
Heading tags are ranked 1 to 6, 1 being the most important. They are used to section and subsection content on a website and in general add some structure to your textual content. They look something like this.
<h1>Your Primary Heading Text</h1>
Used correctly, heading tags can help search engines filter your content and show it more often (in many cases) in search results because it knows a given section is about a given topic. For instance this section has a heading tag saying “main content area / section” and the next says “sidebar area” this means that search engines know there are two distinct topics in this post and not one “big topic”. Heading tags are therefore a good way to introduce keywords to a page.
Link Optimisation
Link optimisation is often something you hear in regards to “external links”, links which point to another website and not internally. But did you know that optimising your links can have as much effect on your internal ranking as those you pass to the external world?
Use of correct anchor text to another internal page can make the difference between link juice being passed and not. For instance at the top of this post i link to the previous article, part 1, but I do so to the title not to just “part 1″ this is because part 1 is non descriptive and therefore of very limited value in SEO terms. So therefore I link to the main title to pass more juice.
Another advantage to this is that is people scrape your content, as is often the case with SEOAndy, they often leave links alone and so you get a nice keyword rich link to your content. Also this brings me to a second point. All internal links should be absolute links, this means not just to “/about” but rather to “http://www.seoandy.com/about” this is much nicer in terms of future proofing and if someone takes your content.
Finally, all internal links should be without a “target” and all external links should be target “_blank”, this means they open in a new tab.
In the next post we will look at optimisation of textual content and how to ensure you are getting the most from your website text content.
Original Content by SEO Andy @ Learning the Anatomy of a Web Page – Part 2
