SlideShare a Scribd company logo
1 of 38
© Rose 2004; For further information on Rose, please visit www.roseint.com
11
Authors: Neelam Agnihotri
Last Released On: 23-AUG-2013
Subject: Overview of HTML5
© Rose 2004; For further information on Rose, please visit www.roseint.com
Unauthorizedreproductionordistributionofthisdocument,oranyportionofit,mayresultinseverecivilandcriminalpenalties
DocID:K-ClearQuest-11-APR-2005
Title: HTML5
© Rose 2004; For further information on Rose, please visit www.roseint.com
22
PURPOSE: The objective of this presentation is to familiarize CTT Members with
HTML5
SUBJECT:
VERSION: 0.0.1
NEXT REVIEW: <Date of next review>
CATEGORY: Training
Introduction to HTML5
TOTAL SLIDES: 38
1st RELEASED ON: 23-08-2013
DocumentControlInformationDocumentControlInformation
© Rose 2004; For further information on Rose, please visit www.roseint.com
33
Unauthorizedreproductionordistributionofthisdocument,oranyportionofit,mayresultinseverecivilandcriminalpenalties
RationalClearQuest
HTML5
Web Development to the next level
© Rose 2004; For further information on Rose, please visit www.roseint.com
44
Agenda
© Rose 2004; For further information on Rose, please visit www.roseint.com
WHAT IS HTML5?
55
© Rose 2004; For further information on Rose, please visit www.roseint.com
WHAT IS HTML5?
66
© Rose 2004; For further information on Rose, please visit www.roseint.com
Goals of the WHATWG and HTML5
77
© Rose 2004; For further information on Rose, please visit www.roseint.com
WHY Code in HTML5?
88
© Rose 2004; For further information on Rose, please visit www.roseint.com
Tag Removed in HTML5
99
© Rose 2004; For further information on Rose, please visit www.roseint.com
Tag Added in HTML5
1010
© Rose 2004; For further information on Rose, please visit www.roseint.com
Tag Added in HTML5
1111
© Rose 2004; For further information on Rose, please visit www.roseint.com
Input Controls in HTML5
1212
Keyword Data type Control type
text Text with no line breaks Text field
search Text with no line breaks Search field
url An absolute URI A text field
email An e-mail address or list of e-mail addresses A text field
datetime A date and time (year, month, day, hour, minute, second, fraction
of a second) with the time zone set to UTC
A date and time
control
number A numerical value A text field or
spinner control
range A numerical value, with the extra semantic that the exact value is
not important
A slider control or
similar
color An RGB color with 8-bit red, green, and blue components A color well
checkbox A set of zero or more values from a predefined list A checkbox
radio An enumerated value A radio button
© Rose 2004; For further information on Rose, please visit www.roseint.com
Web Storage
1313
© Rose 2004; For further information on Rose, please visit www.roseint.com
Web Storage
1414
© Rose 2004; For further information on Rose, please visit www.roseint.com
Web SQL Database
1515
© Rose 2004; For further information on Rose, please visit www.roseint.com
Example: Web SQL Database
1616
© Rose 2004; For further information on Rose, please visit www.roseint.com
Application Cache
1717
© Rose 2004; For further information on Rose, please visit www.roseint.com
Application Cache
1818
© Rose 2004; For further information on Rose, please visit www.roseint.com
Geolocation
1919
© Rose 2004; For further information on Rose, please visit www.roseint.com
Canvas
2020
© Rose 2004; For further information on Rose, please visit www.roseint.com
Audio & Video
2121
© Rose 2004; For further information on Rose, please visit www.roseint.com
Drag and Drop
2222
© Rose 2004; For further information on Rose, please visit www.roseint.com
Steps to Drag and Drop
2323
© Rose 2004; For further information on Rose, please visit www.roseint.com
CSS 3
face: border-radius: 146px;
left eye: border-radius: 35px;
right eye: border-radius: 35px;
base white: border-radius: 150px;
mouth: border-radius: 120px;
nose: border-radius: 50px;
left black eye: border-radius: 35px;
right black eye: border-radius: 35px;
Rounded Corners & CSS Selectors
2424
© Rose 2004; For further information on Rose, please visit www.roseint.com
CSS 3
Text Shadow Effects
• text-shadow: rgba(0, 0, 0, 0.5) 0 9px
9px;
• background:
-webkit-gradient(linear, left top, left
bottom, from(rgba(200, 200, 240, 1)),
to(rgba(255, 255, 255, 1)));
• border-radius: 50px;
• -webkit-box-reflect: below 10px
-webkit-gradient(linear, left top, left
bottom, from(transparent),
to(rgba(255, 255, 255, 1)));
2525
© Rose 2004; For further information on Rose, please visit www.roseint.com
CSS 3
Flexible Box Model
• .box {
display: -webkit-box;
-webkit-box-orient:vertical;
}
.box .one, .box .two {
-webkit-box-flex: 1;
}
.box .three {
-webkit-box-flex: 3;
}
• .box {
display: -webkit-box;
-webkit-box-orient:horizontal;
}
.box .one, .box .two {
-webkit-box-flex: 1;
}
.box .three {
-webkit-box-flex: 3;
}
2626
© Rose 2004; For further information on Rose, please visit www.roseint.com
How to Use HTML5?
2727
© Rose 2004; For further information on Rose, please visit www.roseint.com
How to Use HTML5?
2828
© Rose 2004; For further information on Rose, please visit www.roseint.com
How to Use HTML5
2929
© Rose 2004; For further information on Rose, please visit www.roseint.com
Page Structure with HTML5
3030
<header> … </header>
<footer> … </footer>
<section> … </section><nav> … </nav> <aside> …</aside>
<article> … </article>
© Rose 2004; For further information on Rose, please visit www.roseint.com
Browser Compatibility of HTML5
3131
© Rose 2004; For further information on Rose, please visit www.roseint.com
Browser Compatibility of HTML5
3232
© Rose 2004; For further information on Rose, please visit www.roseint.com
Browser Compatibility of HTML5
3333
© Rose 2004; For further information on Rose, please visit www.roseint.com
Browser Compatibility of CSS3
3434
© Rose 2004; For further information on Rose, please visit www.roseint.com
Demos and Experiments
• Chrome Experiments
http://www.chromeexperiments.com
• Apple HTML5 Showcase
http://www.apple.com/html5/
• Canvas Demos
http://www.canvasdemos.com
• RIA Demos with browser support listed
http://html5demos.com
• Our Solar System
http://neography.com/experiment/circles/solarsystem/
• Pure CSS3 Animated AT-AT Walker from Star Wars
http://blog.optimum7.com/anthony/website-design/pure-css3-animated-at-at-
walker-from-star-wars-2.html
3535
© Rose 2004; For further information on Rose, please visit www.roseint.com
Developer Reference Sites
• W3C
http://dev.w3.org/html5/html-author/
http://w3.org/TR/css3-roadmap/
• W3Schools HTML5 Reference
http://www.w3schools.com/html5/
• Dive Into HTML5 (prerelease site for an O’Reilly book)
http://diveintohtml5.org
• WebKit (Safari and Chromium)
http://developer.apple.com/safari/library/navigation/
http://www.chromium/home/
• Mozilla
http://developer.mozilla.org/en/html/html5/
• IE 8 & 9
http://msdn.microsoft.com/en-us/library/aa737439.aspx
http://ie.microsoft.com/testdrive/
3636
© Rose 2004; For further information on Rose, please visit www.roseint.com
3737
© Rose 2004; For further information on Rose, please visit www.roseint.com
3838
Thank you,
For your time and attention,
Have a nice day!
For further information please contact:
Rose I.T. Solutions
B-1/ G-8, Mohan Co-operative Industrial Area,
New Delhi -110044;
INDIA.
Phone : 91-11-51679141, 51679142, 51679143
VOIP: 1-636-410-0609; 1-636-410-0276
Website : www.roseint.com
Unauthorizedreproductionordistributionofthisdocument,oranyportionofit,mayresultinseverecivilandcriminalpenalties

