Twelve Simple Ways To Write Search-Friendly HTML Code
This morning I was handing off a project to a developer and found myself ranting about the common mistakes developers make when coding HTML. These boneheaded mistakes can cause search engines to choke when it comes to indexing your websites. And its easy to avoid making these mistakes. Here’s how:
- Don’t repeat yourself. Use server side includes for headers, footers, menus, and standard <head> items such as links to CSS documents and external JavaScript files.
- Balance tags in server side includes. If an include file starts with <div> it should end with </div>. This way each file can be viewed in Dreamweaver design view, and includes files do not depend on each other.
- Place JavaScript in external files and reference them as needed.
- Each page must have a unique <title> and <meta name=”description” content=”This is a sample.”>. Don’t put these in server side includes.
- The title should be <title>Name of Company – Name of Page</title> or <title>Name of Company – Name of Category – Name of Page</title> unless you are told otherwise.
- The description should be the first one or two meaningful sentences of content unless you are told otherwise.
- Please make all links and references to images, CSS and JavaScript root relative by starting them with a slash, "/". If you use Dreamweaver, set the “Links relative” option to “Site root” in the Site Definition wizard.
Root relative links don’t break when files are moved from one directory to another. - Too many files in one directory makes things hard to find. Use subdirectories.
- Run your code through a validator and keep it clean. Removing trivial errors makes real errors easier to spot.
- Use CSS with HTML elements like <div>, <span>, <p>, <h1>, and so on, to format things. Only use layout tables when they produce better results or cleaner code than CSS.
- Use heading tags, unordered lists and numbered lists to organize content rather than spacer graphics and nested tables..
- Consistently use the simplest URLs. Link to “/” instead of “/index.php” or “/news/” instead of “/news/index.php”.
These recommendations may help sites work better, make pages look good on different browsers and mobile devices, cause pages to load faster, save money, and boost search traffic. If you’d like to discuss or debate these ideas, meet me at SMX Advanced Developer Day.
Jonathan Hochman has two computer science degrees from Yale. He is a principal of Hochman Consultants, an internet marketing firm.
Opinions expressed in this article are those of the guest author and not necessarily Search Engine Land. Staff authors are listed here.
About The Author
We're listening.
Have something to say about this article? Share it with us on Facebook, Twitter or our LinkedIn Group.