SlideShare ist ein Scribd-Unternehmen logo
1 von 13
HTML 5
     BY
K.SIVA KUMAR
HTML 5
• HTML 5 Specification is Much Larger

                                DOM
    HTML 4       XHTML 1.O     LEVEL
                                 2




                   HTML5
DOCTYPE has been simplified
•   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
•   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
•   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
•   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
•   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
• <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile
  1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
HTML 5

<!DOCTYPE HTML>
HTML 5 NEW ELEMENTS
Article, aside, audio, canvas, command,
datalist, details, embed, figcaption, figure,
footer, header, hgroup, keygen, mark,
meter, nav, output, progress, rp, ruby,
section, source, summary, time, video,
track, wbr.
FORMS IN HTML 5

• Date pickers, color pickers, and numeric stepper
  controls added
• Input field types now include email, search, and
  url
INTEGRATED APIs
• Audio and Video API
• Offline Applications
• Drag and Drop
Associated APIs
• Geolocation
NEW Structural Tags
• <section></section>
• “The section element represents a generic section of a
  document or application. A section, in this context, is
  thematic grouping of content, typically with a heading…”
• <article></article>
• “The article element represents a self-contained
  composition in a document page, application, or site and
  that is intended to be independently distrubutable or
  reusable, e.g. in syndication. This could be a forum post, a
  magazine or newspaper article, a blog entry, a user-
  submitted comment, an interactive widget or gadget. Or
  any other independent item of content.”
• <aside></aside>
• “The aside element represents a section of a
  page that consists of content that is tangentially
  related to the content around the aside element,
  and which could be considered separate from
  that content. Such sections are often represented
  as sidebars in printed typography”
• <header></header>
• “A header element is intended to usually contain
  the section’s heading (an h1-h6 element or an
  hgroup element), but this is not required. The
  header element can also be used”
• Audio
• <audio> Defines sound content
• <source>Defines multiple media resources for
  media elements, such as <video> and <audio>
• <video> Defines a video or movie
• <source>Defines multiple media resources for
  media elements, such as <video> and <audio>
• The <canvas> element is used to draw graphics,
  on the fly, on a web page.

Weitere ähnliche Inhalte

Was ist angesagt?

โปรแกรมเว็บบราวเซอร์
โปรแกรมเว็บบราวเซอร์โปรแกรมเว็บบราวเซอร์
โปรแกรมเว็บบราวเซอร์
Kapom Phumisart
 
The Ulta-Handy HTML Guide
The Ulta-Handy HTML GuideThe Ulta-Handy HTML Guide
The Ulta-Handy HTML Guide
jsved
 

Was ist angesagt? (14)

CSS: Introduction
CSS: IntroductionCSS: Introduction
CSS: Introduction
 
Html 2
Html 2Html 2
Html 2
 
Markup Languages
Markup LanguagesMarkup Languages
Markup Languages
 
Html css workshop, lesson 0, how browsers work
Html css workshop, lesson 0, how browsers workHtml css workshop, lesson 0, how browsers work
Html css workshop, lesson 0, how browsers work
 
HTML & XHTML Basics
HTML & XHTML BasicsHTML & XHTML Basics
HTML & XHTML Basics
 
Intro to Web Standards
Intro to Web StandardsIntro to Web Standards
Intro to Web Standards
 
Using internet technology
Using internet technologyUsing internet technology
Using internet technology
 
Hushang Gaikwad
Hushang GaikwadHushang Gaikwad
Hushang Gaikwad
 
Html Introduction part 1
Html Introduction part 1Html Introduction part 1
Html Introduction part 1
 
The Document Object Model
The Document Object ModelThe Document Object Model
The Document Object Model
 
โปรแกรมเว็บบราวเซอร์
โปรแกรมเว็บบราวเซอร์โปรแกรมเว็บบราวเซอร์
โปรแกรมเว็บบราวเซอร์
 
Html
HtmlHtml
Html
 
The Ulta-Handy HTML Guide
The Ulta-Handy HTML GuideThe Ulta-Handy HTML Guide
The Ulta-Handy HTML Guide
 
Casc Style Sheets Ii
Casc Style Sheets IiCasc Style Sheets Ii
Casc Style Sheets Ii
 

Andere mochten auch (7)

Javascript sivasoft
Javascript sivasoftJavascript sivasoft
Javascript sivasoft
 
Css siva
Css sivaCss siva
Css siva
 
Syllabus r10-ecm-42-network security and cryptography
 Syllabus r10-ecm-42-network security and cryptography Syllabus r10-ecm-42-network security and cryptography
Syllabus r10-ecm-42-network security and cryptography
 
Basics java scripts
Basics java scriptsBasics java scripts
Basics java scripts
 
Html siva
Html sivaHtml siva
Html siva
 
PHP Tutorials
PHP TutorialsPHP Tutorials
PHP Tutorials
 
Unobtrusive JavaScript with jQuery
Unobtrusive JavaScript with jQueryUnobtrusive JavaScript with jQuery
Unobtrusive JavaScript with jQuery
 

Ähnlich wie Html 5

Introduction to HTML5 and CSS3 (revised)
Introduction to HTML5 and CSS3 (revised)Introduction to HTML5 and CSS3 (revised)
Introduction to HTML5 and CSS3 (revised)
Joseph Lewis
 
Introduction to Web Standards
Introduction to Web StandardsIntroduction to Web Standards
Introduction to Web Standards
Jussi Pohjolainen
 
Introduction to XML, XHTML and CSS
Introduction to XML, XHTML and CSSIntroduction to XML, XHTML and CSS
Introduction to XML, XHTML and CSS
Jussi Pohjolainen
 