More Related Content

Viewers also liked

Innovations for sustainable immunization financing
Innovations for sustainable immunization financingInnovations for sustainable immunization financing
Innovations for sustainable immunization financing
SabinVaccine
 
Pdfmusica13 silviasánchez
Pdfmusica13 silviasánchezPdfmusica13 silviasánchez
Pdfmusica13 silviasánchez
Silvia Sánchez
 
Apresentação apartamento savassi 3 quartos com área priv. (1)
Apresentação apartamento savassi 3 quartos com área priv. (1)Apresentação apartamento savassi 3 quartos com área priv. (1)
Apresentação apartamento savassi 3 quartos com área priv. (1)
LGD Imóveis Ltda
 
Presentation final persona yupi
Presentation final persona yupiPresentation final persona yupi
Presentation final persona yupi
lissett316
 
Otoño jorge
Otoño jorgeOtoño jorge
Otoño jorge
jaramago2
 
Nuvem ajuda economia das empresas
Nuvem ajuda economia das empresasNuvem ajuda economia das empresas
Nuvem ajuda economia das empresas
Suelen Vale
 

Viewers also liked (18)

Diplome
DiplomeDiplome
Diplome
 
Simina art
Simina artSimina art
Simina art
 
Denis art
Denis artDenis art
Denis art
 
