WordPress

SEO Part 3: Webpage Structure

It has been awhile since Part 2, as we have been busy. You might notice a new website design here at MOD, in addition to many other projects we have been working on. Now it is time to write again, and Webpage Structure is the topic. As always, the target audience is someone not familiar with search engine optimization (SEO)  and who is not a website designer or developer.

When referring to webpage structure, I am  talking about the guts of the webpage. The code that makes the page work. In SEO Part 2 the discussion was technical, but this time actual programming is going to be discussed. But I am not going to program my own website, so why do I need to know this? Have no fear: The concepts here are still going to be discussed at a high level. The goal of SEO Part 3 is to introduce some more discussion points to bring up to your web designer, as well as giving you things to look for in test on your finished website.

The URL, Part 3

One often overlooked part of the URL is whether your website is using www or not using www. Although there is some debate on whether this should be used or not, it is more important that you choose one, and stick with it. More importantly, make sure you site enforces your choice. This is where the programming comes in.

First off, it is common for your website to be accessible from both the www and non-www URLs for your domain name. To test this, just type the two different URLs into your browsers address bar, and see if your website comes up. For the MOD site, both http://melissaoyler.com and http://www.melissaoyler.com will end up on this website.

The next thing you will want is to make sure that for whichever version of the URL someone types in, the version you want to use is what gets displayed. Again using this site as an example, we chose http://melissaoyler.com as our preferred URL. If you go to your address bar and type in http://melissaoyler.com you get to this site and everything is fine. However, is you type in http://www.melissaoyler.com you get automatically redirected to http://melissaoyler.com using a 301 redirect (as discussed in SEO Part 2.)

There are two reasons to want to make sure this works. First, many people will not remember which version of your URL to use. Many people always seem to put www in from front of the URL, even when it is not needed. Some people just will not type it. Second, inbound links from other websites will also come in both versions. Since inbound links are not something a web designer can really help you with, I have not written about it, however inbound links from other websites are very important to SEO. Make sure that not only your homepage will redirect to the URL that you have chosen, but that every webpage on your site will automatically adjust to the correct URL, as well.

But as long as both the www and non-www version of the site work, why go to all the trouble of the redirection? You do this because technically these are two different websites, and search engines will treat them as two different websites, splitting the number of incoming links between them. There are some other ways to prevent the links from getting split, but they are specific to each search engine (and discussed in SEO Part 4) but if you use correct the correct redirect, it works for everything.

Heading Tags

Heading tags are simply the headings on your webpages. If you view the source of any webpage you visit, you will see the raw HTML code, and in it will be tags such as <h1>…</h1>, <h2>…</h2>, <h3>…</h3>, possibly all the way to <h6>. These tags represent the headers in order of precedence on the page, with <h1> being the most important, <h2> the second most important, and so on down the line.

As the <h1> tag represents the most important heading on the page, it is very usefull in SEO. It does not have to match the page or website title. It does not even have to be the first heading on the page. What it does need to be is unique and relevant to the page, like a blog title, and there should only be one of them per page.

As for the rest of the heading tags, they should be used in order of importance. For example, on this page, the blog title is in the <h1> tag, and then the <h3> tag has been used to highlight each concept on the page (e.g. Heading Tags.) Since I do not want to have multiple <h1> tags on a webpage, I only use <h2> tags on the category pages for each blog title.

Duplicate Content

With the fact that good content is crucial to getting your site ranked well, you need to keep in mind that duplicate content is something that you do not want. The issue is that, for various reasons, some search engines are designed to detect duplicate content and count it against the page ranking. That’s easy because I am not going to try to beat the system and put duplicate content on my website. Well, what you also need to look out for is if your website is duplicating content on its own. If your site has automatically generated category pages, viola: duplicate content.

Category pages, archive pages, tag pages: they all duplicate. Now there are a couple of ways to avoid this type of duplicate content. One way is to setup a robots.txt file. The robots.txt will tell robots (search engines) which directories can be searched, and which ones to avoid. This method is good for blocking resource directories and CMS specific code, but it does not work as well on the content. For the content, the robots meta tag really does the trick. The robots meta tag can be programmatically added to pages within a CMS using <meta name=”robots” content=”directive”> where the directives that can be used are:

  • index: index the information on the webpage
  • noindex: do not index the information on the webpage
  • follow: follow the links present on the webpage
  • nofollow: do not follow the links present on the webpage

So, for a typical category page, you would want to see <meta name=”robots” content=”noindex, follow”> so the a search robot will not index the content on the page, but it will follow the links to find more content.

Images and Hyperlinks

This one is simple, and with a good CMS it is easy, too. When you add images or hyperlinks to a webpage, they should have some sort of description added telling people, and search engines, what they are. These are also the descriptions you see when your mouse hovers over and image or a hyperlink.

For an image, you need to use the alt=”description goes here” syntax within the image tag. Most modern CMS will simply ask you for a description for any images that you add to the system, and will put them in the correct part of the HTML code for you. You should also make sure that your web designer adds the alt syntax to the images on your sites layout.

As for hyperlinks on your site, this is basically the same process, only the syntax used is title=”title goes here” and it goes in your image tag. Again your CMS should allow you to add this without much effort. Same for your web designer. Make sure these are in place and ready to go everywhere on your website.

External Scripts and Styles

Finally, we come to the use of external scripts (JavaScript) and styles (CSS.) The use of both of these technologies are standard on modern websites, and they do a lot for the user experience. The only issue with them is that if you include them on every webpage, then you run the risk of diluting your keyword density in various search engines. The trick to this is, instead of including them on every webpage, you create external files that contain the information, and you link to them.

To tell if a stylesheet has been externally linked to your webpage, view the source of the page and look for a line near the top that looks similar to this:

  • <link rel=”stylesheet” href=”/folder/style.css” type=”text/css” media=”screen” />

For scripts, it is also near the top of the code:

So, that is pretty much the crash course introduction to what you should be looking for in your website. This really only scratches the surface of what can be done for good SEO, but you should now have an idea for the discussions you need to be having with your web designer, as well as some quick tests you can run on your finished website.

Coming next: SEO Part 4: Other Resources

WordPress

Microsoft Moving to WordPress

So I get an email today from a friend of mine: Thought you may get a kick out of this. http://techcrunch.com/2010/09/27/windows-live-blogging/ Windows Live being migrated to WordPress Specifically, it looks like Microsoft is moving the Windows Live blogging service to WordPress.com. Is it April 1st again? No. Sure wasn’t expecting that one, but as a […]

WordPress

SEO Part 2: The Technical Stuff

As we move into the more technical aspects of search engine optimization (SEO), this is still not intended to be a technical guide. Continue to keep in mind that this is not a deep dive into SEO, but the basics. The target audience is someone not familiar with SEO, and who is not a website designer or developer. […]

WordPress

SEO Part 1: The Simple Stuff

I was talking with a friend the other day about websites, and as it usually does the topic of search engine optimization (SEO) came up. My friend was familiar with the concept of SEO, but was not sure where to start to process. As we talked, it became apparent that it was time to write […]

WordPress

Does having Dreamweaver CS5 make you cool?

Since the announcement last week of free CS5 training on creativeLIVE, I have been waiting for the Dreamweaver CS5 introduction. Since this is the tool that I personally use the most, it was quite the tease to have this segment of the Creative Suite CS5 series last. That being said, here I am, 6pm EDT, […]