Новации HTML 5

В статье мы рассмотрим новшества и изменения HTML 5, и посмотрим, что из этого уже работает в новейших браузерах.

Новый доктайп и способ указания кодировки в HTML 5

В отличие от существующих громоздких доктайпов, объявление 5-ой версии кратко и лаконично:

<span><!doctype html></span>

Это связано с тем, что HTML 5 больше не является частью SGML, теперь это самостоятельный язык разметки.

Объявление кодировки в HTML 5 так же притерпело изменения. Выглядит оно теперь вот так:

<span><<span>meta</span><span> charset=<span>"UTF-8"</span></span>></span>

Новая структура в HTML 5

HTML 5 подразумевает, что страница всегда имеет структуру, сравнимую со структурой книг или XML документов. Обычно, у веб-страницы есть навигация, основной контент, второстепенный контент (чаще в сайдбаре), заголовки, футеры и так далее. Для каждого такого элемента в HTML 5 есть свои теги:

  • <section> — для каких-то частей страницы;
  • <header> — заголовок страницы;
  • <footer> — футер страницы;
  • <nav> — навигация;
  • <article> — статья или основной контент;
  • <aside> — дополнительный контент;
  • <figure> — определяет картинку, сопровождающую статью (типа как у нас к каждой статье).

Новые строчные элементы в HTML 5

Эти элементы определяют основные семантические объекты страницы:

  • <mark> — указывает на элемент, который взаимодействует с какой-то функцией;
  • <time> — выделяет дату или время;
  • <meter> — какие-либо метрические данные или характеристики;
  • <progress> — показывает процесс выполнения задачи (функции, например).

Новая поддержка динамичных страниц в HTML 5

HTML 5 создавался под динамичные страницы, поэтому в нем много возможностей для разработчиков:

  • контекстное меню — создание и использование контекстных меню внутри страниц;
  • аттрибут href больше не является обязательным, что позволяет использовать тег <a> для скриптов без необходимости выставлять якоря;
  • аттрибут async тега <script> — указывает браузеру, что загружать этот скрипт следует асинхронно; браузер не тормозит загрузку страницы, скрипт грузиться уже после загрузки страницы;
  • <details> — более подробная информация от каком-то элементе;
  • <datagrid> — создает таблицу, которая строится исходя из данных из базы или другого динамичного источника (какая-нибудь обновляемая статистика);
  • <menu> для создание системы меню;
  • <command> определяет действия, которые должны случиться при активации какого-то элемента.

Новые типы полей форм в HTML 5

HTML 5 по-прежнему поддерживает все основные типы полей форм, добавив при этом и некоторые новые:

  • datetime
  • datetime-local
  • date
  • month
  • week
  • time
  • number
  • range
  • email
  • url

Новые элементы

Вот лишь некоторые новые элементы, добавленные в HTML 5:

  • <canvas> — элемент, который позволяет вам рисовать внутри страницы, используя JavaScript; как вы знаете, многие современные js библиотеки и скрипты используют этот тег для графиков;
  • <video> позволит вам вставить видеоролик в страницу с помощью одного тега.
  • <audio> — для аудио.


При этом из HTML 5 исчезли некоторые теги

В новой спецификации больше нет некоторых тегов — некоторые из них сами по себе уже устарели и мало, кто их использует. Но, были так же удалены и некоторые довольно популярные теги. Вот полный список:

  • acronym
  • applet
  • basefont
  • big
  • center
  • dir
  • font
  • frame
  • frameset
  • isindex
  • noframes
  • noscript
  • s
  • strike
  • tt
  • u


Что уже работает в браузерах

Как я уже сказал, многие браузеры решили не дожидаться официального выхода HTML 5 (как и CSS 3) и уже начали внедрять некоторые из описанных фич в последние версии своих продуктов.


Автор данной статьи - Администратор проекта для начинающих программистов (UProgram. ru), который носит ник webDoktor.

Автор статьи: неизвестный | Дата публикации: 15:24 14.12.2016 3248440.Ru




Отзывы и комментарии
Ваше имя (псевдоним):
Проверка на спам:

Введите символы с картинки:



31 мая в США: День Украшения или День Поминовения?

31 мая в США: День Украшения или День Поминов...


