View stunning SlideShares in full-screen with the new iOS app!Introducing SlideShare for AndroidExplore all your favorite topics in the SlideShare appGet the SlideShare app to Save for Later — even offline
View stunning SlideShares in full-screen with the new Android app!View stunning SlideShares in full-screen with the new iOS app!
HTML5 represents a victory of consumer choice over the preference of the World Wide Web Consortium (W3C).
In January 2000, W3C recommended Extensible HyperText Markup Language (XHTML) 1.0, which incorporated HTML4 and included strict rules to standardise the syntax of the code.
In May 2001, W3C recommended XHTML1.1 and declared HTML to be a legacy standard.
However, browsers continued to be flexible with code as most web pages contain at least one violation of XHTML because it is so strict. Most websites would return error messages if strict XHTML standards were enforced.
Near the end of 2006, it was clear that WHATG was gaining momentum while XHTML 2.0 was lacking support by any major browser.
W3C announced it would collaborate with WHATG, resulting in Web Applications 1.0 being renamed HTML5.
HTML5 is not an official specification yet, but it will have a prominent place in website development, given that the major browsers are incorporating HTML5 features and Microsoft has stated its intention to incorporate HTML5 in IE10.
In HTML5, many tags and attributes have been 'retired' because they are purely presentational and could be better handled through CSS, or they damage accessibility. Examples include:
tags: <font>, <center>, <frame>
attributes: 'background' attribute on <body>, 'bgcolor' attribute on <table> - these are elements that modify the text, which should really be handled by CSS so that content is separated from its presentation.
A list of all differences between HTML4 and 5 can be found at: http://www.w3.org/TR/html5-diff/#ref-html5
HTML5 introduces new tags that define the structure or the context of information, so that it can be understood by browsers and search engines (semantic tagging). These tags simplify the process for creating sections that are common in many websites (such as footers).
Other new tags include:
<header> for introductory content (that can include navigation)
<nav> for navigational elements
<article> for independent content, such as a blog post or article
<section> for a section in a document, similar to sections in newspapers
HTML5 integrates W3C's geolocation application programming interface (API) (http://www.w3.org/TR/geolocation-API/) which enables website visitors to share their location data with trusted websites.
It is an 'opt-in' function, so that no-one is forced to share their location data.
The API is supported by most major browsers (including mobile browsers).
A geolocation demo: http://merged.ca/iphone/html5-geolocation (Interesting to note that Firefox alerts you to the fact that the site requests location info and you have to actively click on 'share location'.) The site shows how it generates a map from the info gathered via the API.
HTML5 includes multimedia tags such as <audio> and <video>, which means that media uploads that used to require a plug-in such as Flash or Silverlight, and associated scripting, can be done using simple HTML tags.
Using the <video> tag to upload a video with interactive controls (that are embedded into the MP4 file) would be done as:
One of the most innovative developments in HTML5 is the <canvas> tag, which allows for the development of rich graphical content within web pages.
The <canvas> tag is named after the concept of an artist's canvas; it is a blank space waiting to be used. On a web page, a canvas is a designated section of the page that you can draw on. The <canvas> tag eliminates the need for plug-ins that provide animation.
Cookies are an old technology that was designed to enable data to be stored during a web session. Disadvantages include: repeatedly transmitting the same data every time an HTTP request is made, slowing down the server and sending data across the internet, and limited storage size (4KB).
In HTML5 provides two options: local or session storage. The difference is that session storage expires when the browser session ends, while local storage has no time limit.