{"id":1552,"date":"2009-11-09T22:49:03","date_gmt":"2009-11-09T22:49:03","guid":{"rendered":"http:\/\/www.stevepugh.net\/VTT\/?p=1552"},"modified":"2009-11-09T22:49:03","modified_gmt":"2009-11-09T22:49:03","slug":"html5-and-me","status":"publish","type":"post","link":"https:\/\/stevepugh.net\/VTT\/2009\/11\/html5-and-me\/","title":{"rendered":"HTML5 and me"},"content":{"rendered":"<p>Part 1 of a few.<\/p>\n<p>It seems that everyone has started talking about <a href=\"http:\/\/www.w3.org\/TR\/html5\/\">HTML5<\/a>. I&#8217;ve recently converted <a href=\"http:\/\/www.sfsfw.org\">sfsfw.org<\/a> (still a work in progress) to HTML5 (ditto) and built a <a href=\"http:\/\/www.visitlondon.com\/londonschristmascarol\/\">microsite at work<\/a> in the language.<\/p>\n<p>So, what parts of the brave new world am I embracing?<\/p>\n<h2>The new doctype<\/h2>\n<p><code>&lt;!DOCTYPE html><\/code>, well that will save a few bytes per page. I&#8217;ve never tried to type a doctype from memory before, I&#8217;ve always cut and pasted from another project or from an authoritative  source, but now I might just type it, saving a few seconds. I can&#8217;t help feeling that the lack of versioning information is a making a problem for the future (and let&#8217;s not get into the related area of all the things that HTML doctypes do\/mean in comparison with what SGML or XML doctypes are meant to mean&#8230;).<\/p>\n<h2>The new character encoding<\/h2>\n<p><code>&lt;meta charset=\"utf-8\" \/><\/code>, again that will save a few bytes on those pages where I bother to include a meta tag rather than just trusting to the HTTP header (and I know why the belt and braces approach is useful, so long as they both tell the same story).<\/p>\n<h2>The new block level elements<\/h2>\n<p><code>&lt;section><\/code>, <code>&lt;article><\/code>, <code>&lt;header><\/code>, <code>&lt;footer><\/code>, <code>&lt;aside><\/code> and <code>&lt;nav><\/code>. These are rather cool. Not immediataly earth shaking but they make code cleaner and debugging easier &#8211; less often will I be staring at <code>&lt;\/div>&lt;\/div>&lt;\/div>&lt;\/div><\/code> and wondering whether my current problem is caused by having too few or too many closing div tags.<\/p>\n<h2>The new input types<\/h2>\n<p><code>number<\/code>, <code>tel<\/code>, <code>email<\/code>, <code>url<\/code> are already being used in several forms on <a href=\"http:\/\/www.visitlondon.com\/\">visitlondon.com<\/a> and it makes me smile &#8216;cos me and a handful of other Opera users get to see the benefit right now. I think these will be my favourite part of the new spec for some time to come.<\/p>\n<p>There&#8217;s a lot more to HTML5. This isn&#8217;t meant to be a tutorial, just some personal observations and use cases. I&#8217;ll try to delve a bit deeper into how I&#8217;m using these pieces of code and why I&#8217;m using these but not others in future posts.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Part 1 of a few. It seems that everyone has started talking about HTML5. I&#8217;ve recently converted sfsfw.org (still a work in progress) to HTML5 (ditto) and built a microsite at work in the language. So, what parts of the brave new world am I embracing? The new doctype &lt;!DOCTYPE html>, well that will save [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[14,15],"tags":[124,126],"class_list":["post-1552","post","type-post","status-publish","format-standard","hentry","category-work","category-www","tag-html","tag-html5"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/p1fxq5-p2","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/posts\/1552","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/comments?post=1552"}],"version-history":[{"count":0,"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/posts\/1552\/revisions"}],"wp:attachment":[{"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/media?parent=1552"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/categories?post=1552"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/stevepugh.net\/VTT\/wp-json\/wp\/v2\/tags?post=1552"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}