Document Outline Viewer
Enter your url and submit to study your document outline.
- Checks for presence of title tag.
- Displays hierarchical heading structure.
- Indicates missing headings
- Intelligent handling of images used as headings (e.g.
<h1><img src="myimg.gif" alt="My Heading" /></h1>) - Visual checking with the document shape outline.
The W3C on Headings
There are six levels of headings in HTML with H1 as the most important and H6 as the least.
Some people consider skipping heading levels to be bad practice. They accept H1 H2 H1 while they do not accept H1 H3 H1 since the heading level H2 is skipped.
More about the Document Outline Viewer
This script will scans a URL for headings and presents the document outline indented according to the hierarchy of headings. This allows you to check that heading tags are used semantically and not for resizing text (that's what CSS are for).
That's not all! Unlike other document outliners, this one will take account of alternative content inside the heading tags. For example, in other document outliners a heading is shown as being blank if it contains an image, even if the image has an 'alt' attribute. In this outliner the content of the 'alt' attribute is shown, as it would be in any non-graphical browser (including screen-readers). It also looks for a 'title' attribute (in images and links) and if both the 'title' and 'alt' attributes are absent or empty then it shows that the heading was found but does not have any useful content (which you might want to fix).