Cristicio art
Cristicio   artCristicio   art
Cristicio art
 
Innovations for sustainable immunization financing
Innovations for sustainable immunization financingInnovations for sustainable immunization financing
Innovations for sustainable immunization financing
 
Pdfmusica13 silviasánchez
Pdfmusica13 silviasánchezPdfmusica13 silviasánchez
Pdfmusica13 silviasánchez
 
Apresentação apartamento savassi 3 quartos com área priv. (1)
Apresentação apartamento savassi 3 quartos com área priv. (1)Apresentação apartamento savassi 3 quartos com área priv. (1)
Apresentação apartamento savassi 3 quartos com área priv. (1)
 
Editorial Jumex
Editorial JumexEditorial Jumex
Editorial Jumex
 
Cómo vendo más usando tarjetas bancarias
Cómo vendo más usando tarjetas bancariasCómo vendo más usando tarjetas bancarias
Cómo vendo más usando tarjetas bancarias
 
Albert Einstein
Albert EinsteinAlbert Einstein
Albert Einstein
 
Presentation final persona yupi
Presentation final persona yupiPresentation final persona yupi
Presentation final persona yupi
 
Otoño jorge
Otoño jorgeOtoño jorge
Otoño jorge
 
Nuvem ajuda economia das empresas
Nuvem ajuda economia das empresasNuvem ajuda economia das empresas
Nuvem ajuda economia das empresas
 
Casa Ferreira - Institucional
Casa Ferreira - InstitucionalCasa Ferreira - Institucional
Casa Ferreira - Institucional
 
Beveiliging Digitale Communicatie In 2010
Beveiliging Digitale Communicatie In 2010Beveiliging Digitale Communicatie In 2010
Beveiliging Digitale Communicatie In 2010
 
Motivacion en el deporte
Motivacion en el deporteMotivacion en el deporte
Motivacion en el deporte
 
Resume
ResumeResume
Resume
 
Karatbars Brasil
Karatbars BrasilKaratbars Brasil
Karatbars Brasil
 

Similar to HTML5

Similar to HTML5 (20)

Client sidesec 2013-intro
Client sidesec 2013-introClient sidesec 2013-intro
Client sidesec 2013-intro
 
Insider's Guide to Creating Multilingual Websites That Drive Revenue
Insider's Guide to Creating Multilingual Websites That Drive RevenueInsider's Guide to Creating Multilingual Websites That Drive Revenue
Insider's Guide to Creating Multilingual Websites That Drive Revenue
 
Bring your Content into Focus using Data Driven Analytics.pptx
Bring your Content into Focus using Data Driven Analytics.pptxBring your Content into Focus using Data Driven Analytics.pptx
Bring your Content into Focus using Data Driven Analytics.pptx
 
HTTP/2 Comes to Java
HTTP/2 Comes to JavaHTTP/2 Comes to Java
HTTP/2 Comes to Java
 
Implementing an SEO Strategy for Your Liferay Websites
Implementing an SEO Strategy for Your Liferay WebsitesImplementing an SEO Strategy for Your Liferay Websites
Implementing an SEO Strategy for Your Liferay Websites
 
Web Development for Mobile: GTUG Talk at Google
Web Development for Mobile: GTUG Talk at GoogleWeb Development for Mobile: GTUG Talk at Google
Web Development for Mobile: GTUG Talk at Google
 
Intro to Neo4j and Graph Databases
Intro to Neo4j and Graph DatabasesIntro to Neo4j and Graph Databases
Intro to Neo4j and Graph Databases
 
CSS3: Are you experienced?
CSS3: Are you experienced?CSS3: Are you experienced?
CSS3: Are you experienced?
 
Oracle Digital Assistantご紹介資料(2020/04)
Oracle Digital Assistantご紹介資料(2020/04)Oracle Digital Assistantご紹介資料(2020/04)
Oracle Digital Assistantご紹介資料(2020/04)
 
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.comA brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
A brief look at CSS3 techniques by Aaron Rodgers, Web Designer @ vzaar.com
 
