Website Source Code

Good website code can be considered in two ways, compliance in a technical sense and how this assists search engines. Technical validity helps, as a discipline, for browser compatibility and to avoid errors which can impinge on search. In general though, search engines are not reliant on valid code, to understand or rank pages.

We want to look at optimising source code from a search perspective. There's a video above from Matt Cutts, mentioning the value of good titles or descriptions and how they can help bring visitors. No guarantee your own entries will be used but they generally are and for most sites, can be easily changed via HTML tags.

You may be used to dealing with HTML, if not, HTML has a logical structure with information often contained in pairs of named tags. An example page is given below. This would work as a webpage, although our focus is on the parts that keep search engines informed as much as the overall code.

Coding For Search Engines


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/
xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
	 <title>Website Coding - Optimising For Search</title>
                  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
                  <meta http-equiv="Content-Style-Type" content="text/css" />
                  <meta name="description" content="Working with search engines, a guide to 
                  website coding and HTML tags, from the Website Report Service." />
                  <meta name="keywords" content="HTML, source code, website building, search 
                  engines, tags" />
           <link rel="stylesheet" type="text/css" href="styles.css" media="screen" />
    </head>
    <body>
          <div id="navigation">
	     <ul>
		<li><a href="/">Home</a></li>
		<li><a href="services.html">Services</a></li>
		<li><a href="contact.htm">Contact Us</a></li>
              </ul>
	 </div>
	 <div id="content">
	   <h1>How To Compose HTML</h1>
		 <img src="images/code_editor.jpg" alt="Screenshot of HTML editor" title=""
                    width="206" height="145" class="rightimg" />
                    <p>A paragraph on using an HTML compiler to build website pages.</p>

	   <h2>Improving Search Engine Indexing</h2>
		 <img src="images/google_talk.jpg" alt="Google lecture at SEO conference" 
                    title="" width="206" height="145" class="leftimg" />
                    <p>A paragraph on providing useful information to search engines.</p>
           </div>
      </body>
</html>

Rather than create one long entry, notes on the example above are on a separate page part two of optimising code. This also allows you to open the notes in an extra browser tab, if you wish to go back and forth between the two. A detailed look at the various HTML tags is provided, we hope you find this useful.