Base HTML & CSS
Base HTML & CSSBase HTML & CSS
Base HTML & CSS
Nick Chan
 
Web topic 13 html validation tools
Web topic 13  html validation toolsWeb topic 13  html validation tools
Web topic 13 html validation tools
CK Yang
 
[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility
Christopher Schmitt
 
Webware - from Document to Operating System
Webware - from Document to Operating System Webware - from Document to Operating System
Webware - from Document to Operating System
Channy Yun
 

Ähnlich wie Html 5 (20)

Html and Xhtml
Html and XhtmlHtml and Xhtml
Html and Xhtml
 
Introduction to HTML5 and CSS3 (revised)
Introduction to HTML5 and CSS3 (revised)Introduction to HTML5 and CSS3 (revised)
Introduction to HTML5 and CSS3 (revised)
 
Introduction to Web Standards
Introduction to Web StandardsIntroduction to Web Standards
Introduction to Web Standards
 
[In Control 2010] HTML5
[In Control 2010] HTML5[In Control 2010] HTML5
[In Control 2010] HTML5
 
Html&Browser
Html&BrowserHtml&Browser
Html&Browser
 
Html
HtmlHtml
Html
 
Html5 shubelal
Html5 shubelalHtml5 shubelal
Html5 shubelal
 
Super quick introduction to html5
Super quick introduction to html5Super quick introduction to html5
Super quick introduction to html5
 
Introduction to XML, XHTML and CSS
Introduction to XML, XHTML and CSSIntroduction to XML, XHTML and CSS
Introduction to XML, XHTML and CSS
 
Looking into HTML5 + CSS3
Looking into HTML5 + CSS3Looking into HTML5 + CSS3
Looking into HTML5 + CSS3
 
HTML5 tags.ppt
HTML5 tags.pptHTML5 tags.ppt
HTML5 tags.ppt
 
HTML (Hyper Text Markup Language)
HTML (Hyper Text Markup Language)HTML (Hyper Text Markup Language)
HTML (Hyper Text Markup Language)
 
Base HTML & CSS
Base HTML & CSSBase HTML & CSS
Base HTML & CSS
 
Html5
Html5Html5
Html5
 
Web topic 13 html validation tools
Web topic 13  html validation toolsWeb topic 13  html validation tools
Web topic 13 html validation tools
 
[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility[Access U 2010] HTML5 & Accessibility
[Access U 2010] HTML5 & Accessibility
 
HTML5 CSS3 Basics
HTML5 CSS3 Basics HTML5 CSS3 Basics
HTML5 CSS3 Basics
 
Webware - from Document to Operating System
Webware - from Document to Operating System Webware - from Document to Operating System
Webware - from Document to Operating System
 
Html5 Brown Bag
Html5 Brown BagHtml5 Brown Bag
Html5 Brown Bag
 
xhtml_css.ppt
xhtml_css.pptxhtml_css.ppt
xhtml_css.ppt
 

Mehr von ch samaram (13)

Restaurant billing application
Restaurant billing applicationRestaurant billing application
Restaurant billing application
 
Spintronics
SpintronicsSpintronics
Spintronics
 
Spintronics (1)
Spintronics (1)Spintronics (1)
Spintronics (1)
 
Shore
ShoreShore
Shore
 
Presentation
PresentationPresentation
Presentation
 
Open gl
Open glOpen gl
Open gl
 
Opengl (1)
Opengl (1)Opengl (1)
Opengl (1)
 
Computer forensics law and privacy
Computer forensics   law and privacyComputer forensics   law and privacy
Computer forensics law and privacy
 
Blue gene
Blue geneBlue gene
Blue gene
 
Blue gene
Blue geneBlue gene
Blue gene
 
Wearable (1)
Wearable (1)Wearable (1)
Wearable (1)
 
Ajax
AjaxAjax
Ajax
 
Css siva
Css sivaCss siva
Css siva
 

Html 5

  • 1. HTML 5 BY K.SIVA KUMAR
  • 2. HTML 5 • HTML 5 Specification is Much Larger DOM HTML 4 XHTML 1.O LEVEL 2 HTML5
  • 3. DOCTYPE has been simplified • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> • <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> HTML 5 <!DOCTYPE HTML>
  • 4. HTML 5 NEW ELEMENTS Article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, mark, meter, nav, output, progress, rp, ruby, section, source, summary, time, video, track, wbr.
  • 5. FORMS IN HTML 5 • Date pickers, color pickers, and numeric stepper controls added • Input field types now include email, search, and url
  • 6. INTEGRATED APIs • Audio and Video API • Offline Applications • Drag and Drop
  • 8. NEW Structural Tags • <section></section> • “The section element represents a generic section of a document or application. A section, in this context, is thematic grouping of content, typically with a heading…” • <article></article> • “The article element represents a self-contained composition in a document page, application, or site and that is intended to be independently distrubutable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user- submitted comment, an interactive widget or gadget. Or any other independent item of content.”
  • 9. • <aside></aside> • “The aside element represents a section of a page that consists of content that is tangentially related to the content around the aside element, and which could be considered separate from that content. Such sections are often represented as sidebars in printed typography”
  • 10. • <header></header> • “A header element is intended to usually contain the section’s heading (an h1-h6 element or an hgroup element), but this is not required. The header element can also be used”
  • 11. • Audio • <audio> Defines sound content • <source>Defines multiple media resources for media elements, such as <video> and <audio>
  • 12. • <video> Defines a video or movie • <source>Defines multiple media resources for media elements, such as <video> and <audio>
  • 13. • The <canvas> element is used to draw graphics, on the fly, on a web page.