Perchè potresti aver bisogno di un database NoSQL anche se non sei Google o F...
Perchè potresti aver bisogno di un database NoSQL anche se non sei Google o F...Perchè potresti aver bisogno di un database NoSQL anche se non sei Google o F...
Perchè potresti aver bisogno di un database NoSQL anche se non sei Google o F...
 
JavaCro'15 - HTTP2 Comes to Java! - David Delabassee
JavaCro'15 - HTTP2 Comes to Java! - David DelabasseeJavaCro'15 - HTTP2 Comes to Java! - David Delabassee
JavaCro'15 - HTTP2 Comes to Java! - David Delabassee
 
CSS3 3D Workshop
CSS3 3D WorkshopCSS3 3D Workshop
CSS3 3D Workshop
 
Real Time Graph Computations in Storm, Neo4J, Python - PyCon India 2013
Real Time Graph Computations in Storm, Neo4J, Python - PyCon India 2013Real Time Graph Computations in Storm, Neo4J, Python - PyCon India 2013
Real Time Graph Computations in Storm, Neo4J, Python - PyCon India 2013
 
OData - The Universal REST API
OData - The Universal REST APIOData - The Universal REST API
OData - The Universal REST API
 
Silver Light By Nyros Developer
Silver Light By Nyros DeveloperSilver Light By Nyros Developer
Silver Light By Nyros Developer
 
SEO with Liferay
SEO with LiferaySEO with Liferay
SEO with Liferay
 
The Future of CSS
The Future of CSSThe Future of CSS
The Future of CSS
 
[heweb11] CSS3 Makeover
[heweb11] CSS3 Makeover[heweb11] CSS3 Makeover
[heweb11] CSS3 Makeover
 
Modernizing i5 Applications
Modernizing i5 ApplicationsModernizing i5 Applications
Modernizing i5 Applications
 

