Skip to content

HTML5 – New Features

Reading Time: 3 minutes

HTML5- New Features
With the aim to deliver rich web content without the need of additional plugins, HTML5 has new semantics, graphics and multimedia elements along with new APIs to make it easier to build web applications. Take a look at its new features.

html5

The new Doctype and Charset
The new HTML Doctype is very simple and easy to implement.
<!doctype html>
Since HTML5 is a markup language on its own and is not a part of SGML language anymore, it has become so simple and streamlined.
The new character encoding or Charset is also very simple. It utilizes UTF-8 and can be defined with just one meta tag.
<meta charset= “UTF-8”>

HTML5 New Structure
HTML5, unlike its predecessors recognizes the various structures of a webpage and takes them into consideration. A webpage has various structures such as header, footer, navigation, body content, sidebar content etc. and HTML5 thus, has different tags to support those.
<header> – to define header of the page
<footer> – to define the footer of the page
<nav> – to define the navigation of the page
<article> – to define the body or the main content of the page
<aside> – to define the sidebar of a page
<figure> – to define an image to be displayed in the content of a page
<section> – to define various sections of pages

HTML5 New Audio Support
HTML5 enables you to add sound to your web pages with a simple tag
<audio>
Now you don’t need to install third party plugins for enabling an audio on your webpage. However, most of the common browsers don’t yet support it, for example, Mozilla Firefox, which would want to see an .ogg file; though, it runs well on Webkit.

See also  Simple Image Caption in HTML, CSS

HTML5 Video Support
HTML5 enables you to add video to your webpage with a simple tag
<video>
But again, this is not supported by all browsers since HTML5 doesn’t clearly specify a codec for videos. You either need to give a download link or offer a flash player version of the video on your webpage. However, Google Chrome can display the video if it is encoded in both .ogg and .mp4 formats.

HTML5 New Dynamic Pages Support
With HTML5 you can easily create dynamic webpages.
Context menus – HTML5 supports the creation and usage of context menus within the webpages and applications.
href is not needed on a tag – this enables the usage of a tag in scripts and web applications without the need of a place to send the anchor.
async attribute – adding this to the script tag tells the browser to load the script separately to ensure it doesn’t slow down the loading and displaying of the page
<details> – to provide detail about an element
<menu> – to create menu system on the webpages
<command> – to define the action to be performed on the activation of dynamic element
<datagrid> – to create a table from database or other dynamic source

HTML5 New Form Types
Apart from supporting all the standard form input types, HTML5 also supports date-time, local date-time, date, week, month, time, number, range, e-mail and URL. For example, in case of email, you can instruct the browser to allow only those strings that confirm to a valid email address structure by applying a <type> of email to form inputs.

Tags:

Share your thoughts

  1. Pingback: Cordova Mobile App Build - Learn in 8 Easy Steps

Leave a Reply