Wednesday, 19 December 2012

MCSD - 70-480 Exam Prep - HTML5

I have been reading HTML5 and CSS3: Develop with Tomorrow's Standards Today. Those are some notes I have prepared later on for some quick revision. Someone might find it quite useful.

Note: This is work in progress and by no means finished!

New Syntax

No more special doctypes only one!

<!DOCTYPE html>

New Tags

  • <header>
  • <footer>
  • <nav> 
    • Some sort of navigation
  • <section>
    • Section defines a large portion of the document. Article is a smaller (could be many of them together) normally within a section.
  • <article>
  • <aside>
    • Something extra to the content (quotes, diagrams etc)
    • NOT SIDE MENUS etc.
  • <progress>
    • Not implemented yet in any browsers
  • <meter>
    • Not implemented yet in any browsers

Falling back

  •      To simply add those tags to browsers that might not support do...
    • document.createElement("nav");

New input types

  • range
    • min/max
  • number (spin box)
    • min/max/step
  • date
  • email
  • url
  • color
Test to see if they are working by simply creating element 
var input = document.createElement("input")
input.setAttribute("type", "color")
To test if it supports it if(input.type !== "text") 

Modernizr is also good plugin to help with a headache. 

New attributes

  • Attributes starting with data-* will be ignored and are used by JS to keep data rather than injecting it into classes etc.
  • autofocus
  • placeholder
  • autocomplete=[on/off] ?? shouldn't it be [true/false]
  • contenteditable[true/false] - need to handle post backs manually

1 comment :

  1. This is an awesome post. Really very informative and creative contents. This concept is a good way to enhance knowledge. I like it and help me to development very well. Thank you for this brief explanation and very nice information. Well, got good knowledge.
    WordPress development company in Chennai