This document provides an overview of Internet Explorer 9 and HTML5 for developers. It discusses what HTML5 means and includes new tags. It covers the history of HTML5 and how it came to be. The presentation demonstrates several new HTML5 features such as canvas, drag and drop, local storage, and multimedia capabilities without plugins. It also discusses whether HTML5 is right for applications with limited resources or those targeting mobile audiences.
2. About Me
• My name is Mahmoud Ghoz
• My Current Position is Project Leader at
ITWorx
• Cofounder for Qhat.NET
• MCPD (Distributed Systems) and MCT
3. Agenda
• What do we mean by HTML 5?
• HTML 5 History
• HTML 5 new tags
4. What do we mean by HTML 5?
Add all new web technology into a box labeled
HTML 5
SVG (Scalable Vector Graphics) 6 years old.
Web Forms 2.0 XMLHttp-Request (XHR)
HTML 5
5. History
• It will help you understand why some aspects
of HTML5 are as they are.
• And hopefully pre-empt some of those “EIH?
Why did they design it like that?” moments
6. History
• In 1998, the W3C decided that they would not
continue to evolve HTML.
• HTML was frozen at version 4.01.
• WHATWG (Web Hypertext Application
Technology Working Group) see otherwise.
• WHATWG is working since 2004.
• In 2006 the W3C decided that they had perhaps
been over-optimistic in expecting the world to
move to XML.
7. History
• The W3C voted to use the WHATWG’s Web
Applications spec as the basis for the new
version of HTML.
8. Main Aims
• Specifying current browser behaviors that are
interoperable.
• Defining error handling for the first time.
9. Main Aims
• Evolving the language for easier authoring of
web applications.
– DOM APIs for drag and drop
– Server-sent events
– Drawing
– Video
In 2004, the editor of the HTML5 spec, Ian Hickson, mined 1 billion web pages via the Google index, looking to see what the “real” web is made of. One of the analyses he subsequentlypublished (http://code.google.com/webstats/2005-12/classes.html) was a list of the most popular class names in those HTML documents. More recently, in 2009 the Opera MAMA crawler (see http://devfiles.myopera.com/articles/572/idlist-url.htm) looked againat class attributes in 2,148,723 randomly chosen URLs and alsoids given to elements (which the Google dataset didn’t include) in 1,806,424 URLs.
Embed: is used to embed plugin … HTML 5 supposed to replace all the plugin but not over nightKeyGen: where you form need to send a public KeyProgress: is used to represent a progress meter to indicate the completion of a task
There is no standard how every browser will render the controlsBrowser now is responsible to validate the input
Attribute:Required:We also have required attribute to mark this field as mandatory. Multiple: allows the user to enter multiple email addresses.Pattern: custom validate, A part number is a digit followed by three uppercase letters.
Let’s Play Game
Let’s Play Game
Let’s Play Game
Let’s Play Game
Geolocation: W3C, not HTML5, API that works with maps, mobile phones can locate you on the mapMessages: allow you to send message from one domain to anotherWeb workers: Threads, is a way of running a discrete block of JavaScript in a background process to the main browser.Web Sockets: is not HTML 5, -Comet- Web Sockets give you a bi-directional connection between your server and the client, the browser. This connection is also real-time and is permanently open until explicitly closed. This means that when the server wants to send your client something, that message is pushed to your browser immediately.
HTML5 is a good fit; HTML is human readable, and there are over ten million web developers (compared to much fewer native and plug-in developers).
HTML5 is a good fit; with HTML web-based mobile applications, your application consistently displays across mobile web browsers, including future devices.
HTML5 is a good fit; with HTML web-based mobile applications, you don’t even need the approval of a app store to reach your audience.