HTML5

  • 1. © Rose 2004; For further information on Rose, please visit www.roseint.com 11 Authors: Neelam Agnihotri Last Released On: 23-AUG-2013 Subject: Overview of HTML5 © Rose 2004; For further information on Rose, please visit www.roseint.com Unauthorizedreproductionordistributionofthisdocument,oranyportionofit,mayresultinseverecivilandcriminalpenalties DocID:K-ClearQuest-11-APR-2005 Title: HTML5
  • 2. © Rose 2004; For further information on Rose, please visit www.roseint.com 22 PURPOSE: The objective of this presentation is to familiarize CTT Members with HTML5 SUBJECT: VERSION: 0.0.1 NEXT REVIEW: <Date of next review> CATEGORY: Training Introduction to HTML5 TOTAL SLIDES: 38 1st RELEASED ON: 23-08-2013 DocumentControlInformationDocumentControlInformation
  • 3. © Rose 2004; For further information on Rose, please visit www.roseint.com 33 Unauthorizedreproductionordistributionofthisdocument,oranyportionofit,mayresultinseverecivilandcriminalpenalties RationalClearQuest HTML5 Web Development to the next level
  • 4. © Rose 2004; For further information on Rose, please visit www.roseint.com 44 Agenda
  • 5. © Rose 2004; For further information on Rose, please visit www.roseint.com WHAT IS HTML5? 55
  • 6. © Rose 2004; For further information on Rose, please visit www.roseint.com WHAT IS HTML5? 66
  • 7. © Rose 2004; For further information on Rose, please visit www.roseint.com Goals of the WHATWG and HTML5 77
  • 8. © Rose 2004; For further information on Rose, please visit www.roseint.com WHY Code in HTML5? 88
  • 9. © Rose 2004; For further information on Rose, please visit www.roseint.com Tag Removed in HTML5 99
  • 10. © Rose 2004; For further information on Rose, please visit www.roseint.com Tag Added in HTML5 1010
  • 11. © Rose 2004; For further information on Rose, please visit www.roseint.com Tag Added in HTML5 1111
  • 12. © Rose 2004; For further information on Rose, please visit www.roseint.com Input Controls in HTML5 1212 Keyword Data type Control type text Text with no line breaks Text field search Text with no line breaks Search field url An absolute URI A text field email An e-mail address or list of e-mail addresses A text field datetime A date and time (year, month, day, hour, minute, second, fraction of a second) with the time zone set to UTC A date and time control number A numerical value A text field or spinner control range A numerical value, with the extra semantic that the exact value is not important A slider control or similar color An RGB color with 8-bit red, green, and blue components A color well checkbox A set of zero or more values from a predefined list A checkbox radio An enumerated value A radio button
  • 13. © Rose 2004; For further information on Rose, please visit www.roseint.com Web Storage 1313
  • 14. © Rose 2004; For further information on Rose, please visit www.roseint.com Web Storage 1414
  • 15. © Rose 2004; For further information on Rose, please visit www.roseint.com Web SQL Database 1515
  • 16. © Rose 2004; For further information on Rose, please visit www.roseint.com Example: Web SQL Database 1616
  • 17. © Rose 2004; For further information on Rose, please visit www.roseint.com Application Cache 1717
  • 18. © Rose 2004; For further information on Rose, please visit www.roseint.com Application Cache 1818
  • 19. © Rose 2004; For further information on Rose, please visit www.roseint.com Geolocation 1919
  • 20. © Rose 2004; For further information on Rose, please visit www.roseint.com Canvas 2020
  • 21. © Rose 2004; For further information on Rose, please visit www.roseint.com Audio & Video 2121
  • 22. © Rose 2004; For further information on Rose, please visit www.roseint.com Drag and Drop 2222
  • 23. © Rose 2004; For further information on Rose, please visit www.roseint.com Steps to Drag and Drop 2323
  • 24. © Rose 2004; For further information on Rose, please visit www.roseint.com CSS 3 face: border-radius: 146px; left eye: border-radius: 35px; right eye: border-radius: 35px; base white: border-radius: 150px; mouth: border-radius: 120px; nose: border-radius: 50px; left black eye: border-radius: 35px; right black eye: border-radius: 35px; Rounded Corners & CSS Selectors 2424
  • 25. © Rose 2004; For further information on Rose, please visit www.roseint.com CSS 3 Text Shadow Effects • text-shadow: rgba(0, 0, 0, 0.5) 0 9px 9px; • background: -webkit-gradient(linear, left top, left bottom, from(rgba(200, 200, 240, 1)), to(rgba(255, 255, 255, 1))); • border-radius: 50px; • -webkit-box-reflect: below 10px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(255, 255, 255, 1))); 2525
  • 26. © Rose 2004; For further information on Rose, please visit www.roseint.com CSS 3 Flexible Box Model • .box { display: -webkit-box; -webkit-box-orient:vertical; } .box .one, .box .two { -webkit-box-flex: 1; } .box .three { -webkit-box-flex: 3; } • .box { display: -webkit-box; -webkit-box-orient:horizontal; } .box .one, .box .two { -webkit-box-flex: 1; } .box .three { -webkit-box-flex: 3; } 2626
  • 27. © Rose 2004; For further information on Rose, please visit www.roseint.com How to Use HTML5? 2727
  • 28. © Rose 2004; For further information on Rose, please visit www.roseint.com How to Use HTML5? 2828
  • 29. © Rose 2004; For further information on Rose, please visit www.roseint.com How to Use HTML5 2929
  • 30. © Rose 2004; For further information on Rose, please visit www.roseint.com Page Structure with HTML5 3030 <header> … </header> <footer> … </footer> <section> … </section><nav> … </nav> <aside> …</aside> <article> … </article>
  • 31. © Rose 2004; For further information on Rose, please visit www.roseint.com Browser Compatibility of HTML5 3131
  • 32. © Rose 2004; For further information on Rose, please visit www.roseint.com Browser Compatibility of HTML5 3232
  • 33. © Rose 2004; For further information on Rose, please visit www.roseint.com Browser Compatibility of HTML5 3333
  • 34. © Rose 2004; For further information on Rose, please visit www.roseint.com Browser Compatibility of CSS3 3434
  • 35. © Rose 2004; For further information on Rose, please visit www.roseint.com Demos and Experiments • Chrome Experiments http://www.chromeexperiments.com • Apple HTML5 Showcase http://www.apple.com/html5/ • Canvas Demos http://www.canvasdemos.com • RIA Demos with browser support listed http://html5demos.com • Our Solar System http://neography.com/experiment/circles/solarsystem/ • Pure CSS3 Animated AT-AT Walker from Star Wars http://blog.optimum7.com/anthony/website-design/pure-css3-animated-at-at- walker-from-star-wars-2.html 3535
  • 36. © Rose 2004; For further information on Rose, please visit www.roseint.com Developer Reference Sites • W3C http://dev.w3.org/html5/html-author/ http://w3.org/TR/css3-roadmap/ • W3Schools HTML5 Reference http://www.w3schools.com/html5/ • Dive Into HTML5 (prerelease site for an O’Reilly book) http://diveintohtml5.org • WebKit (Safari and Chromium) http://developer.apple.com/safari/library/navigation/ http://www.chromium/home/ • Mozilla http://developer.mozilla.org/en/html/html5/ • IE 8 & 9 http://msdn.microsoft.com/en-us/library/aa737439.aspx http://ie.microsoft.com/testdrive/ 3636
  • 37. © Rose 2004; For further information on Rose, please visit www.roseint.com 3737
  • 38. © Rose 2004; For further information on Rose, please visit www.roseint.com 3838 Thank you, For your time and attention, Have a nice day! For further information please contact: Rose I.T. Solutions B-1/ G-8, Mohan Co-operative Industrial Area, New Delhi -110044; INDIA. Phone : 91-11-51679141, 51679142, 51679143 VOIP: 1-636-410-0609; 1-636-410-0276 Website : www.roseint.com Unauthorizedreproductionordistributionofthisdocument,oranyportionofit,mayresultinseverecivilandcriminalpenalties

