html5 elements evaluated…
…along with all else of interest.
I do not like failures in web design, so before putting new combos of elements and attributes to use I perform tests. Normally all my testing goes on out of sight, but I found a few things related to responsive design interesting enough to put in this page in the web design section on site.
Most things work as expected, but just putting element combinations up for test in an actual design, meant I could prepare basic CSS in site‐wide stylesheets for them. That will come handy if/when these elements are put to regular use on site.
For reference: I have cherry‐picked elements from W3C: HTML/Elements, and borrowed tests along with them except where I already had my own.
1(6): figure / figcaption / object.
OK combo, I guess.
2(6): video #1 – ogv.
Playing well once, but variable results with controls beyond that.
Player and video seem to scale well in responsive designs.
Big Buck Bunny
3(6): video #2 – mp4 / ogv.
Playing well once, but variable results with controls beyond that.
Player and video seem to scale well in responsive designs.
…
4(6): audio.
Player seems to scale well in responsive designs.
#1 – oga
#2 – mp4 / oga
5(6): map / area.
Area does not scale with image so it seems to be useless in fully responsive designs, except of course when used on images small enough not to need scaling.
6(6): canvas.
Canvas seems to scale well in responsive designs.
some work well, some not so well.
Once styled more or less to my liking, new and old elements do at least appear right. For now that is really all that matters, and styling can and will be modified and improved over time.
That I only found 6 cases worth presenting tests for, is simply because the other elements are either in use on site already, or I know they will fall right in design‐wise if/when they are needed for semantic reasons.
Having gone through all elements listed on W3C: HTML/Elements – also those deprecated in HTML5, I am pretty sure I haven't missed any potentially useful elements. If more elements of interest appears, or something changes with HTML5, new test cases will be included or existing ones will change.
Still attributes to test on elements, so few of these test cases will stay static. Also some cross‐browser testing left to do, but I expect new browsers to play along quite nicely.
Older browser versions are expected to fail, and some will be tested so I know where to draw the line. Don't think I will introduce “crutches” for old browsers.
sincerely 
Hageland 04.nov.2013
last rev: 04.nov.2013
side notes.
responsive design.
When dealing with responsive design, what may work well in one screen‐size range may not work so well or at all in others. Important to check / test across the board of screens and devices an HTML document may end up on, before creating solutions that are doomed to fail outside the window range it is specifically designed on/for.
I always design for medium to wide screens first and mobiles (SSR) last, and don't share stylesheets across window sizes – the break‐point is at 480 in width. This means I am very much in control, but also means I must not forget to add SSR styles for new elements.
parallel SSRendering.
Here I have embedded “the internet” – starting with this very page – within an iframe sized for Small Screen Rendering (SSR) CSS to kick in. Although far from emulating cellphones' functionality, it does provide an idea of what a page will look like on Small Screens.