Responsive Designs and HTML5 New Elements

Responsive Designs and HTML5 New Elements

Posted on August 12, 2013
New Elements in HTML5

HTML5 New Elements and Removed Elements from HTML 5

The internet, and the use of the internet, has changed a lot since HTML 4.01 became a standard in 1999.

Today, several elements in HTML 4.01 are obsolete, never used, or not used the way they were intended. All those elements are removed or re-written in HTML5.

To better handle today’s internet like responsive designs use , HTML5 also includes new elements for drawing graphics, adding media content, better page structure, better form handling, and several APIs to drag/drop elements, find Geolocation, include web storage, application cache, web workers, etc.

 

The New <canvas> Element

Tag Description
<canvas> Used to draw graphics, on the fly, via scripting (usually JavaScript)

 


New Media Elements

Tag Description
<audio> Defines sound content
<video> Defines a video or movie
<source> Defines multiple media resources for <video> and <audio>
<embed> Defines a container for an external application or interactive content (a plug-in)
<track> Defines text tracks for <video> and <audio>

 


New Form Elements

Tag Description
<datalist> Specifies a list of pre-defined options for input controls
<keygen> Defines a key-pair generator field (for forms)
<output> Defines the result of a calculation

 


New Semantic/Structural Elements

HTML5 offers new elements for better structure:

Tag Description
<article> Defines an article
<aside> Defines content aside from the page content
<bdi> Isolates a part of text that might be formatted in a different direction from other text outside it
<command> Defines a command button that a user can invoke
<details> Defines additional details that the user can view or hide
<dialog> Defines a dialog box or window
<summary> Defines a visible heading for a <details> element
<figure> Specifies self-contained content, like illustrations, diagrams, photos, code listings, etc.
<figcaption> Defines a caption for a <figure> element
<footer> Defines a footer for a document or section
<header> Defines a header for a document or section
<mark> Defines marked/highlighted text
<meter> Defines a scalar measurement within a known range (a gauge)
<nav> Defines navigation links
<progress> Represents the progress of a task
<ruby> Defines a ruby annotation (for East Asian typography)
<rt> Defines an explanation/pronunciation of characters (for East Asian typography)
<rp> Defines what to show in browsers that do not support ruby annotations
<section> Defines a section in a document
<time> Defines a date/time
<wbr> Defines a possible line-break

 


Removed Elements

The following HTML 4.01 elements are removed from HTML5:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>

For More Detailed Portfolio, click here

Leave a Reply

Your email address will not be published. Required fields are marked *

Categories
  • HTML 5 (6)
  • News (21)
  • PHP (6)
  • Social networking (6)
  • Latest tweets
  • Latest Tweets

  • Find us on facebook
  • Facebook Likes