Here's an example of what I gather to be best practice.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html lang="en-gb" xml:lang="en-gb" xmlns="http://www.w3.org/1999/xhtml";>
<head>
                <meta http-equiv="content-type" content="text/html; 
charset=utf-8" />
                <title>h1 text - site section - site name</title>
                <script 
type="text/javascript">/*<![CDATA[*/document.documentElement.className="hasJS"/*]]>*/</script>
                <meta name="Description" content="Description text which Google 
shows under search result." />
                <meta http-equiv="imagetoolbar" content="no" />
                <style type="text/css" media="screen">
                                @import "blah.css";
                                ...
                </style>
                <link href="blah-blah.css" rel="stylesheet" type="text/css" 
media="print" />
                <script src="more-scripts.js " type="text/javascript"></script>
</head>



The important things as I understand:

1. Doctype appears as the very first thing, not even a space before it, 
otherwise IEv6 may go into quirks mode.

2. lang stated in html element

3. first head item should be char encoding so document can be interpreted as 
quickly as possible.

4. Page title with H1 text first and if necessary other info in reverse 
breadcrumb order for accessibility and SEO.

5. hasJS script - so JS affected styling can be interpreted immediately.

6. General meta tags. The only two of worth are:

                a. Imagetoolbar - which prevents IE displaying that awful icon 
set over images.

                b. Description - The text that Google shows beneath a search 
result.

7. Stylesheets - (see: 
http://www.stevesouders.com/blog/2009/04/09/dont-use-import/)

                a. Use links to external style sheets which must not contain 
@import.

                b. If you must use @import use them in the HTML style tag not 
in external files.

8. The head section must not finish with a self closing element such as link. 
It may cause copy selection errors and  "Flash of un-styled content" issues


I'm very interested to hear other members perspectives.


mike foskett
http://websemantics.co.uk/



________________________________
This is a confidential email. Tesco may monitor and record all emails. The 
views expressed in this email are those of the sender and not Tesco.

Tesco Stores Limited
Company Number: 519500
Registered in England
Registered Office: Tesco House, Delamare Road, Cheshunt, Hertfordshire EN8 9SL
VAT Registration Number: GB 220 4302 31

*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [email protected]
*******************************************************************

Reply via email to