Designing Your Website for Search Engines

I've discussed how Google and the other search engines pay extra attention to things like the contents of the <title> tag in my other SEO Tips pages. But what I haven't discussed is the importance of the structure of your webpages, and the structure of your website as a whole.

The first principle of search engine friendly design is to make sure that the HTML and CSS code for your webpages is free of technical errors. An HTML or CSS validator will check your pages for such errors and can often suggest how to repair them. The second principle is to make sure that all of the links in your anchor tags (<a>) are correct. You should strive to use complete URLs in your links (that is, complete URLs starting with "http://") to insure they are pointing to the intended page. Relative links (that is, URLs consisting only of a file name, or preceeded with a shorthand directory path such as "../") can lead to broken links and other problems when poorly designed crawlers scan your site. These crawlers often create bad links, such as using the wrong version of your domain name or using "https://" instead of "http://" - both of which can cause canonicalization problems.

Once the technical issues are covered, you need to begin to think about the structure of your webpages. The search engines have become quite adept at determining where the most important content of a page resides, but you can help them by keeping to a well-structured design for all of the pages on your site. Use block-level tags like <DIV>s to structure your page, and where practical, use "id" attribute names that are meaningful (ie. "header", "menu", "footer", etc.). The advent of HTML5 will allow adding a formal structure to your pages, but until that standard is widely accepted and used, you should add these hints.

It's a good idea to try to keep the primary content of your pages as close to the <h1> tag as you can, and use <h1> only once on each webpage. The search engines know that the <h1> usually denotes the main topic of your page, and they pay more attention to the content that immediately surrounds it. Similarly, they tend to pay less attention to content (and links!) in navigation menus, blog rolls, and page footers.

Google has become increasingly sophisticated in its ability to analyze the semantic content of webpages. While it's still a good idea to use an outline-style for tags like <h1>, <h2>, etc., and to emphasize important words and phrases in <b>old tags, those HTML tags play a much lesser role in ranking these days. Google prefers a robust use of related terms over endlessly-repeated keywords. The other search engines follow this practice to one degree or another as well, so it's best to use natural language and to include ample content for them on each page.

The legacy of the Myth of the <META> tag still haunts many web designers. You'll often see a Keywords <META> tag stuffed with dozens of keywords, including past tense, future tense, past tense possessive, plurals, and singular variations on the site's keywords. Don't make yourself crazy here. First of all, only Yahoo! pays any attention to the Keywords <META> tag for ranking. For your main page, eight or ten broad-term keywords in this tag are plenty. Let the interior pages bear the burder of more specific keywords and phrases. The only <META> tags your webpages need are (1) Description, (2) Keyword, (3) Content-type, and (optionally) (4) Robots. All of the rest are superfluous as far as search engines are concerned and will not help your site to perform better. While Google does not use the content of the Description <META> tag for keyword ranking, there is good reason to believe that having unique, relevant, and useful content in this tag is an important signal of quality for that page, and for your site as a whole. Further, since Google will often use the content of the Description <META> tag for the snippet it displays in the search results, it's just common sense to include a description that will entice users to click on your link in the search results.

Don't try to make your main page bear the burden of snaring traffic for all of your website's target keywords. The main page should hit the primary broad-theme keywords and the internal pages should focus on the more specific topics. Too many sites try to cover every topic on their main page with every conceivable combination of their target keywords. The more focus your main page puts on your primary topics without "keyword stuffing", the better off you'll be in the long run.

So the theme here is, to borrow a phrase, "Don't Bury The Lead." That means removing unnecessary clutter from the <head> section, putting your most important information in the first paragraph or two of your document's main content, which should absolutely include an <h1> tag to emphasize the primary topic of the page as well as the location of the main content. And remember that the <title> tag is the most important piece of real estate on your webpages. It needs to be attractive, consice, and relevant to the page content.

Website Navigation Structure

Finally, there's the issue of the navigation structure of your website. That is, the link pathways through your site that start on your main page. The navigational links on your site should largely follow a hierarchical pattern. The main page should always link to the most important pages on your site such as main category pages, and then those pages should link to the less important pages, such as pages that discuss specific topics or detail individual products.

This approach has several advantages. Not only does it keep your website well-organized and easy to expand and maintain, it promotes a controled flow of link value (or PageRank) through your site so that the most important pages get the most "link juice", the secondary pages get a bit less, and the least important pages get the appropriate value in the end. Note that this link structure is not the same thing as your site's directory structure, even though it's usually nearly identical. This is simply a question of navigation pathways you create with the links on your site.

If your website relies on a database for the content of your pages, you should strongly consider using server control methods to avoid having query strings (ie. URLs that include control parameters following a "?"). For example, a clean, well-structured URL such as:

is better for search engines than a complicated URL such as:

There are several reasons why you should avoid relying on query strings in the URLs for your website. First, if you mix the order in which the command parameters are listed when you link to such pages, the search engines will try to index all of the variations separately which will lead to duplicate content issues. Second, query strings look like gobbledygook to users and they can get confused or intimidated by them. Third, if you need to change the underlying software that creates your pages based on URLs that include query strings, you're likely to have to change those query strings which can require setting up complicated 301 redirects in order to keep users and search engines from seeing "404 Page Not Found" errors. Most of the popular scripts for blogs and shopping carts now have optional settings or plug-ins available to eliminate the need for query strings, and you should use them if you can. If you need help, search on "search engine friendly URLs" and you'll find lots of good advice.

Google adds extra support for hierarchical website navigation through their support of breadcrumbs in microdata and RDFa mark-up formats that they will sometimes use for providing Rich Snippets, Sitelinks, and other features in their Search Engine Result Pages (SERPs). Your website must be properly coded and have gained enough overall trust and strength for these features to be added to your listings, so you have to put in the time and effort required to qualify for them. When you do, it can really make your site stand out. And all it takes is adding some additional tags and attributes to your normal HTML mark-up, so anyone can do it.

Having a strong hierarchical structure in your website navigation design is best practice even beyond to the impact on search engine rankings. The effort required will pay off quickly in many, many ways in the improved performance of your website and in reduced design maintenance problems.

This SEO Tip by Rainbo Design was last updated on June 25, 2011