Scribd
Upload
41 views

HTML 5

HTML5 is the newest version of HTML that incorporates features from previous versions and adds new tools for web developers. It aims to support existing web pages without requiring revisions, reduce the need for plugins, and improve semantic structure. New elements were introduced like <article>, <footer>, and <canvas>. Features like built-in audio and video playback without plugins, enhanced forms, and offline web applications are part of HTML5.

Uploaded by

david
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
41 views

HTML 5

HTML5 is the newest version of HTML that incorporates features from previous versions and adds new tools for web developers. It aims to support existing web pages without requiring revisions, reduce the need for plugins, and improve semantic structure. New elements were introduced like <article>, <footer>, and <canvas>. Features like built-in audio and video playback without plugins, enhanced forms, and offline web applications are part of HTML5.

Uploaded by

david
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 11

Introduction to

HTML5
History of HTML

1991
HTML first published
1995
HTML 2.0
After HTML 4.01 was released, focus
shifted to XHTML and its stricter standards.
1997
HTML 3.2
1999
HTML 4.01 XHTML 2.0 had even stricter standards
than 1.0, rejecting web pages that did not
2000
XHTML 1.0 comply. It fell out of favor gradually and
was abandoned completely in 2009.
2002 -2009

XHTML 2.0
HTML5 is much more tolerant and can
handle markup from all the prior versions.

Though HTML5 was published officially in 2012,


2012
HTML5
it has been in development since 2004.
What is HTML5?

• HTML5 is the newest version of HTML, only recently gaining partial support by the
makers of web browsers.
• It incorporates all features from earlier versions of HTML, including the stricter
XHTML.
• It adds a diverse set of new tools for the web developer to use.
• All browsers have full HTML5 support.
Goals of HTML5

• Support all existing web pages. With HTML5, there is no


requirement to go back and revise older websites.
• Reduce the need for external plugins and scripts to show
website content.
• Improve the semantic definition (i.e. meaning and purpose)
of page elements.
• Handle web documents errors in a better and more
consistent fashion.
New Elements in HTML5

<article> <figcaption> <progress>


<aside> <footer> <section>
<audio> <header> <source>
<canvas> <hgroup> <svg>
<datalist> <mark> <time>
<figure> <nav> <video>
Other New Features in HTML5
 Built-in audio and video support (without plugins)
 Enhanced form controls and attributes
 The Canvas (a way to draw directly on a web page)
 Support for CSS3 (the newer and more powerful version
of CSS)
 More advanced features for web developers, such as
data storage and offline applications.
Example - audio

The controls attribute adds audio controls, like play,


pause, and volume.

The <source> element allows you to specify alternative


audio files which the browser may choose from. The
browser will use the first recognized format.

The text between the <audio> and </audio> tags will


only be displayed in browsers that do not support the
<audio> element.
Example - audio
HTML Audio - Media Types
File Format Media Type
•MP3 audio/mpeg
•Ogg audio/ogg
•Wav audio/wav
Example - audio

<audio controls>
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Example - video
The controls attribute adds video controls, like play,
pause, and volume.
It is a good idea to always include width and height
attributes. If height and width are not set, the page
might flicker while the video loads.
The <source> element allows you to specify
alternative video files which the browser may choose
from. The browser will use the first recognized
format.
The text between the <video> and </video> tags will
only be displayed in browsers that do not support the
<video> element
Example - video
<video width="320" height="240" autoplay>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

NB:To start a video automatically use


the autoplay attribute:

You might also like