Лекция. html5 и css3. Часть 1. Обзор

html5 и css3 – два новых стандарта. Стандарт html5 разрабатывался с начала 2000-х, опубликован 28 октября 2014. Спецификацию можно прочитать по адресу  http://www.w3.org/TR/html5.

Особенности HTML5

  1. Добавлены новые теги, например, теги разметки. Удалены устаревшие теги, например, не поддерживаются фреймы.
  2. Поддержка мультимедийных возможностей без дополнительных плагинов, например, без Flash.
  3. Улучшение интерактивности.
  4. Передача данных между доменами, т.е. сценарии одного домена могут влиять на исполнение сценариев другого домена.
  5. Поддержка технологии WebSockets – долгосрочное подключение к серверу.
  6. Хранение с данными на стороне клиента.
  7. Улучшение интерфейса.
  8. Новые возможности web-форм.

Особенности CSS

  1. Увеличено количество селекторов.
  2. Добавлены визуальные эффекты, например, тени, градиенты, закругления.

doctype

В отличие от предыдущих версий html предполагается только один тип:

<!DOCTYPE html>

Таким образом, указав в первой строке <!DOCTYPE html>, вы тем самым объявили, что используете HTML 5.

Устаревшие теги

Спецификация HTML 5 объявляет устаревшими некоторые теги. Например, big, font, strike, u. Также признается  устаревшей фреймовая структура, т.е. не поддерживаются также теги frame, frameset, noframe. Однако пока исполняются.

Также объявляются устаревшими некоторые параметры, например, align, valign, width, height. Отмечу, что указанные параметры давно заменены селекторами css, тем не менее они еще актуальны.

Теги для создания структуры

HTML 5 предлагает новые теги, описывающие размещение контента:

  • <header> — определяет заголовок страницы или раздела;
  • <footer> — определение завершителя страницы или раздела;
  • <nav> — область навигации;
  • <section> — логическая область страницы или группировка;
  • <article> — статья;
  • <aside> — вторичный контент.

Расположение элементов показано на рисунке ниже.

html5str

Непосредственное расположение задается при помощи таблиц стилей.

Продолжение:

Поделиться:
  • Добавить ВКонтакте заметку об этой странице
  • Мой Мир
  • Facebook
  • Twitter
  • LiveJournal
  • FriendFeed
  • В закладки Google
  • Google Buzz
  • Яндекс.Закладки
  • StumbleUpon
  • Technorati
  • БобрДобр
  • Memori.ru
  • МоёМесто.ru