SlideShare a Scribd company logo
By –
BALLY CHOHAN
Contents
 Introduction to HTML.
 Why HTML5?
 HTML 5 an overview
 HTML5 features
 Difference between HTML4 and HTML5
 Future scope
 Conclusion
 -Bally Chohan
2
HTML : An Outline
 Stands for Hyper Text Markup Language.
 Not a programming language, it is a markup language.
 A markup language is a set of markup tags.
 Markup tags are used to describe web pages.
3
-Bally Chohan
TAGS
 Keywords surrounded by angle brackets < > like <html>
 They come in pairs like <b> and </b>
 Common tags are :-
 <html>
 <head>
 <div>
 <body>
• <a>
• <p>
• <h1>
4
-Bally Chohan
5-Bally Chohan
Document Object Model
 Cross platform, language independent model
 Represents and interacts with objects in HTML
documents
6
-Bally Chohan
Why HTML5 ?
 HTML4 hasn’t been updated for about 10 years.
 XHTML was introduced but it made things stricter and not
easier.
 Embedding audio/video was dependent on flash etc.
 New websites have to be interactive.
7
HTML4 - drawbacks
 It does not adequately support web applications.
 Complex structuring of web pages.
 Complex DTDs
 Need plug-ins to embed audio and video.
 Does not support drag and drop features, editing, drawing,
error handling etc
8
An Overview
• HTML5 (referred to as Web Applications 1.0) is an
improvement of HTML4.0 and XHTML1.0
• Work started in 2003 by W3C and WHATWG
• Released a draft version in 2008.
• A change from document markup language to a web
application language.
• An attempt to enhance the functionality and flexibility of
the web. 9
…contd.
• Provides interoperability.
• Backward compatible
• New features like form control, APIs, multimedia, structure
semantics , local storage etc.
• Consistent and defined error handling
• Internal data storage.
10
-Bally Chohan
11
HTML5 FEATURES
 New elements
Structural elements
Multi-media elements
Inline elements
 New input types
 New attributes
 Local Storage
 New APIs
-Bally Chohan
Structural elements
12
Structuring in HTML4
-Bally Chohan
13
Structuring in HTML5;
14
HTML5 vs. HTML4
 Support of multimedia
 Language for web applications rather than document
markup language
 Localized data speeding up caching .searching etc
 <canvas> tag for 2D graphics
 APIs for in-browser application allowing editing, drag and
drop etc
-Bally Chohan
15
Future Scope
 Can get rid of proprietary add-ons (like
Flash/Silverlight/JAVAFX)
 Web apps faster with better user experience
 Difference between desktop and web apps blurred.
 Standard for web applications
-Bally Chohan
Queries !!
16
- By Bally Chohan

More Related Content

What's hot

Span and Div tags in HTML
Span and Div tags in HTMLSpan and Div tags in HTML
Span and Div tags in HTML
Biswadip Goswami
 
Introduction to HTML5
Introduction to HTML5Introduction to HTML5
Introduction to HTML5
Gil Fink
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginners
jeroenvdmeer
 
JavaScript Programming
JavaScript ProgrammingJavaScript Programming
JavaScript Programming
Sehwan Noh
 
Html5 tutorial for beginners
Html5 tutorial for beginnersHtml5 tutorial for beginners
Html5 tutorial for beginners
Singsys Pte Ltd
 
HTML5
HTML5 HTML5
Flexbox
FlexboxFlexbox
Flexbox
Netcetera
 
Eye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easilyEye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easily
shabab shihan
 
Html / CSS Presentation
Html / CSS PresentationHtml / CSS Presentation
Html / CSS Presentation
Shawn Calvert
 
Html Study Guide
Html Study GuideHtml Study Guide
Html Study Guide
vergetec
 
Html basics
Html basicsHtml basics
Html basics
mcatahir947
 
Html Intro2
Html Intro2Html Intro2
Html Intro2mlackner
 
Html 5
Html 5Html 5
Bootstrap 5 ppt
Bootstrap 5 pptBootstrap 5 ppt
Bootstrap 5 ppt
Mallikarjuna G D
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
Sayan De
 
Html5 semantics
Html5 semanticsHtml5 semantics
Html5 semantics
Webtech Learning
 
Lab #2: Introduction to Javascript
Lab #2: Introduction to JavascriptLab #2: Introduction to Javascript
Lab #2: Introduction to Javascript
Walid Ashraf
 
Html
HtmlHtml
Learning Html
Learning HtmlLearning Html
Learning Html
Damian Gonz
 

What's hot (20)

Span and Div tags in HTML
Span and Div tags in HTMLSpan and Div tags in HTML
Span and Div tags in HTML
 
Introduction to HTML5
Introduction to HTML5Introduction to HTML5
Introduction to HTML5
 
