Uploaded on

 

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
849
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
6
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1.
  • 2. Ny doctype
    Nya semantiska element
    Dokumentstruktur
    Gamla browsers?
    Nya input types
  • 3. Ny doctype
    <!doctype html>
    Bakåtkompatibel
    Inte XHTML
  • 4. Nya semantiska taggar
    <header>
    <nav>
    <article>
    <section>
    <aside>
    <footer>
    <hgroup>
    <time>
    <mark>
  • 5.
  • 6. IE 6 7 8
    HTML5 shim javascript
    Lägger till HTML5 element i dom-trädet
    CSS på ex <article>
    jQuery selektorer $(”article .item”).dev()
    <!--[if lt IE 9]><script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
  • 7. Modernizr.js
    Lägger till HTML5 element i dom-trädet
    Feature detection
    Slipper göra browser detection
    if(Modernizr.fontface) {...}
    if(Modernizr.canvas) {...}
    if(Modernizr.cssgradients) {...}
  • 8. Modernizr.js
    Lägger till klasser på <html>
  • 9. Nya input types
    <input type=”email”>
    search, tel, url, email, datetime, date, month, week, time, datetime-local, number, range, color
    type=“text” i omoderna browsers
  • 10. type=”email”
  • 11. type=url
  • 12. type=number
  • 13. Div. referenser
    http://diveintohtml5.org/semantics.html
    https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-browser-Polyfills
    http://html5doctor.com/
    http://html5boilerplate.com/