HTML5
Upcoming SlideShare
Loading in...5
×
 

HTML5

on

  • 5,260 views

An introductory session for HTML5, session was introduced in Mozilla Power'13, the first event for Mozilla in Egypt.

An introductory session for HTML5, session was introduced in Mozilla Power'13, the first event for Mozilla in Egypt.

Statistics

Views

Total Views
5,260
Views on SlideShare
4,435
Embed Views
825

Actions

Likes
66
Downloads
124
Comments
9

32 Embeds 825

http://vriendenvan.frutowerktaan.nl 174
http://metastory.local 141
http://metas 80
http://metas.local 75
http://annei.net 54
http://dev.metastory.org 47
http://temp.metastory.org 45
http://metastory.org 35
http://www.metastory.org 26
http://crucial.fastforweb.net 25
http://metastory.mn 21
http://192.168.0.201 18
https://home.jolicloud.com 10
http://dev.crucial 9
http://www.metastory.mn 9
http://frank.uwsoftware.be 9
http://fp.edu.gva.es 7
http://www.google.com 7
http://www.linkedin.com 6
http://150.3.202.26 4
http://lafrancegeek.fr 4
http://maarten.nefkens.com 3
http://www.annei.net 3
http://192.168.5.27 3
http://www.lafrancegeek.fr 2
https://twitter.com 2
http://pulse.me&_=1388042386151 HTTP 1
http://pulse.me&_=1387895294563 HTTP 1
https://www.linkedin.com 1
http://safe.txmblr.com 1
http://192.168.1.169 1
https://my.jolicloud.com 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

HTML5 HTML5 Presentation Transcript

  • > le ml > it ht n” /t E 5< ”e = YP ML CT ang HT > l DO <! ml ead> itle t <h <t <h d> ea h </ > Ibrahim Abdel Fattah Mohamed @bingorabbit bingorabbit.com
  • W lcom !
  • Let's get back in History.. http://en.wikipedia.org/wiki/HTML 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • I just had to take the hypertext idea and connect it to the TCP and DNS ideas and — ta-da!— the World Wide Web. –- Sir, Tim Berners-Lee Known as the Creator of WWW
  • Sir. Tim Berners-Lee The Father of The Internet
  • 1995: HTML 2.0 Just standardized rules what people have been already using before..and it wasn't that good! 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • Strict Transitional Frameset 1997: HTML 3.2, Proposing 4.0 Adding standard support for tables and applets.. 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • 1999: HTML 4.01 Stable syntax and structure for HTML till it became the standard for web authoring. 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • 2000: XHTML 1.0 Trying to move structure more towards XML's, but browsers manufactures were kinda stubborn! 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • 2000->: The LEAP! XHTML 2.0 Up then DOWN!, Flash, Multimedia, and AJAX 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • 2004 - Present: HTML 5 Rise WHATWG, W3C adopts WHATWG work, Rich applications, Video, Audio, APIs. Large companies involved. 1995 1997 1998 1999 2000 2002 2004 2006 2009 2010
  • But.. WHY?!
  • Photo Credit: http://www.flickr.com/photos/hugo_provoste/522495023/ Sim plicity ..is the ultimate sophistication.. -– Leonardo Da Vinci
  • !DOCTYPE
  • Before.. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html> After..
  • Interoperability
  • New Features.. (Syntax)
  • New Tags <article>, <aside>, <header>, <footer> <nav>, <section>, <audio>, <video> <embed>, <canvas>, <progress>, <meter>
  • FORMS! <input type=”email” /> <input type=”url” /> <input type=”range” /> <input type=”date” /> <input type=”tel” /> <input type=”color” /> <input type=”number” />
  • FORMS! <input list="browsers" name="browser"> <datalist id="browsers"> <option value="Internet Explorer"> <option value="Firefox"> <option value="Chrome"> <option value="Opera"> <option value="Safari"> </datalist>
  • FORMS! Placeholder, Required, Patterns <input pattern="[0-9][A-Z]{3}" name="product" type="text" title="Single digit then 3 UC letters."/>
  • Geo Location DEMO! http://html5demos.com/geo
  • ● ● ● ● ● ● ● ● 20 Things I learned about Browsers and Web: www.20thingsilearned.com Angry Birds: http://angrybirds.com/ Evolution of the Web: http://evolutionofweb.appspot.com/ HTML5 Test: http://html5test.com HTML5 Demos: http://html5demos.com/ Arena5: http://www.kevs3d.co.uk/dev/arena5/ Asteroids: http://www.kevs3d.co.uk/dev/asteroids/ HTML5 Visual Cheat Sheet: http://goo.gl/fL8DCa
  • Mobile Apps
  • Keywords HTML5 Mobile App Development HTML5 Boilerplate Modernizr Dive into HTML5 Book HTML5 Doctor HTML5 Rocks HTML5 Readiness caniuse.com
  • ? Questions
  • Thanks! :) Ibrahim A. Mohamed Tweet to me: @bingorabbit