1 / 27

Dive into HTML5: A Developer's Guide

Mahmoud Ghoz presents Internet Explorer 9 and HTML5 for Developers. Learn about HTML5's history, new tags, features, and capabilities in this comprehensive guide. Explore demos, forms, multimedia, canvas drawing, and more. Discover how HTML5 evolves web development. Uncover the main aims and key elements of HTML5 development. Get insights into the past, present, and future of the language. A must-read for web developers and tech enthusiasts.

sigourney-emerson
Télécharger la présentation

Dive into HTML5: A Developer's Guide

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Presented By: Mahmoud Ghoz Internet Explorer 9 and HTML5 for Developers

  2. About Me • My name is Mahmoud Ghoz • My Current Position is Project Leader at ITWorx • MCPD (Distributed Systems) and MCT • Community activity • Co-founder for Agile Egypt A.K.A. ASGE • Co-founder for MS3arab • My Blog Ghoz.NET • My DL is ECSharp@yahoogroups.com • Project under construction • Bel3arabi

  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

  10. Demo 1 Simple HTML 5 Page

  11. Demo 2 HTML 5 can help you with wrong syntax

  12. Demo 3 Let’s See what HTML 5 Can do

  13. Demo 3

  14. Demo 4 The new in the <a> tag

  15. Demo 5 <ol start=5>

  16. New Keywords • embed • KeyGen • Progress

  17. Forms • <input type=email> • <input type=url> • <input type=date> • <input type=time> • <input type=month> • <input type=tel>

  18. Forms • <input type=email required> • <input type=email multiple> • <input pattern=“[0-9][A-Z]{3}”>

  19. Forms NO JAVA SCRIPT REQUIRED

  20. Multimedia No need for plugin to play video and audio HTML 5 will do it for you

  21. Demo 6 Play my ogv file

  22. Canvas • 2D drawing • 3D drawing • Playing with pictures • Animate objects

  23. Demo 7 http://www.openrise.com/lab/FlowerPower/

  24. Demo 8 http://htmlchess.sourceforge.net/demo/example.html

  25. Things not covered • Data storage • Web storage • Web SQL database • Offline • Drag and Drop • Geolocation • Messages, worker and sockets

  26. Questions ?

  27. Thank You

More Related