HTML presentation for beginners
HTML presentation for beginnersHTML presentation for beginners
HTML presentation for beginners
 
JavaScript Programming
JavaScript ProgrammingJavaScript Programming
JavaScript Programming
 
Html5 tutorial for beginners
Html5 tutorial for beginnersHtml5 tutorial for beginners
Html5 tutorial for beginners
 
HTML5
HTML5 HTML5
HTML5
 
Flexbox
FlexboxFlexbox
Flexbox
 
Eye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easilyEye catching HTML BASICS tips: Learn easily
Eye catching HTML BASICS tips: Learn easily
 
Html / CSS Presentation
Html / CSS PresentationHtml / CSS Presentation
Html / CSS Presentation
 
Html Study Guide
Html Study GuideHtml Study Guide
Html Study Guide
 
Html basics
Html basicsHtml basics
Html basics
 
Html Intro2
Html Intro2Html Intro2
Html Intro2
 
Html 5
Html 5Html 5
Html 5
 
Bootstrap 5 ppt
Bootstrap 5 pptBootstrap 5 ppt
Bootstrap 5 ppt
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Html5 semantics
Html5 semanticsHtml5 semantics
Html5 semantics
 
Lab #2: Introduction to Javascript
Lab #2: Introduction to JavascriptLab #2: Introduction to Javascript
Lab #2: Introduction to Javascript
 
Html
HtmlHtml
Html
 
Html and css
Html and cssHtml and css
Html and css
 
Learning Html
Learning HtmlLearning Html
Learning Html
 

Similar to Html 5 tutorial - By Bally Chohan

HTML5 New Tags
HTML5 New TagsHTML5 New Tags
HTML5 New Tags
Ducat
 
UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7Hisham Mat Hussin
 
IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...ijceronline
 
INTRUDUCTION TO HTML 5
INTRUDUCTION TO HTML 5INTRUDUCTION TO HTML 5
INTRUDUCTION TO HTML 5
reshmy12
 
What is future of web with reference to html5 will it devalue current present...
What is future of web with reference to html5 will it devalue current present...What is future of web with reference to html5 will it devalue current present...
What is future of web with reference to html5 will it devalue current present...
Shahzad
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
SuhaibKhan62
 
HTML5 Introduction – Features and Resources for HTML5
HTML5 Introduction – Features and Resources for HTML5HTML5 Introduction – Features and Resources for HTML5
HTML5 Introduction – Features and Resources for HTML5
Team Mango Media Private Limited
 
What are new added in HTML5?
What are new added in HTML5?What are new added in HTML5?
What are new added in HTML5?
Chetu
 
Developing with HTML5
Developing with HTML5Developing with HTML5
Developing with HTML5
Ray Wong
 
HTML ppt
HTML pptHTML ppt
Cgs html 5-service
Cgs html 5-serviceCgs html 5-service
Cgs html 5-serviceConstient
 
Html 5
Html 5Html 5
Html 5
AJINKYA N
 
Html 5 Features And Benefits
Html 5 Features And Benefits  Html 5 Features And Benefits
Html 5 Features And Benefits
Software Engineering
 
Top 10 major benefits of html 5
Top 10 major benefits of html 5Top 10 major benefits of html 5
Top 10 major benefits of html 5
Parul Rani Sagar
 
Chapter 2 introduction to html5
Chapter 2 introduction to html5Chapter 2 introduction to html5
Chapter 2 introduction to html5
nobel mujuji
 
HTML5 - The Future in a Flash
HTML5 - The Future in a FlashHTML5 - The Future in a Flash
HTML5 - The Future in a Flash
Rick Snailum
 
Michael(tm) Smith: HTML5 at Web Directions South 2008
Michael(tm) Smith: HTML5 at Web Directions South 2008Michael(tm) Smith: HTML5 at Web Directions South 2008
Michael(tm) Smith: HTML5 at Web Directions South 2008
Michael(tm) Smith
 

Similar to Html 5 tutorial - By Bally Chohan (20)

HTML5 New Tags
HTML5 New TagsHTML5 New Tags
HTML5 New Tags
 
UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7UMK Lecture 5 - HTML5 latest v7
UMK Lecture 5 - HTML5 latest v7
 
IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...IJCER (www.ijceronline.com) International Journal of computational Engineerin...
IJCER (www.ijceronline.com) International Journal of computational Engineerin...
 
INTRUDUCTION TO HTML 5
INTRUDUCTION TO HTML 5INTRUDUCTION TO HTML 5
INTRUDUCTION TO HTML 5
 
Html5
Html5Html5
Html5
 
