DEV 5.1 Include this information at the top

These are fairly basic code elements that can be cut and pasted into a standard template. They are important for accessibility and code validation. They provide:

  • The version of HTML used;
  • The language in which the page is written;
  • Useful information for search engines, browsing devices and people;
  • Useful navigation options.
  • Specify a valid Document Type Definition (DTD):
  • Identify the primary natural language:
  • Provide unique and meaningful titles for each page:
    • Vital for accessibility - good for bookmarking:
      • The title should correlate with the main page title (the H1,)
      • Avoid long titles where the relevant part for the page only appears at the end,
      • The most unique thing should go first - a 'reverse bookmark' works well.
  • Provide metadata:
    • At the least, a description and keywords and the default character set used;
    • You may also want to explore using elements from standard metadata sets to create a local metadata standard for all your sites:
    • Consider providing navigation information in metadata:
    • Provide links to external style sheets and alternative styles for different media types:
      • Print particularly useful for excluding all navigational elements etc. from print out.

Example Document type definitions:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Language declarations:

html documents:

<html lang="en">

For xhtml documents:

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

Page title (a 'reverse breadcrumb'):

<title>5.1 Include this stuff at the top - HTML coding - NDA Accessibility Guidance </title>

Basic metadata:

<meta name="description" content="Describe page and the scope of contents provided">

<meta name="keywords" content="Relevent keywords, Relevent Phrases, comma, Separated">

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Some navigational metadata examples:

<link rel="start" href="tips_intro.html">

<link rel="home" href="../index.html" />

<link rel="contents" href="../about/index.html" title="Contents: accessibility guidelines" />

<link rel="help" href="
../about/help.html" />

<link rel="author" href="mailto:

xyz@aaa.com" />

<link rel="prev" href="page9.htm">

<link rel="contents" href="contents.html" title="accessibility tips contents">

<link rel="next" href="page11">

Linked style sheets:

<link rel="stylesheet" type="text/css" media="all" href="standard.css")

<style type="text/css" media="screen">@import url(hidefromoldbrowsers.css);</style>

<link rel="stylesheet" type="text/css" media="Braille" href="braileversion.css")

<link rel="stylesheet" type="text/css" media="print" href="printversion.css" />