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