Editor's Notes

  1. HTML5 is the successor of HTML 4.01, released for the first time in 1999. The internet has changed significantly since 1999 and it seemed like the creation of HTML5 was necessary. The new markup language was developed based on pre-set standards: New features should be based on HTML, CSS, DOM, and JavaScript. The need for external plug ins (like Flash) needs to be reduced. Error handling should be easier than in previous versions. Scripting has to be replaced by more markup. HTML5 should be device-independent. The development process should be visible to the public
  2. 1 – HTML5 is becoming a new standard But why is it so good? What does it all mean? More importantly, why does it matter? There are a couple of factors that explain this. First of all, it is very rapidly becoming a standard. Developers want to use HTML5 which in return makes it all the more popular and the driving force for it to be here to stay is strong. Modern browsers all support HTML5 allowing developers to use all the new and exciting features it offers in order to create more dynamic end results. It doesn’t matter if you create a new plug-in, an UI mobile framework, or a new fancy carousel – your developer wants to do it in HTML5. And if you are a developer – you want to, or should want to, do it in HTML5 2 - HTML5 is faster and cheaper What’s the main reason industry wants to support HTML5? It reduces development time. By focusing on latest browsers and not being hold up on old ones (while providing graceful content degradation) developers can focus on writing functionalities that work, look good, while using latest tools. This makes whole process quick and very rewarding for the developers themselves. 3 – HTML5 is modern Next to HTML5 stands another awesome new tech – CSS3. Often, when using the term HTML5 it is assumed that CSS3 is included in the definition. What’s so awesome about CSS3? Well, like HTML5 it is a new iteration of CSS specification including modern browser support for visual styling. This allows achieving great looking effects like rounded corners, shadows or animations within couple lines of code, rather than by laborious image slicing techniques. This both increases fun factor of developing such features and reduces development time significantly, allowing developers to focus their efforts on things that matter. As a bonus you get lightweight websites with reduced number of files and images that need to be downloaded for the site to look good. All this makes sites to load faster increasing responsively and enhancing user experience. 4 – HTML5 lets you do things previously impossible With new functionalities that an awesome combination of CSS3 and HTML5 give us we can do things that were never possible to achieve in pure HTML. Things that would previously require external plugging like Adobe Flash or Microsoft Silverlight are now achievable in a browser through HTML5. Heavy support for animations and transition allows the possibility to create complicated dynamic visual effects through CSS3 rather than flash. Modern JavaScript API support to things like application storage, Geolocation allow developers to create complete web based applications through native HTML and CSS. All that is very cool, for one, but also it allows to create all of this, both web sites and web applications using the same technology. 5 – HTML5 supports mobile devices With all that in mind we come to a conclusion, the final reason why HTML5 matters – it is mobile friendly. With all that was mentioned earlier, the lightweight visual effects, the support from industry, the support form browser vendors, it is now easier than ever to develop a web site or an web application in HTML5 that can be deployed on both desktop and mobile devices. Content was never closer to the end user and it doesn’t matter if you are browsing on your desktop machine, on your laptop or on your Smartphone. While the Smartphone market is diverging with different supported operating systems and native applications, HTML5 is supported throughout the whole spectrum of mobile vendors thus allowing to deliver content – your product, your service to wide array of customers. And that, that is what matters. HTML5 is here to stay. It has support from the community, device and browser vendors, and is a great way to put content out there closer to the user. Working with the latest technologies is always fun and with a rapidly growing mobile market, it is a new and exciting place to be. HTML5 helps with all that. So, to conclude, HTML5 does matter, and it should matter to you!