SlideShare a Scribd company logo
1 of 17
Let’s make the WEB more powerful
Why HTML5 born?
Feature Native App Web Site
Access to the local system's resources and
CPU/RAM  X
Work Offline  X
Heavy graphics work  X
Desktop quality UI  X
Performance  X
Cross platform X 
So, If we want any effects or features we need to depend on plugins (Flash or Silverlight)
HTML5….. What is this?
• This not just another version of HTML to present
content for the World Wide Web.
• Yep!, it was proposed by Opera Software.
• The aim of HTML5, give more power to WEB with
multimedia, graphics & hardware acceleration.
• Get access to local resources, almost with out
Plugin. very interesting!
• Human readable and easy to understand by
computer programs.
Basic HTML5 page layout
Steve Jobs refused to allow Flash on iOS devices, he said that HTML5 could do
everything Flash did.
Now HTML5
Feature Native App Web Site
Access to the local system's resources and
CPU/RAM  
Work Offline  
Heavy graphics work  
Desktop quality UI  
Performance  
Cross platform X 
Browser’s JavaScript engines have made huge improvements, especially Chrome's and IE's.
Let’s see, What is New in HTML5?
• New Elements
• New Attributes
• Full CSS3 Support
• Video and Audio
• 2D/3D Graphics
• Local Storage
• Local SQL Database
• Web Applications
• Javascript
Let’s see, What is New? (cont..)
• There are new tags for content re present…
• For E.g. :- <nav /> , <header />, <section />,
<article /> and few more
• And also new Attributes
• autocomplete, novalidate, placeholder,
required, draggable and many more
In Multimedia and Graphics
• New tags <video />, <audio />, <canvas />,
<svg /> and CSS3 2D/3D
• So, no need to have plugins to play video or
audio.
• We can have fully access for those elements to
apply styles and customization with CSS and JS
Javascript Changes
• Javascript workers
• XHTMLHttpRequest 2
• GeoLocation
• Drag and Drop
• File API
Web Applications
• Local data storage
• Local SQL database
• IndexDB
• Application cache
New Input Types
• Color, Date Time, Email, Range, Tel, URL and
few more..
• This really very usefully when we are using
Touch devices (Smart phone and Tablets).
New Input Types (cont..)
New Input Types (cont..)
Backlogs of HTMl5
• HTML5 doesn't include digital rights management
(DRM) technology to prevent copying, many
content owners prefer proprietary, DRM-friendly
formats such as Flash or Silverlight.
• All HTML5 features not working in All major
browsers.
• Video formats there are 3 HTML5 video formats.
Each browser following there own format. Audio
also same.
Can we start using HTML5?
• Yes, it is right time to start developing HTML5
although it is under work and review.
• Few features not supported in some major
browsers.
• We can use few frameworks to bring same
experience in all Browsers.
• For example :- modernizr
• HTML5, is not only for WEB, we can use those
features in Cross Platform apps (E.g. :- PhoneGap)
Naga Harish M
ShareOurIdeas.com
@nagaharishmovva

More Related Content

What's hot

TallyJS #1 - Intro to AngularJS
TallyJS #1 - Intro to AngularJSTallyJS #1 - Intro to AngularJS
TallyJS #1 - Intro to AngularJSAndrew Hart
 
Creating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVCCreating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVCLohith Goudagere Nagaraj
 
Developing webapp using Polymer : is it ready for production? or not?
Developing webapp using Polymer : is it ready for production? or not?Developing webapp using Polymer : is it ready for production? or not?
Developing webapp using Polymer : is it ready for production? or not?Jeongkyu Shin
 
Html5 - the new kid on the block
Html5 - the new kid on the blockHtml5 - the new kid on the block
Html5 - the new kid on the blockMarian Borca
 
Html5で変わるいろんなこと
Html5で変わるいろんなことHtml5で変わるいろんなこと
Html5で変わるいろんなことMasakazu Muraoka
 

What's hot (6)

GetBadges
GetBadgesGetBadges
GetBadges
 
TallyJS #1 - Intro to AngularJS
TallyJS #1 - Intro to AngularJSTallyJS #1 - Intro to AngularJS
TallyJS #1 - Intro to AngularJS
 
Creating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVCCreating Custom HTML Helpers in ASP.NET MVC
Creating Custom HTML Helpers in ASP.NET MVC
 
Developing webapp using Polymer : is it ready for production? or not?
Developing webapp using Polymer : is it ready for production? or not?Developing webapp using Polymer : is it ready for production? or not?
Developing webapp using Polymer : is it ready for production? or not?
 
Html5 - the new kid on the block
Html5 - the new kid on the blockHtml5 - the new kid on the block
Html5 - the new kid on the block
 
Html5で変わるいろんなこと
Html5で変わるいろんなことHtml5で変わるいろんなこと
Html5で変わるいろんなこと
 

Similar to HTML5 - Let’s make the WEB more powerful

Similar to HTML5 - Let’s make the WEB more powerful (20)

Html5 workshop part 1
Html5 workshop part 1Html5 workshop part 1
Html5 workshop part 1
 
