5 novelties and peculiarities of HTML5

Programming

Today developers are talking more and more about how great HTML5 is. What is this latest craze about? What is HTML5? Let’s find out.

In short, HTML5 is a language for structuring and displaying content on the Internet. HTML5 is a markup language for structuring and presenting content for the World Wide Web, and is a core technology of the Internet originally proposed by Opera Software. It is already the fifth version of the original HTML-standard.

What's new in the latest version?

Semantics

HTML5 has a number of new semantic tags that allow developers to organize the internal structure of web pages more meaningfully. This includes both block tags like header, footer, article, and tags for marking the text like, mark, ruby and details. (Some of the existing HTML4 tags are already deprecated, some of them have changed their meaning and some of their attributes have changed too.)

Multimedia

HTML5 adds support to multimedia content (audio and video) directly into the MTL marking, with the corresponding API to control the playback.

Graphics

Working with graphics on the client’s side is now much easier. HTML5 has added a canvas element and a special API for JavaScript to work with it. Canvas is a dynamic "surface" that allows developers to draw programmatically over it. (Also HTML5 officially included tag svg, which enables implementing vector graphics, described by corresponding Internet standard (SVG, Scalable Vector Graphics).

Web forms

Both types and attributes as new items of web forms allow developers to extend capabilities of traditional forms by integrated tools without using additional libraries. They vary from tips in the input box (placeholder) and verification of entered values to specific items for entering dates and color.

JavaScript APIs

API let you work with graphics and multimedia, move objects (Drag & Drop) and work with the history of transitions (History API), and a number of details.

In order to use this technology on your website, first you have to use a new type of a document: <!DOCTYPE html>

To make the new tags appear correctly, you need to block them in styles:

article {display: block}
aside {display: block}
footer {display: block}
header {display: block}
nav {display: block}
section {display: block}

All modern browsers support HTML5 (Chrome, Firefox, Safari, IE9 and Opera), and the HTML5 doctype was developed so it can be understood by the aforementioned, even the oldest browser. However, despite the fact that they understand the doctype, it does not mean that they understand all the tags of HTML5. All this was done for sake of simplicity and the cross-browser. Withe other versions of IE, we can use Javacript.

Comments