This is a cross-post of a Coderwall protip I wrote in November 2012. I wanted to put it here for archival purposes.
I still use an outlining tool all the time, but I now use the excellent and actively maintained h5o bookmarklet.
Understanding exactly where and when to use the elements introduced in HTML5 can be tricky to begin with. I at first slapped them all over the place with little caution.
I read a fair few articles on how to use the veritable smorgasbord of shiny new HTML5 elements sensibly - but I was never sure I had understood completely.
This changed when I ran my markup through a tool to analyse the document outline. I use a handy Chrome extension to make this easy to do throughout the dev process. Just checking out the document outline of a site I'd recently built helped me to understand the whole concept a lot better than any of the articles I'd read previously.
If you haven't before, I really recommend making sure that the markup you are writing is actually adhering to the structure of the content you are marking up. The Chrome HTML5 document outline extension is now used (somewhat) constantly throughout my frontend dev process. Go check out your document outlines now!
(Disclaimer: 'document outline' is not an HTML5 thing, but I can't imagine many people who care about such things haven't started using 'HTMl5' yet. There is more comprehensive documentation of the document outline created in both HTML4 and HTML5 available on MDN.)