What is future of web with reference to html5 will it devalue current present...
What is future of web with reference to html5 will it devalue current present...What is future of web with reference to html5 will it devalue current present...
What is future of web with reference to html5 will it devalue current present...
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 
HTML5 Introduction – Features and Resources for HTML5
HTML5 Introduction – Features and Resources for HTML5HTML5 Introduction – Features and Resources for HTML5
HTML5 Introduction – Features and Resources for HTML5
 
What are new added in HTML5?
What are new added in HTML5?What are new added in HTML5?
What are new added in HTML5?
 
Developing with HTML5
Developing with HTML5Developing with HTML5
Developing with HTML5
 
HTML ppt
HTML pptHTML ppt
HTML ppt
 
Report html5
Report html5Report html5
Report html5
 
Cgs html 5-service
Cgs html 5-serviceCgs html 5-service
Cgs html 5-service
 
Html 5
Html 5Html 5
Html 5
 
Html5
Html5Html5
Html5
 
Html 5 Features And Benefits
Html 5 Features And Benefits  Html 5 Features And Benefits
Html 5 Features And Benefits
 
Top 10 major benefits of html 5
Top 10 major benefits of html 5Top 10 major benefits of html 5
Top 10 major benefits of html 5
 
Chapter 2 introduction to html5
Chapter 2 introduction to html5Chapter 2 introduction to html5
Chapter 2 introduction to html5
 
HTML5 - The Future in a Flash
HTML5 - The Future in a FlashHTML5 - The Future in a Flash
HTML5 - The Future in a Flash
 
Michael(tm) Smith: HTML5 at Web Directions South 2008
Michael(tm) Smith: HTML5 at Web Directions South 2008Michael(tm) Smith: HTML5 at Web Directions South 2008
Michael(tm) Smith: HTML5 at Web Directions South 2008
 

More from ballychohanuk

Bally chohan yoga | Best Yoga Classes in UK
Bally chohan yoga | Best Yoga Classes in UKBally chohan yoga | Best Yoga Classes in UK
Bally chohan yoga | Best Yoga Classes in UK
ballychohanuk
 
Bally Chohan Job Portal UK
Bally Chohan Job Portal UKBally Chohan Job Portal UK
Bally Chohan Job Portal UK
ballychohanuk
 
Ballychohan yoga 1
Ballychohan yoga 1Ballychohan yoga 1
Ballychohan yoga 1
ballychohanuk
 
Wordpress tutorial- By Bally Chohan
Wordpress tutorial- By Bally ChohanWordpress tutorial- By Bally Chohan
Wordpress tutorial- By Bally Chohan
ballychohanuk
 
jQuery Tutorial - By Bally Chohan
jQuery Tutorial - By Bally ChohanjQuery Tutorial - By Bally Chohan
jQuery Tutorial - By Bally Chohan
ballychohanuk
 
php tutorial - By Bally Chohan
php tutorial - By Bally Chohanphp tutorial - By Bally Chohan
php tutorial - By Bally Chohan
ballychohanuk
 

More from ballychohanuk (6)

Bally chohan yoga | Best Yoga Classes in UK
Bally chohan yoga | Best Yoga Classes in UKBally chohan yoga | Best Yoga Classes in UK
Bally chohan yoga | Best Yoga Classes in UK
 
Bally Chohan Job Portal UK
Bally Chohan Job Portal UKBally Chohan Job Portal UK
Bally Chohan Job Portal UK
 
Ballychohan yoga 1
Ballychohan yoga 1Ballychohan yoga 1
Ballychohan yoga 1
 
Wordpress tutorial- By Bally Chohan
Wordpress tutorial- By Bally ChohanWordpress tutorial- By Bally Chohan
Wordpress tutorial- By Bally Chohan
 
jQuery Tutorial - By Bally Chohan
jQuery Tutorial - By Bally ChohanjQuery Tutorial - By Bally Chohan
jQuery Tutorial - By Bally Chohan
 
php tutorial - By Bally Chohan
php tutorial - By Bally Chohanphp tutorial - By Bally Chohan
php tutorial - By Bally Chohan
 

Recently uploaded

PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
Ralf Eggert
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
Guy Korland
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Product School
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
Elena Simperl
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
Bhaskar Mitra
 
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMsTo Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
Paul Groth
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
Product School
 
When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...
Elena Simperl
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
DianaGray10
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Jeffrey Haguewood
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
Kari Kakkonen
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
BookNet Canada
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance
 
"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi
Fwdays
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
RTTS
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
James Anderson
 

Recently uploaded (20)

PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
 
Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...Mission to Decommission: Importance of Decommissioning Products to Increase E...
Mission to Decommission: Importance of Decommissioning Products to Increase E...
 
Knowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and backKnowledge engineering: from people to machines and back
Knowledge engineering: from people to machines and back
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
 
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMsTo Graph or Not to Graph Knowledge Graph Architectures and LLMs
To Graph or Not to Graph Knowledge Graph Architectures and LLMs
 
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
From Daily Decisions to Bottom Line: Connecting Product Work to Revenue by VP...
 
When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...When stars align: studies in data quality, knowledge graphs, and machine lear...
When stars align: studies in data quality, knowledge graphs, and machine lear...
 
Connector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a buttonConnector Corner: Automate dynamic content and events by pushing a button
Connector Corner: Automate dynamic content and events by pushing a button
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
 
DevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA ConnectDevOps and Testing slides at DASA Connect
DevOps and Testing slides at DASA Connect
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...Transcript: Selling digital books in 2024: Insights from industry leaders - T...
Transcript: Selling digital books in 2024: Insights from industry leaders - T...
 
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdfFIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
FIDO Alliance Osaka Seminar: FIDO Security Aspects.pdf
 
"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi"Impact of front-end architecture on development cost", Viktor Turskyi
"Impact of front-end architecture on development cost", Viktor Turskyi
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
 
JMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and GrafanaJMeter webinar - integration with InfluxDB and Grafana
JMeter webinar - integration with InfluxDB and Grafana
 
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...
 

Html 5 tutorial - By Bally Chohan

  • 2. Contents  Introduction to HTML.  Why HTML5?  HTML 5 an overview  HTML5 features  Difference between HTML4 and HTML5  Future scope  Conclusion  -Bally Chohan 2
  • 3. HTML : An Outline  Stands for Hyper Text Markup Language.  Not a programming language, it is a markup language.  A markup language is a set of markup tags.  Markup tags are used to describe web pages. 3 -Bally Chohan
  • 4. TAGS  Keywords surrounded by angle brackets < > like <html>  They come in pairs like <b> and </b>  Common tags are :-  <html>  <head>  <div>  <body> • <a> • <p> • <h1> 4 -Bally Chohan
  • 6. Document Object Model  Cross platform, language independent model  Represents and interacts with objects in HTML documents 6 -Bally Chohan
  • 7. Why HTML5 ?  HTML4 hasn’t been updated for about 10 years.  XHTML was introduced but it made things stricter and not easier.  Embedding audio/video was dependent on flash etc.  New websites have to be interactive. 7
  • 8. HTML4 - drawbacks  It does not adequately support web applications.  Complex structuring of web pages.  Complex DTDs  Need plug-ins to embed audio and video.  Does not support drag and drop features, editing, drawing, error handling etc 8
  • 9. An Overview • HTML5 (referred to as Web Applications 1.0) is an improvement of HTML4.0 and XHTML1.0 • Work started in 2003 by W3C and WHATWG • Released a draft version in 2008. • A change from document markup language to a web application language. • An attempt to enhance the functionality and flexibility of the web. 9
  • 10. …contd. • Provides interoperability. • Backward compatible • New features like form control, APIs, multimedia, structure semantics , local storage etc. • Consistent and defined error handling • Internal data storage. 10 -Bally Chohan
  • 11. 11 HTML5 FEATURES  New elements Structural elements Multi-media elements Inline elements  New input types  New attributes  Local Storage  New APIs -Bally Chohan
  • 14. 14 HTML5 vs. HTML4  Support of multimedia  Language for web applications rather than document markup language  Localized data speeding up caching .searching etc  <canvas> tag for 2D graphics  APIs for in-browser application allowing editing, drag and drop etc -Bally Chohan
  • 15. 15 Future Scope  Can get rid of proprietary add-ons (like Flash/Silverlight/JAVAFX)  Web apps faster with better user experience  Difference between desktop and web apps blurred.  Standard for web applications -Bally Chohan
  • 16. Queries !! 16 - By Bally Chohan

Editor's Notes

  1. As many conceive it, its not a programming language. It’s a markup language. *Slidecontecnt* I’m coming to tags. Its on the next slide.
  2. Common tags you’ll find in an html source code are And &lt;p&gt;,&lt;h1&gt; etc&lt;head&gt; includes the external files which u may include in ur html doc such as a css or a javascript file&lt;div&gt; divides the page into sections upon ur need&lt;body&gt; defines the main body of ur division, it consists of several sub tags such as &lt;a&gt; &lt;p&gt; etc etcI think that’s all the basics you need to know to understand further.
  3. The most reason version html4, has been on for over a decade now. And, it hasn&apos;t really seen a major update. Sure there&apos;s XHTML, but that did little more than make things slightly stricter - making you write better quality code if you were at all concerned with compliance. The main area that was not been addressed yet was web application. To give authors more flexibility and enable more interactive websites, html5 was introduced.Critics say that html5 could actually kill flash and silverlight.