HTML 5
HTML 5HTML 5
HTML 5
 
HTML5 Technical Executive Summary
HTML5 Technical Executive SummaryHTML5 Technical Executive Summary
HTML5 Technical Executive Summary
 
HTML5 Presentation
HTML5 PresentationHTML5 Presentation
HTML5 Presentation
 
Screw HTML5, make cool shit with AIR
Screw HTML5, make cool shit with AIRScrew HTML5, make cool shit with AIR
Screw HTML5, make cool shit with AIR
 
Prueba ppt
Prueba pptPrueba ppt
Prueba ppt
 
Html5v1
Html5v1Html5v1
Html5v1
 
Everything That You Need To Know About HTML5
Everything That You Need To Know About HTML5Everything That You Need To Know About HTML5
Everything That You Need To Know About HTML5
 
5. HTML5
5. HTML55. HTML5
5. HTML5
 
Dive into HTML5
Dive into HTML5Dive into HTML5
Dive into HTML5
 
Html5
Html5Html5
Html5
 
UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7
 
HTML5 and DHTML
HTML5 and DHTMLHTML5 and DHTML
HTML5 and DHTML
 
HTML 5 - A developers perspective
HTML 5 - A developers perspectiveHTML 5 - A developers perspective
HTML 5 - A developers perspective
 
HTML5: An Introduction To Next Generation Web Development
HTML5: An Introduction To Next Generation Web DevelopmentHTML5: An Introduction To Next Generation Web Development
HTML5: An Introduction To Next Generation Web Development
 
HTML5 - The Future in a Flash
HTML5 - The Future in a FlashHTML5 - The Future in a Flash
HTML5 - The Future in a Flash
 
HTML5
HTML5HTML5
HTML5
 
Koubei banquet 30
Koubei banquet 30Koubei banquet 30
Koubei banquet 30
 
夜宴30期《HTML5 is coming》
夜宴30期《HTML5 is coming》夜宴30期《HTML5 is coming》
夜宴30期《HTML5 is coming》
 
Html5
Html5Html5
Html5
 

More from Naga Harish M

Smartphone - The life changer
Smartphone - The life changerSmartphone - The life changer
Smartphone - The life changerNaga Harish M
 
About Best friends - HTML, CSS and JS
About Best friends - HTML, CSS and JSAbout Best friends - HTML, CSS and JS
About Best friends - HTML, CSS and JSNaga Harish M
 
Css few small tips and information
Css few small tips and informationCss few small tips and information
Css few small tips and informationNaga Harish M
 
How to Avoid app store rejection
How to Avoid app store rejectionHow to Avoid app store rejection
How to Avoid app store rejectionNaga Harish M
 
Make app more visible in App store or marketplace
Make app more visible in App store or marketplaceMake app more visible in App store or marketplace
Make app more visible in App store or marketplaceNaga Harish M
 
iOS Distribution and App store pushing and more
iOS Distribution and App store pushing and moreiOS Distribution and App store pushing and more
iOS Distribution and App store pushing and moreNaga Harish M
 
Native vs cross platform vs html5
Native vs cross platform vs html5Native vs cross platform vs html5
Native vs cross platform vs html5Naga Harish M
 
Getting started with titanium
Getting started with titaniumGetting started with titanium
Getting started with titaniumNaga Harish M
 
Mobile website --- Web is in pocket....
Mobile website --- Web is in pocket....Mobile website --- Web is in pocket....
Mobile website --- Web is in pocket....Naga Harish M
 
Naming standards and basic rules in .net coding
Naming standards and basic rules in .net codingNaming standards and basic rules in .net coding
Naming standards and basic rules in .net codingNaga Harish M
 
Developers role in web site seo optimization
Developers role in web site seo optimizationDevelopers role in web site seo optimization
Developers role in web site seo optimizationNaga Harish M
 
Windows presentation foundation
Windows presentation foundationWindows presentation foundation
Windows presentation foundationNaga Harish M
 

More from Naga Harish M (15)

Smartphone - The life changer
Smartphone - The life changerSmartphone - The life changer
Smartphone - The life changer
 
About Best friends - HTML, CSS and JS
About Best friends - HTML, CSS and JSAbout Best friends - HTML, CSS and JS
About Best friends - HTML, CSS and JS
 
Css few small tips and information
Css few small tips and informationCss few small tips and information
Css few small tips and information
 
How to Avoid app store rejection
How to Avoid app store rejectionHow to Avoid app store rejection
How to Avoid app store rejection
 
Make app more visible in App store or marketplace
Make app more visible in App store or marketplaceMake app more visible in App store or marketplace
Make app more visible in App store or marketplace
 
iOS Distribution and App store pushing and more
iOS Distribution and App store pushing and moreiOS Distribution and App store pushing and more
iOS Distribution and App store pushing and more
 
Native vs cross platform vs html5
Native vs cross platform vs html5Native vs cross platform vs html5
Native vs cross platform vs html5
 
Getting started with titanium
Getting started with titaniumGetting started with titanium
Getting started with titanium
 