«Там преклоним колени, Где наши любимые спят» (Нэлли Свифт, с посвящением «Женщинам Юга страны». Последний понедельник мая в США является общегосударственным праздником выходн...


Рэйки

Рэйки


Рэйки—японская система естественного исцеления. Один из путей духовного роста и развития. Основная идея состоит в том, что Вселенная наполнена энергиями высоких вибраций.(праной, ци, Ки, ши, шень, эне...


С тещей по жизни

С тещей по жизни


     Моя сексуальная жизнь изменилась к лучшему, когда я женился. Мне было 23 года, когда я познакомился со своей будущей женой.      Ей было без мало...


Асфальтирование

Асфальтирование


Действующее законодательство довольно жёстко относится к нарушению экологических нормативов. Иногда, простой вывоз мусора, проведенный вовремя, может избавить от финансовых проблем. Такая ситуация пре...


Убьют ли ридеры печатную книгу?

Убьют ли ридеры печатную книгу?


Мы, пожалуй, очень любим драматизировать. Нельзя забывать о том, что, как бы это банально ни звучало, мир стремительно изменяется. Нынешняя эпоха — это эпоха информационных технологий,...


Современное кино. Что мы смотрим?

Современное кино. Что мы смотрим?


Не так давно на экраны вышел новый фильм с Сильвестром Сталлоне — Рэмбо 4. Самая примечательная его черта — это море крови, мяса и вырванных внутренностей. И больше ничего! Сюжет фильма практически ни...


Популярное

Уверенность в себе. Зачем вести Дневник успеха?

Сегодня мы поговорим о том, зачем вести Дневник успеха и как это влияет на нашу самооценку. Многие уже наверняка знают про такие дневники и про то, что кто-то их ведет. Но не все знают о его поистине ...

Как подготовиться к экзаменам?

Как подготовиться к экзаменам? Всем понятно, что было бы лучше, если бы все учащиеся и студенты усердно занимались в течение года. Но, к сожалению, эта мысль из серии фантастики приходит в г...

Как жить с детьми? Часть 1

Отрывок из статьи Л. Рона Хаббарда Главная проблема, возникающая в связи с детьми, — это как с ними жить. При воспитании детей проблема заключается во взрослом, а не в ребёнке. Одно из луч...

Архитектурная подсветка зданий

С наступлением ночного времени суток города преображаются - загораются огни. Архитектурные изыски зданий проявляются в новом свете. Величественные колонны, капители, изящная лепнина, светоотражающие с...

Рубенс, «Венера и Адонис». Адонис или горицвет?

Венера влюбилась! Да еще как! Бросила все: Смертным пленясь, покидает она побережье Киферы. Ей не любезен и Паф, опоясанный морем открытым, Рыбой обильнейший Книд, Амафунт, чреватый металлом… ...

Массаж: как получить максимальную пользу?

Массаж сегодня в цене. Ведь у него масса полезных свойств: он и расслабляет, и лечит, и держит в тонусе. А кроме того, это еще и модно. Однако даже такая невинная процедура, как массаж, требует перест...

Почему не надо спешить исполнять мечту?

У каждого из нас есть разного рода желания и мечты, но не все из них можно осуществить. Однако это не так уж и плохо! Попробую объяснить почему. Первая реакция на исполнение мечты — несомн...

Счастливая семья или жизнь после свадьбы

Человек занят тем, от чего он ожидает счастья, но самое большое его счастье состоит в том, что он занят. Ален За долгие годы совместной жизни мы узнаем о своей половинке столько же, сколько знаем и о ...

Вкусные рецепты: "Жареный суп", Шоколадн

"Жареный суп"На горячую сковороду с раст.маслом выкладываем мясо(режем как на азу или гуляш пару горстей)обжариваем до румяной готовности.Готовое мясо выкладываем в кастрюльку и "укрываем" пережаркой ...

Рубенс, «Пир Ирода». Как имя вошло в историю?

Слово «ирод» знакомо многим: оно заменяет ругательство. «Ах ты, ирод!» — слышим мы порой в адрес нечестивца. И редко задумываемся, кто же такой — это...

О портале:

Наш портал является ресурсом, который включает в себя обширный каталог познавательных и увлекательных статей. Абсолютно каждый посетитель найдет для себя что-нибудь нужное. Современный дизайн дает возможность вам моментально находить актуальную информацию. Самые разнообразные тематические статьи дают возможность вам совершенствоваться в той или иной сфере. Быть более начитанным и грамотным. Современный дизайн сайта позволяет просматривать статьи на всех существующих планшетах. Теперь отыскать необходимую информацию стало совершенно легко.

Мы подобрали для вас познавательные и занимательные статьи. На нашем портале вы найдете ответы на интересующие вас вопросы. Стандартная система поиска позволяет вам стремительно отыскать нужную информацию. Адаптированный дизайн позволяет вам просматривать информацию на любых электронных устройствах. Отныне, поиск необходимой информации будет занимать у вас секунды.