Is it possible to check if a website uses HTML5 elements (and which ones)?

For example I know Youtube uses the <video> element, but does it use some other elements as well?

I've tried reading the source to spot new elements but it's a hard task.

(I posted this on Super User because it's not really programming related. More a use of websites that do this (like validators) or plugins.)

link|improve this question
It rather belongs to Stack Overflow. – Török Gábor Feb 19 '10 at 10:13
@Törk Gábor: Not necessarily...he never stated how to detect it, could also mean checking with the eyes. – Bobby Feb 19 '10 at 10:15
updated my question – PoweRoy Feb 19 '10 at 10:17
@PoweRoy: Within Firefox (and any other modern browser) you can use Ctrl+F in the source view...should speed things a little up. – Bobby Feb 19 '10 at 10:24
Belongs on here on SU. If it was about detecting HTML5 capable browsers, it would be SO. – random Feb 19 '10 at 10:44
show 1 more comment
feedback

2 Answers

If you want to see if a website is using HTML5 elements, you only need to view the source of the website.

If the source code starts with the following declaration:

<!DOCTYPE HTML>

you're onto a HTML5 marked up website.

Also, it may be using some new elements introduced:

<article>
<aside>
<audio>
<canvas>
<command>
<datagrid>
<details>
<dialog>
<figure>
<footer>
<header>
<m>
<meter>
<nav>
<output>
<progress>
<section>
<source>
<time>
<video>

Here's a peek at the source code on a Youtube page running the <video> element:

youtube html5 source code

Seen through the Inspect element right-click option in Google Chrome, you'll note the declaration at the top is <!DOCTYPE HTML> specifying the use of HTML5 elements on the page.

link|improve this answer
1  
doctype is not completely usefull because youtube has <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" on the HTML5 document. – PoweRoy Feb 19 '10 at 10:44
Show an example Youtube page that uses the <video> tag. @pow – random Feb 19 '10 at 11:10
go with e.g. chrome (due h.264 usage) to youtube.com/html5, click on join the beta. And then watch any video on youtube. It will show the video in the <video> element – PoweRoy Feb 19 '10 at 11:19
You're right about the source code when you switch Youtube over to HTML5 version. @pow – random Feb 19 '10 at 12:40
Judging from Ctrl+F-ing the youtube page I think the only HTML5 element used is <video>. If I disable the HTML5 player and use flash on youtube, the '<!DOCTYPE HTML>' is still set (viewing the source code it is something else(see first comment)). The doctype is only used by the browser for rendering purposes, therefore doctype is reliable: themaingate.net/dev/html/all-you-need-is-doctype-html – PoweRoy Feb 19 '10 at 13:13
show 1 more comment
feedback

Modernizer is perfect if you're making a Javascript library for it

link|improve this answer
It is already library? Modernizr does is, very simply, tell you whether the current browser has this feature natively implemented or not. So this is a step sooner. Therefore(the question): If I have a browser with the most HTML5 capabilities currently, how can I detect what HTML5 elements the website is showing (without Ctrl+F trough the source) – PoweRoy Feb 22 '10 at 10:35
feedback

Your Answer

 
or
required, but never shown

Not the answer you're looking for? Browse other questions tagged or ask your own question.