Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

What is HTML5?

6,281 views

Published on

HTML5 will be the new standard for HTML, XHTML, and the HTML DOM. The previous version of HTML came in 1999. The web has changed a lot since then. HTML5 is still a work in progress. However, most modern browsers have some HTML5 support.

HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG).

WHATWG was working with web forms and applications, and W3C was working with XHTML 2.0. In 2006, they decided to cooperate and create a new version of HTML.

Published in: Education, Technology
  • You can hardly find a student who enjoys writing a college papers. Among all the other tasks they get assigned in college, writing essays is one of the most difficult assignments. Fortunately for students, there are many offers nowadays which help to make this process easier. The best service which can help you is ⇒ www.HelpWriting.net ⇐
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Dating for everyone is here: ♥♥♥ http://bit.ly/2u6xbL5 ♥♥♥
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Follow the link, new dating source: ♥♥♥ http://bit.ly/2u6xbL5 ♥♥♥
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT (2019 Update) ......................................................................................................................... ......................................................................................................................... Download Full PDF EBOOK here { https://soo.gd/irt2 } ......................................................................................................................... Download Full EPUB Ebook here { https://soo.gd/irt2 } ......................................................................................................................... Download Full doc Ebook here { https://soo.gd/irt2 } ......................................................................................................................... Download PDF EBOOK here { https://soo.gd/irt2 } ......................................................................................................................... Download EPUB Ebook here { https://soo.gd/irt2 } ......................................................................................................................... Download doc Ebook here { https://soo.gd/irt2 } ......................................................................................................................... ......................................................................................................................... ................................................................................................................................... eBook is an electronic version of a traditional print book THIS can be read by using a personal computer or by using an eBook reader. (An eBook reader can be a software application for use on a computer such as Microsoft's free Reader application, or a book-sized computer THIS is used solely as a reading device such as Nuvomedia's Rocket eBook.) Users can purchase an eBook on diskette or CD, but the most popular method of getting an eBook is to purchase a downloadable file of the eBook (or other reading material) from a Web site (such as Barnes and Noble) to be read from the user's computer or reading device. Generally, an eBook can be downloaded in five minutes or less ......................................................................................................................... .............. Browse by Genre Available eBooks .............................................................................................................................. Art, Biography, Business, Chick Lit, Children's, Christian, Classics, Comics, Contemporary, Cookbooks, Manga, Memoir, Music, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance, Science, Science Fiction, Self Help, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, History, Horror, Humor And Comedy, ......................................................................................................................... ......................................................................................................................... .....BEST SELLER FOR EBOOK RECOMMEND............................................................. ......................................................................................................................... Blowout: Corrupted Democracy, Rogue State Russia, and the Richest, Most Destructive Industry on Earth,-- The Ride of a Lifetime: Lessons Learned from 15 Years as CEO of the Walt Disney Company,-- Call Sign Chaos: Learning to Lead,-- StrengthsFinder 2.0,-- Stillness Is the Key,-- She Said: Breaking the Sexual Harassment Story THIS Helped Ignite a Movement,-- Atomic Habits: An Easy & Proven Way to Build Good Habits & Break Bad Ones,-- Everything Is Figureoutable,-- What It Takes: Lessons in the Pursuit of Excellence,-- Rich Dad Poor Dad: What the Rich Teach Their Kids About Money THIS the Poor and Middle Class Do Not!,-- The Total Money Makeover: Classic Edition: A Proven Plan for Financial Fitness,-- Shut Up and Listen!: Hard Business Truths THIS Will Help You Succeed, ......................................................................................................................... .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

What is HTML5?

  1. 1. HYPERTEXT MARKUP LANGUAGE VERSION 5 A N A S A B U D AYA H www.abudayah.com
  2. 2. Rough Timeline of Web Technologies 1991 HTML 1994 HTML 2 1996 CSS + JavaScript 1997 HTML 4 1998 CSS 2 2000 XHTML 1 2002 Tableless Web Design 2005 AJAX 2009 HTML 5* + CSS 3*
  3. 3. What is HTML5? • Its open source • Standard technology (WHATWG + W3C) HTML5 will be the new standard for HTML, XHTML, and the HTML DOM. HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG). • Successor of HTML v4.01 & XHTML v1.0
  4. 4. Rules: • More markup to replace scripting. • HTML5 should be device independent. • The development process should be visible to the public.
  5. 5. New Features: Some of the most interesting new features in HTML5: • The canvas element for drawing. • The video and audio elements for media playback. • Better support for local offline storage. • New content specific elements, like article, footer, header, nav, section. • New form controls, like calendar, date, time, email, url, search..
  6. 6. New Elements in HTML5: New Markup Elements <header>, <nav>, <aside>, <footer>… New Media Elements <Audio>, <video>, <source>, <embed>. The Canvas Element <canvas> New Form Elements <datalist>, <keygen>… New Input Type Attribute Values Tel, search, url, email, datetime, color, number… HTML5 Standard Attributes: item{empty/url}, subject{id}, draggable{true/false/auto}..
  7. 7. New Event Attributes: Window Event: Onafterprint, onerror, ononline, onoffline… Form Events *onreset event was deleted Oninput, oninvalid, onforminput… Keybord Events No new events.. Mouse Events Ondragstart, ondrag, ondrop.. Media Events Onplay, onpause, onprogress.. More: http://www.w3schools.com/html5/html5_reference.asp
  8. 8. HTML4 Page layout: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" <div id=“header”> "http://www.w3.org/TR/xhtml1/DTD/xhtml1- transitional.dtd"> <div id=“nav”> <html> <body> <div id=“header”> <div id=“article”> <h1>header</h1> </div> <div id=“aside”> <div id=“header”> <div id=“section”> <a href=“home.html”>Home</a> <a href=“about.html”>About</a> </div> <div id=“article”> <h1>Article title..</h1> <div id=“footer”> <p>Text…..</p> </div> <div id=“section”> <p>Section1</p> </div> <div id=“aside”> <p>About us…<p> </div> <div id=“footer”> <p>All rights received</p> </div> </body> </html>
  9. 9. HTML5 Page layout: <!DOCTYPE HTML> <html> <header> <body> <header> <nav> <h1>Title</h1> </header> <nav> <article> <a href=“home.html”>Home</a> <a href=“about.html”>About</a> <aside> </nav> <section> <article> <h1>Article title..</h1> <p>Text…..</p> </article> <section> <footer> <p>Section1</p> </section> <aside> <p>About us…<p> <header> Defines a header for a section or page </aside> <nav> Defines navigation links <footer> <p>All rights received</p> <aside> Defines content aside from the page content </footer> </body> <article> Defines an article </html> <section> Defines a section <footer> Defines a footer for a section or page
  10. 10. HTML5 vs. Flash/Silverlight: HTML5 FLASH / Silverlight Property + Open source - Proprietary (Adobe). - not yet implemented everywhere. + Flash present on almost every Prevalence computers. + no need for embed code - need for embed code Multimedia - Dose not use a specific format. + use default format (FLV,MP3). + not need for external plugins. - need for external plugins. Browsers - no browser fully support for HTML5. - Crashes browser. - Not support for navigation keys like Back button. + faster - Slower Capacity/load - Take much requirements on CPU. SEO + friendly with search engines. - Not friendly with search engines. Chart on Flash and html5 canvas: http://www.zingchart.com/flash-and-html5-canvas/
  11. 11. HTML5 Examples: 1. Basic page. Basic web page using header & nav & aside elements. http://abudayah.com/files/html5/basicpage/ 2. Multimedia Audio & Video http://abudayah.com/files/html5/multimedia/ 3. Drag and Drop Drag and drop demo in a HTML document, using the HTML5 drag and drop API. http://abudayah.com/files/html5/dragdrop/ 4. Canvas: Drawing Graphics with Canvas http://abudayah.com/files/html5/canvas/
  12. 12. HTML5 Examples: Slides: http://slides.html5rocks.com Get Location: http://html5demos.com/geo Upload Files: http://email.jeeran.com Image gallery: http://www.apple.com/html5/showcase/gallery More: http://www.apple.com/html5 interactive comic: http://www.nevermindthebullets.com/ CAPMAN http://www.kesiev.com/akihabara/demo/game-capman.html Google smash: http://mrdoob.com/92/Google_Gravity_HTML5 Canvas Video: http://craftymind.com/factory/html5video/CanvasVideo.html
  13. 13. Is it possible to build sites on HTML5 now? NO!.. Because: 1. is not completed. 2. Not fully browser support. 3. DRM issues. How can we move forward ? • It is a good time for learning. • Build web pages HTML4/XHTML + html5 + JS • Building browser-specific apps. • Focusing on the mobile.
  14. 14. Thank you :) Anas AbuDayah Front-end Web Developer Twitter: @abudayah www.abudayah.comLast update: 11 Aug 2011

×