10

I've been reading Dive Into HTML5, and Mark mentions that:

"You can test your own pages in the HTML5 Outliner to ensure that you’re using the heading elements properly."

I've tried this HTML5 Outliner and I know that it is functional from outlining other HTML5 pages I've found on the Internet.

The trouble with it is that this doesn't work on all pages (mainly the ones I have written for a Wordpress theme), and the error messages are cryptic; they seem to refer to the problem element in question (<section> for example), but don't do much to specify which element it is talking about on the page; i.e. specifying a line number, like the validator does.

I've found some other programs that are capable of reading html5 outlines, but I'm concerned that they may be early implementations that may be out of date for the current HTML5 spec.

So I was wondering if there was another program, website, etc, with more concise error messages that I could test my pages to ensure that I (a beginner in HTML5) is creating a document outline that could be properly read by tools capable of reading HTML5 document outlines.

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
leeand00
  • 25,510
  • 39
  • 140
  • 297
  • Do you mean it reports errors after you made the page pass the validator? The question would be more complete if you posted an example HTML you had problems using with the outliner. – Nickolay Oct 31 '10 at 09:42
  • @Nickolay That's a good point. I'll try and provide an example. Lately though I've been using the w3c's validator. – leeand00 Nov 01 '10 at 04:14
  • @Nickolay Here ya go: http://codepad.org/OZ0Zyv2U – leeand00 Nov 01 '10 at 04:24
  • 1
    so I don't get any errors with: http://gsnedders.html5.org/outliner/process.py?url=http%3A%2F%2Fcodepad.org%2FOZ0Zyv2U%2Fraw.txt – Nickolay Nov 03 '10 at 23:37
  • @Nickolay Okay let me clarify a bit; if I upload it as a file I still get the error. Did you use a URL? (Or maybe not Windows to upload it?) – leeand00 Nov 04 '10 at 14:31
  • 1
    Oh, yes uploading causes the ": argument to reversed() must be a sequence" error. Seems that it's just a bug in the outliner. I mailed the author, let's see what he says. – Nickolay Nov 06 '10 at 14:22
  • I haven't got an answer yet, BTW. – Nickolay Nov 24 '10 at 11:29
  • ***sigh*** oh well, I guess I'll use the w3c's validator...what's everybody else doing? – leeand00 Nov 26 '10 at 05:09
  • On [softwarerecs.se]: [**Tool that displays outline of HTML5 documents**](http://softwarerecs.stackexchange.com/q/190/60) – unor Aug 20 '14 at 23:10

3 Answers3

7

The W3C HTML Checker at https://validator.w3.org/nu/ has option to generate an outline:

enter image description here

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
4

If you use Chrome, there's now an HTML5 Outliner extension available too.

Nick F
  • 9,781
  • 7
  • 75
  • 90
3

There's an extension/bookmarklet HTML5 outliner here: http://code.google.com/p/h5o/

and a port for Opera here: https://addons.opera.com/addons/extensions/details/html5-outliner/

tagawa
  • 4,561
  • 2
  • 27
  • 34
  • 1
    Google code is dead, the outliner now lives on Github and npm: https://h5o.github.io/, https://github.com/h5o/h5o-js, https://www.npmjs.com/package/h5o – Dominykas Blyžė Mar 29 '15 at 12:16