Windows phone 8
Windows phone 8Windows phone 8
Windows phone 8
 
Mobile website --- Web is in pocket....
Mobile website --- Web is in pocket....Mobile website --- Web is in pocket....
Mobile website --- Web is in pocket....
 
Naming standards and basic rules in .net coding
Naming standards and basic rules in .net codingNaming standards and basic rules in .net coding
Naming standards and basic rules in .net coding
 
Developers role in web site seo optimization
Developers role in web site seo optimizationDevelopers role in web site seo optimization
Developers role in web site seo optimization
 
Silverlight
SilverlightSilverlight
Silverlight
 
Asp.net mvc
Asp.net mvcAsp.net mvc
Asp.net mvc
 
Windows presentation foundation
Windows presentation foundationWindows presentation foundation
Windows presentation foundation
 

Recently uploaded

Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxRamakrishna Reddy Bijjam
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024Elizabeth Walsh
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxJisc
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17Celine George
 
Tatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsTatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsNbelano25
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsSandeep D Chaudhary
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxEsquimalt MFRC
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structuredhanjurrannsibayan2
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - Englishneillewis46
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Pooja Bhuva
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxJisc
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfPondicherry University
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxPooja Bhuva
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfSherif Taha
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxDr. Sarita Anand
 
Basic Intentional Injuries Health Education
Basic Intentional Injuries Health EducationBasic Intentional Injuries Health Education
Basic Intentional Injuries Health EducationNeilDeclaro1
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.christianmathematics
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...Amil baba
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxCeline George
 

Recently uploaded (20)

Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17
 
Tatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf artsTatlong Kwento ni Lola basyang-1.pdf arts
Tatlong Kwento ni Lola basyang-1.pdf arts
 
OSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & SystemsOSCM Unit 2_Operations Processes & Systems
OSCM Unit 2_Operations Processes & Systems
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptx
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdfFICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
FICTIONAL SALESMAN/SALESMAN SNSW 2024.pdf
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptx
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
Basic Intentional Injuries Health Education
Basic Intentional Injuries Health EducationBasic Intentional Injuries Health Education
Basic Intentional Injuries Health Education
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 

HTML5 - Let’s make the WEB more powerful

  • 1.
  • 2. Let’s make the WEB more powerful
  • 3. Why HTML5 born? Feature Native App Web Site Access to the local system's resources and CPU/RAM  X Work Offline  X Heavy graphics work  X Desktop quality UI  X Performance  X Cross platform X  So, If we want any effects or features we need to depend on plugins (Flash or Silverlight)
  • 4. HTML5….. What is this? • This not just another version of HTML to present content for the World Wide Web. • Yep!, it was proposed by Opera Software. • The aim of HTML5, give more power to WEB with multimedia, graphics & hardware acceleration. • Get access to local resources, almost with out Plugin. very interesting! • Human readable and easy to understand by computer programs.
  • 5. Basic HTML5 page layout Steve Jobs refused to allow Flash on iOS devices, he said that HTML5 could do everything Flash did.
  • 6. Now HTML5 Feature Native App Web Site Access to the local system's resources and CPU/RAM   Work Offline   Heavy graphics work   Desktop quality UI   Performance   Cross platform X  Browser’s JavaScript engines have made huge improvements, especially Chrome's and IE's.
  • 7. Let’s see, What is New in HTML5? • New Elements • New Attributes • Full CSS3 Support • Video and Audio • 2D/3D Graphics • Local Storage • Local SQL Database • Web Applications • Javascript
  • 8. Let’s see, What is New? (cont..) • There are new tags for content re present… • For E.g. :- <nav /> , <header />, <section />, <article /> and few more • And also new Attributes • autocomplete, novalidate, placeholder, required, draggable and many more
  • 9. In Multimedia and Graphics • New tags <video />, <audio />, <canvas />, <svg /> and CSS3 2D/3D • So, no need to have plugins to play video or audio. • We can have fully access for those elements to apply styles and customization with CSS and JS
  • 10. Javascript Changes • Javascript workers • XHTMLHttpRequest 2 • GeoLocation • Drag and Drop • File API
  • 11. Web Applications • Local data storage • Local SQL database • IndexDB • Application cache
  • 12. New Input Types • Color, Date Time, Email, Range, Tel, URL and few more.. • This really very usefully when we are using Touch devices (Smart phone and Tablets).
  • 13. New Input Types (cont..)
  • 14. New Input Types (cont..)
  • 15. Backlogs of HTMl5 • HTML5 doesn't include digital rights management (DRM) technology to prevent copying, many content owners prefer proprietary, DRM-friendly formats such as Flash or Silverlight. • All HTML5 features not working in All major browsers. • Video formats there are 3 HTML5 video formats. Each browser following there own format. Audio also same.
  • 16. Can we start using HTML5? • Yes, it is right time to start developing HTML5 although it is under work and review. • Few features not supported in some major browsers. • We can use few frameworks to bring same experience in all Browsers. • For example :- modernizr • HTML5, is not only for WEB, we can use those features in Cross Platform apps (E.g. :- PhoneGap)