 |
| HTML5 INTRODUCTION WITH NEW FEATURES |
HTML5 Introduction
Today we will learn about the introduction of HTML5 and its features. HTML is an important language in the field of web design & development. Whenever someone moves into the field of web development, he has to learn about HTML Tags and its atttributes at first. It is a simple language, which can be easily learned. Because of its simplicity, HTML has been a popular language since the beginning.
In today's era, technology is changing so fast. That's why HTML has been upgraded several times over time to meet the new requirements. So far, six popular versions of HTML have been released. These are given as below.
HTML1.0 – published in 1991
HTML2.0 – published in 1995
HTML3.2 – published in 1997
HTML4.01 – published in 1999
XHTML – published in 2000
HTML5.0 – published in 2014
HTML5 is the latest version of HTML. It was published by the World Wide Web Consortium (W3C) in October 2014. It has been upgraded with multimedia support. It uses the pragmatic approach to solve the real world problems.
HTML 5 Features
In HTML5, the syntax is easy to learn. It supports multimedia without a flash player (Audio and Video). You can create drawings graphic using canvas, SVG and JS code. It supports to work with server and database. It is very helpful in API development (Drag and drop, GEO location API). Semantic elements & attributes are the most important feature to helps coders. HTML5 fully supports CSS3 and becomes more powerful.
Many of the HTML5 features make it easier and better than the older versions. These are given as below.
1. Syntax easy to learn
2. HTML5 is a universal
3. There is less plug-in requirement in HTML5
4. HTML5 is very secure
5. There are new elements in HTML5
a. Semantic Elements
b. Multimedia Elements
c. Graphic Elements
d. Form Elements
6. Input type
7. New form attributes
8. Excluded Elements from HTML5
9. New HTML5 APIs
1. Syntax easy to learn
It is made very simple. For example, the declaration of DOCTYPE before HTML5 was very lengthy. You can see it as below.
<!DOCTYPE HTML PUBLIC "-//w3c//DTD HTML 4.01 Transitional//EN "http://www.w3.org/TR/html4/loose.dtd">
As you can see here, it is very difficult to write and remember. It has been simplified in HTML5 version. Now you can write it in a simple way.
<!DOCTYPE html>
Defining character set in HTML5 has also been made simpler. Before HTML5 you used to define the character set like this.
<meta http-equiv="Content-Type" content="text/html"; charset=utf-8">
Same as DOCTYPE declaration it was very complex to write. Now, in HTML5 character has been simplified as below.
<meta charset=utf-8>
Some new changes have also been made to reduce the use of script in HTML5. For example, before HTML5 you used to force the user to enter a value in a form with a complex script of several lines.
The “required” attribute has been added for the form elements in HTML5. The elements on which you want to perform this validation can be defined. By doing so, if a user does not enter a value, then he will get the message.
Syntax:-
<input type="text" name="userName" required>
Example:-
<input type=”text” name=”First_Name” required>
2. HTML5 is a universal
HTML5 can work with almost all other languages. Here, you do not need any type of external functionality for this. This support is built in HTML5. For example, if you want to work smoothly with ruby, the new <ruby> element has been defined in HTML5.
3. There is less plugin requirement in HTML5
There are many built-in support features in HTML5 before HTML5 version plugins were required. For example, Flash is required to play online video. However, it is also built in many browsers. But built-in support for Flash in HTML5 is provided.
4. HTML5 is very secure
Built-in security features have been provided in HTML5. HTML5 uses origin-based security. HTML5 has a cross-source sharing capability to make data sharing secure.
5. There are new elements in HTML5
Many new elements have been added to HTML5 in different categories. These are given as below.
a. Semantic Elements
These are also called layout elements. These are used to define the layout of the web pages.
<article>
<aside>
<figure>
<header>
<details>
<wbr>
<time>
<meter>
<section>
<nav>
<figcaption>
<footer>
<summary>
<hgroup>
<mark>
<ruby>
<rp>
<rt>
<main>
b. Multimedia Elements
These elements are used to support multimedia (audio, video etc.) in the webpage.
<audio>
<video>
<source>
<track>
<embed>
c. Graphic Elements
Graphic elements are used to add graphics to the web page.
<canvas>
<svg>
d. Form Elements
To make Forms even better, many new form elements have been provided in HTML5.
<datalist>
<keygen>
<output>
6. Input type
Many new input types are included in HTML5.
salmon4
date
datetime
datetime-local
email
month
number
range
search
tel
time
url
week
7. New form attributes
With the input types, some new form attributes are also included in HTML5.
autocomplete
autofocus
formaction
formmethod
formnovalidate
formtarget
list
max
min
multiple
novalidate
pattern
placeholder
readonly
required
spellcheck
step
8. Excluded Elements from HTML5
In HTML5 some elements of the previous version have been excluded.
<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
<tt>
9. New HTML5 APIs
Some new application program interfaces are included in HTML5.
High-Resolution Time API
User Timing API
Navigation Timing API
Network Information API
Vibration API
Battery Status API
Page Visibility API
Fullscreen API
getUserMedia API
WebSocket API
Geolocation API
Drag and Drop API
Local Storage API
Application Cache API
Web Workers API
HTML SSE
Great post. I was checking continuously this blog and I am impressed!
ReplyDeleteVery helpful information particularly the last part :) I care for such information a
lot. I was seeking this certain information for a long time.
Thank you and best of luck.
By the way, I heard about this awsome affiliate program for Instagram
influencers. Better apply soon before all the spots are filled up.
Here is the link: http://urlki.com/3dpa4