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):
- Ideally you should use the most up-to-date web technology
- See the List of valid DTD's from W3C.
- Identify the primary natural language:
- Add
lang
attribute to opening<HTML>
declaration; - Choose from list of ISO language codes.
- Add
- 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.
- Vital for accessibility - good for bookmarking:
- 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:
- Public sector sites should investigate the Irish Public Service Metadata; Standard; (IPSMS)
- Consider providing navigation information in metadata:
- See more on navigational 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" />