Scribd
Upload
821 views

HTML 5

The document provides an introduction to HTML5, including its history and development, new features compared to previous versions of HTML, supported tags, and browser compatibility. Key points include: HTML5 is the next version of HTML developed by the W3C and WHATWG to extend functionality and address changes since HTML4; it introduces new semantic elements, forms, multimedia embedding, and offline/storage capabilities; while no browsers fully support HTML5 yet, major browsers continue advancing support for new features.

Uploaded by

arya1017
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
821 views

HTML 5

The document provides an introduction to HTML5, including its history and development, new features compared to previous versions of HTML, supported tags, and browser compatibility. Key points include: HTML5 is the next version of HTML developed by the W3C and WHATWG to extend functionality and address changes since HTML4; it introduces new semantic elements, forms, multimedia embedding, and offline/storage capabilities; while no browsers fully support HTML5 yet, major browsers continue advancing support for new features.

Uploaded by

arya1017
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 23

Introduction to

What is HTML?
What is HTML5?
How did HTML5 get started?
History of HTML5
Whats new in HTML5?
Advantages of HTML5
Difference of HTML5 with HTML4
Web sites that using HTML5
Browser Support
HTML5 Tags
References


A Web Page is created using a
languag+e called, Hypertext
Markup Language, better known
as HTML Code.

HTML is used to define the
structure and layout of a Web
page.

HTML is not a programming
language, it is a markup language

File Extension :- .html or .htm




HTML 5 is the next version of Hyper
Text Markup Language(HTML4)

It is developing by World Wide Web
consortium W3C and WHATWG.

HTML5 will be the new standard for
HTML, XHTML, and the HTML
DOM.

The previous version of HTML came in
1999. The web has changed a lot since
then.




HTML5
Logo
HTML5 is a cooperation between the World Wide Web
Consortium (W3C) and the Web Hypertext Application
Technology Working Group (WHATWG).

WHATWG was working with web forms and
applications, and

W3C was working with XHTML 2.0.

In 2006, they decided to cooperate and create a new
version of HTML.

1992 HTML is first defined
1993 HTML+ (some physical layout, fill-out forms, tables, math)
1994 HTML2.0 and HTML 3.0
1996 HTML 3.2
1997 HTML 4.0 (separates structure and presentation with
stylesheets)
1999 HTML 4.01 (slight modifications only)
2000 XHTML 1.0 (XML version of HTML 4.01)
2001 XHTML 1.1
2002 XHTML 2.0
2003 HTML 5 (to extend HTML 4's forms to provide many of the
features the XForms 1.0 introduced)

New Doctype and Charset
New Structure
New Inline Elements
New Dynamic Pages Support
New Form Types
New Elements
Removes Some Elements

You can use the HTML 5 doctype, which is very simple
and streamlined:

<!doctype html>

The character set for HTML 5 is streamlined as well. It
uses UTF-8 and you define it with just one meta tag:

<meta charset="UTF-8">


In general, Web pages have navigation, body content, and sidebar
content plus headers, footers, and other features. The tags for this
are:-

<section>
<header>
<footer>
<nav>
<article>
<aside>
<figure>
New Inline Elements
<mark>
<time>
<meter>
<progress>

New Dynamic Pages Support
Context menus
async attribute
<details>
<datagrid>
<menu>
<command>

NEW FORM TYPES
NEW ELEMENTS
HTML 5 supports all the
standard form input types, but it
adds a few more:
datetime
datetime-local
date
month
week
time
number
range
email
url

<canvas> - an element to give
you a drawing space in
JavaScript on your Web pages.

<video> - add video

<audio> - add sound to your
Web pages
There are also some elements in
HTML 4 that will no longer be
supported by HTML 5.
acronym
applet
basefont
big
center
dir
font


frame
frameset
isindex
noframes
noscript
s
strike
tt
u

HTML5 is not XHTML. You dont have to wrap your attributes in quotation marks if you
dont want to you.

<img src = DSC00624.jpg alt = About image />
OR
<img src = DSC00624.jpg alt = About image />

Make up your own mind on this one. If you prefer a more structured document, by all
means, stick with the quotes.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>untitled</title>
</head>

<body>
<h2> To-Do List </h2>
<ul
contenteditable="true">

<li> Gurpreet Kaur(155)
</li>
<li> Meeru Gupta
<li> Jyoti Batra </li>
<li> Jaskiran Kaur
</li> </ul>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<body>
<form action=""
method="get">
<label
for="email">Email:</label>
<input id="email"
name="email" type="email"
/>

<button type="submit">
Submit Form </button>
</form>
</body>
</html>
<!DOCTYPE HTML>
<html>
<body>
<video src="movie.ogg"
width="320" height="240"
controls="controls">
Your browser does not
support the video tag.
</video> </body>
</html>

<!DOCTYPE HTML>
<html>
<body>

<audio src="song.ogg" controls="controls">
Your browser does not support the audio
element.
</audio>

</body>
</html>

Tag Description
<article>New Defines an article
<aside>New Defines content aside from the page
content
<audio>New Defines sound content
<canvas>New Defines graphics
<command>New Defines command button
<datalist>New Defines a dropdown list
<details>New Defines details of an element
<dialog>New Defines a dialog (conversation)
<embed>New Defines external interactive content or
plugin
<figure>New Defines a group of media content, and
their caption
<footer>New Defines a footer for a section or page
<header>New Defines a header for a section or page
<hgroup>New Defines information about a section in a
document
<keygen>New Defines a generated key in a form
<mark>New Defines marked text
<meter>New Defines measurement within a predefined
range
<nav>New Defines navigation links
<output>New Defines some types of output
<progress>New Defines progress of a task of any kind
<rp>New Used in ruby annotations to define what to
show browsers that to not support the ruby
element.
<rt>New Defines explanation to ruby annotations.
<ruby>New Defines ruby annotations.
<section>New Defines a section
<source>New Defines media resources
<time>New Defines a date/time
<video>New Defines a video
Mutuality
Cleaner markup / Improved Code
Improved Semantics
Elegant forms
Consistency
Improved Accessibility
Fulfill the need of Web application
Offline Application cache
Client-side database
Geolocation support


HTML4 HTML5
Elements like nav, header were
not present.
It brought new element for web
structure like nav, header etc
Lack of rules of parsing, so it is
difficult to handle error.
Strictly parsing rules introduced
in html5 to handle the error.
No multimedia supported
without third party
Inbuilt multimedia element in
html5 like Audio, video, canvas
It was not available It contains attributes like control
menu, spell check etc.
YouTube uses HTML5

Google wave, a collaboration tool from Google uses several
html5 tags.

Only some of the browser only supports HTML5 features
currently.

HTML5 is not yet an official standard, and no browsers have full HTML5
support.

But all major browsers (Safari, Chrome, Firefox, Opera, Internet Explorer)
continue to add new HTML5 features to their latest versions.

Currently only Apples Safari is fully HTML 5 ready.

Mozilla Firefox 3.5 supports the new coding but is not 100% compatible

You might also like