HTML and CSS Reference
In-Depth Information
A Quick Look at HTML5-specific Tags
Before you move ahead to the programmable features of HTML5, it would be helpful to glance over a few
newly added elements. Table 1-1 presents a list of elements that not only allow you to design more
structured web pages but also provide functionality that has never before been part of HTML markup.
Note, however, that any detailed discussion of the elements related to the well-structuredness of web
pages (the irst couple of rows in Table 1-1) is beyond the scope of this topic.
You can fine a neat and handy HTML5 tag reference at
http://w3schools.com/html5/default.
n
Note
asp
.
You come across some of the elements mentioned in Table 1-1 in the chapters to follow. They're explained
as and when required.
Table 1-1.
Newly Added HTML5 Elements
Elements
Description
<article>
,
<header>
,
<hgroup>
,
<footer>
,
<section>
,
<summary>
,
<aside>
,
<nav>
These elements allow you to design a page in a more structured
manner (such as an article or blog post). Previously, developers used
a combination of
<div>
,
<span>
, and
<p>
to design HTML pages.
Although that approach is perfectly acceptable, even under HTML5,
the new layout elements can come in handy to mark specific areas
of pages such as headers, footers, summaries, and sidebars. The new
elements are more readable and meaningful in a given context, and
you can design your CSS styles specifically for them. These elements
also make it possible for third-party tools and utilities to parse the
HTML document and automate page processing.
<igure>
,
<igcaption>
Using images in a web page is a common task for which you use
<img>
. The
<igure>
and
<igcaption>
tags are used to mark figures
that serve as illustrations in an article or document.
<input>
The
<input>
tag itself isn't a new addition to HTML5. However, it
now has many new values for its
type
attribute:
Email
,
URL
,
Telephone
,
Color
, and so on.
<audio>
,
<video>
Showing audio and video files used to be tricky and often required
dependency on a plug-in (Flash or Silverlight, for example). The new
<audio>
and
<video>
elements provide a native way for browsers to
identify (and play) media files.
<canvas>
The
<canvas>
element is a region where you can draw shapes, text,
and images using JavaScript code.
HTML5 Features of Interest
Enhanced markup is just a small part of the HTML5 story. HTML5 is more than markup; it includes a set of
features that you can program using client-side script.
Over time, web applications have moved beyond static markup. Almost all modern web applications
use technologies such as JavaScript, jQuery, Ajax, validations, data access, and more. To cope with the
changing nature of web applications, HTML5 has taken steps in the right direction by offering native
support for features that are commonly needed by web developers. Rather than rely on a third party to
