Introduction to HTML 5

I have been watching this  video: Introduction to HTML 5 from Brad Neuberg on Vimeo.

Basicly, the video talks about five main things:

1. Graphics: the new <svg> and <canvas> tags. Both allow to draw programaticly. SVG is for easy graphics and it uses elements such as <rect> to draw and <canvas> is more javascript focused. The nice thing about SVG is that now it is supported by 95% of the web in two forms: native browsers like Firefox or Chrome, and by the SVG library based in Flash (this is mainly for Internet Explorer). Another advantage is that the elements are in the DOM tree so you can manipulate them as you do with other elements.
2. Video: Now there is an element <video> to play movies in the same way we use <img> for images.  No need to use complicated plugin stuff anymore. Also, as <svg> and <canvas>, <video> element is part of the DOM tree so we can manipulate it, draw on it, etc. Another cool thing is that you can buffer the video even if the user doesn’t click the play button!
3. Geolocation: There is now a javascript object under the navigator object called geolocation which provides methods to get the longitude and latitude or more stuff to deal with the user location.
4. Storage: Yes, this is not a mistake. There are now cache and a database to save data and allow the user to work offline. The caching is performed by a cache manifest inserted in the body of the HTML 5 page. You can specify the files that must be copied to the local computer. The other very cool thing is the database. There is now another javscript object under window object to open a local database. You can save data using SQL queries and transactions.
5. Web workers: This is basicly a feature which allows executing Javascript in another thread so the browser don’t get frozen when executing complex code.

It also talks briefly about other new and useful tags such as:

• <header> where the logo and that stuff go
• <nav> where the navigation section goes
• <article> where the main content is inserted
• <section> to divide the information in sections as a book does
• <footer> for the footer information
• <progress> to display progress bar
• <meter> to display a star raking element

Nice and helpful video. It’s worth watching it to have an idea about what HTML 5 can do for you now. Believe me, it’s awesome!