Your SlideShare is downloading. ×
0
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
A Brief Interlude into HTML5
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

A Brief Interlude into HTML5

1,282

Published on

The slides for the January 2010 presentation at the Chattanooga PHP Developers meeting.

The slides for the January 2010 presentation at the Chattanooga PHP Developers meeting.

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,282
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
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
  • This presentation © 2010 Cameron Kilgore. Redistribution permitted under terms of the Creative Commons 3.0 BY-ND License
  • Explain that this is a part of a series of discussions on HTML5
  • Switch out to modernizr_demo.html
  • Switch out to canvas_demo.html
  • Switch out to video_demo.html
  • Switch out to audio_demo.html
  • There were plans for a git repo but those were axed when DreamHost complicated things. Explain that the gzip lacks the Moon trailer due to redistribution rights.
  • Transcript

    • 1. A Brief Interlude into<br />HTML5<br />The future problems with the web, today!<br />
    • 2. What in the world is HTML5? <br />HTML5 is the successor to XHTML1<br />Has officially superseded the proposed XHTML2<br />It gives us a few standardized JavaScript APIs we can do cool stuff with<br />Adds new tags that will give us the ability to embed media and create interactive web elements with ease<br />We can use it to create web applications that can take physical location into account<br />Adds new tags we can use to create new semantically-sound content elements, such as navigation and template headings/footers<br />Run JavaScript in threads and store data locally<br />The ability to create offline web applications<br />HTML5 is literally, the foundation to the next-generation of web applications<br />
    • 3. Say hello to my little friends<br />This presentation will focus on three new HTML5 tags exclusively<br />&amp;lt;canvas&amp;gt;<br />&amp;lt;audio&amp;gt;<br />&amp;lt;video&amp;gt;<br />Future presentations will focus on Geolocation, DOM Storage, semantics, and other topics<br />
    • 4. Should I even ask about IE?<br />Nearly every modern browser supports some HTML5<br />Support varies from browser to browser<br />Internet Explorer does not<br />Good HTML5 must encompass one of two techniques<br />We must design it so it &amp;quot;progressively enhances&amp;quot; content and feature sets on web apps<br />If you run IE, some features should be implemented in JS/Flash or not be supported at all<br />Or we can ignore IE altogether<br />And nothing of value was lost<br />So for the time being HTML5 support is fragmented but it can be used for many things<br />
    • 5. Detecting HTML5<br />We can use the Modernizr JS library to detect HTML5 support<br />We can also use it to determine codec support for audio and video<br />Also good for detecting CSS3 features<br />
    • 6. &amp;lt;canvas&amp;gt;<br />As defined in the WHATWG standard, it’s a bitmap element we can draw in using JavaScript<br />This rendering is done in immediate mode<br />Not an alternative to technologies like SVG, but can be seen as a compliment<br />Right now its limited to 2D graphics<br />There are proposals to introduce a 3D canvas context<br />Absolutely is not supported by IE<br />excanvas.js can implement partial support<br />
    • 7. &amp;lt;video&amp;gt;<br />Do video in a flash without that other thing<br />Implementation dependant on a browser with codecs compiled<br />This continues to be a sore point with developers and the HTML5 committees<br />We can treat video like any other HTML element, and manipulate it with JS and even the &amp;lt;canvas&amp;gt;<br />Where is your god now, Adobe?<br />Two codecs are being used for HTML5 video<br />OggTheora<br />MPEG-4 H.264<br />W3C, WHATWG have not specified what codec to use<br />Originally, WHATWG said to use Ogg<br />
    • 8. &amp;lt;audio&amp;gt;<br />Like video, only without the video<br />OggVorbis is generally the sole accepted codec<br />and WAV<br />MP3 support is set to become the norm in 2011<br />Patents will expire<br />If you can’t wait, Chrome and Safari support it<br />
    • 9. The Apprehension of the H.246 License<br />Using H.264 is not free at all – it costs money to use the codec<br />And in 2011, you will be required to pay up to 30 cents per view for content provided with H.264<br />OR up to $20,000 per year<br />The licensing issue continues to be a sore point in the W3C and WHATWG steering committees<br />OggTheora not the ‘sawzall’ solution we need because its protection to submarine patents can’t be guaranteed<br />And as such, it is no longer part of the HTML5 standard<br />Licensing future for H.264 and AVC not yet certain<br />Firefox does not support H.264 due to this very issue (Chrome, Safari do)<br />But Chrome also supports OggTheora<br />You see where this is heading, don’t you?<br />
    • 10. Any Questions?<br />
    • 11. Know the score<br />Get the code<br />http://bit.ly/62AH3A<br />Get this slideshow<br />http://bit.ly/7Pkuxm<br />Explore more HTML5<br />diveintohtml5.org<br />http://bit.ly/6U2tLT<br />html5doctor.com<br />

    ×