Html5
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share
  • 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
1,190
On Slideshare
1,189
From Embeds
1
Number of Embeds
1

Actions

Shares
Downloads
6
Comments
0
Likes
0

Embeds 1

http://www.slideshare.net 1

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/