Web technologies are constantly evolving. Every day new sites are created that expand the capabilities of HTML. HTML 4 has been around for almost a decade, but publishers are looking for new ways to extend the functionality of this format. However, the variety of languages ​​and browsers limits some of its capabilities.

To give developers a more flexible, compatible product, and also to make projects more interactive and interesting, HTML 5 introduces and expands the range of functions, including management forms, APIs, multimedia, structure and semantics.

Work on HTML 5 was launched in 2004. Currently, the development is carried out as part of the joint efforts of W3C HTML WG and WHATWG. Many well-known companies take part in the development, including: Apple, Mozilla, Opera, and Microsoft, and a number of other organizations and individuals with various interests and experience.

Note that the specification is still under development, and is very far from complete. Therefore, it is possible that any features mentioned in this article may change in the future. This article aims to describe the new features of HTML version 5. HTML 5


structure

introduces a number of new elements that make page structure much easier. Most HTML4 pages contain a number of common structures, for example, headers and footers and columns, and today it has become a tradition to select them using div elements, assigning it a class or id.

The illustration shows a typical 2-column layout using div elements, assigning them a class or id. The structure contains - the "header" of the page, the footer, the navigation menu and the content, divided into 2 columns -

The use of div elements mainly because in the current version of HTML 4 there is not enough semantics to describe these parts more specifically. HTML 5 solves this problem by introducing new elements, each of which has its own separate name.



The document code looks like this:

...
...
...


...
...


There are several advantages to using these elements. When used in combination with element headings (h1 - h6), this makes it possible to embed your subdivision with a heading into each level, unlike the possible 6 levels in the previous version and HTML. The specification includes a detailed algorithm for generating boundaries . These elements can be used as copyright and browser tools to generate a table of contents and to help users navigate through the document.

For example, the following structure is divided into levels with nested elements h1:

Level 1

Level 2

Level 3

Note that for maximum compatibility with different browsers, you can use different levels of headers, such as h2, h3, etc.

By identifying the purpose of sections on a page using specific section elements, such a technology can help the user navigate the page more easily. For example, the user can easily go to the menu section or quickly move from one article to the next without the need for the developer to make such a link-transition. Developers can also triumph, because by replacing div elements with appropriate elements, the source code will be simpler and “cleaner”.

Header elementrepresents the title of the page. This section may contain not only the title as such, but also any subheadings that will help the user better understand the content of the page.

A Preview of HTML 5

By Lachlan Hunt

Example Blog

Insert tag line here.

The footer element is the footer of the page. This part of the page usually contains a link to the rights of the author, counters, etc.

© 2007 Example Inc.


The “nav” element - defines the section of site navigation:

• Home
• Products
• Services
• About

The aside element defines a section indirectly related to the content of the page, most often used as an application.

Archives

• September 2007
• August 2007
• July 2007

The section element can be used as a general section of the page content.

Chapter 1: The Period

It was the best of times, it was the worst of times,
it was the age of wisdom, it was the age of foolishness,
it was the epoch of belief, it was the epoch of incredulity,
it was the season of Light, it was the season of Darkness,
...

The article element is the content of the page itself, i.e. defines content as such: articles, news, comments, etc.

Comment #2
by Jack O'Niell

August 29th, 2007 at 13:58

That's another great article!



The next part of the article describes the implementation of video and audio elements.