ABOUT HTML5

The first is the HTML5 standard, a document on the W3C site, which describes all the new tags, attributes, new APIs, and a number of related documents, which include some additional details, such as the API for Canvas.

The second is “big”, marketing, trending HTML5, an umbrella for a whole generation of new technologies, including both the HTML5 specification itself and many CSS3 modules, various APIs for JavaScript, and the new standard for JavaScript itself – ECMAScript5.

ABOUT HTML5

Let’s look at some of the key features of html5:

It is a simpler, simpler structure of elements on the page, making it easier to write and debug code.

It provides standard elements for media objects that previously required the installation of separate plugins that had to be constantly updated.

It has its own integration with the interfaces that may be needed in modern applications. An example is geolocation, which allows the browser to determine the location of the user (his coordinates). Previously, this could only be done via GPS.

What does HTML5 give?

For developers, html5 helps them write clear semantic code. It allows you to manage many processes on the page using your standard methods, without using javascript or third-party plugins and services. This means that some cross-browser issues are being addressed as browsers implement new features in the same way.

Also, html5 makes it convenient to work on the net for ordinary users. For example, the speed of work increases, the use of the browser becomes more convenient. In order to watch videos from youtube, you do not need to install additional plugins and constantly update them.

HTML5 goals

In short, html5 targets can be called like this:

Eliminate plugins like Flash for common functionality that everyone needs. Build native support for things like audio, video, etc.

Reducing the need for JavaScript and additional code, thanks to the use of new html5 elements.

Ensuring consistency across browsers and devices.

Make it all as transparent as possible.

New HTML5 Features

There is a lot of new functionality in html5. Today even the most recent versions of modern browsers fully support all html5 functions. Therefore, in this article we will only consider the basic features of html5.

New html5 elements
The new html5 elements allow you to create the markup for the page faster, and make it simpler, clearer, and easier to debug. Here are some of the new tags:

<header> and <footer>

<nav> for any kind of menu

<aside> for sidebars or related content

<article> for articles

<section> is practically the same as div

<audio> and <video> tags allow you to play videos without plugins

<canvas> for drawing on the page using javascript

<embed> for embedding external content into the page

Along with the fact that new tags have appeared, some of the existing tags in HTML5 acquire a new meaning. So, if earlier the choice between i and em (similar to b and strong) was more often in favor of a shorter spelling, today these are tags with a different semantic load, even if by default they have the same representation in italics or bold.

Another part of the innovations concerns directly accessibility issues: here, first of all, we are talking about aria- and role-attributes, which allow marking the purpose and role of content. This information can subsequently, for example, be used by screen readers.

I must say that ensuring accessibility is not the most trivial task, and this is almost the first time that HTML5 has paid so much attention to this issue.

Another advantage of html5 is its advanced features, including API integration. This makes it easy to write cross-browser javascript code for complex applications. Here are some of them:

Audio and video allows you to play videos in the browser without plugins.

Geolocation: Determines the position of the visitor.

Drag and drop: for example, to download a file by dragging and dropping it into the browser.

Application cache: Provides support for opening sites offline.

Web workers: runs JavaScript in the background

Server sent events: Allows servers to refresh web pages in the browser after they’ve already been loaded, easier and more efficient than AJAX and JavaScript.

Offline data storage: allows you to store data locally in the browser, regardless of cookies