- •Кит Джереми html5 для веб-дизайнеров Предисловие
- •1. Краткая история разметки
- •От ietf до w3c: путь к html 4
- •Xhtml 1: html по правилам xml
- •Xhtml 2: терпению пришел конец
- •Раскол: whatwg tf?
- •Объединение
- •Xhtml умер: да здравствует синтаксис xhtml
- •Развитие html5
- •2. Устройство html5
- •Принципы устройства
- •Ближе к реальности
- •Обработка ошибок
- •Доктайп, скажите честно, я буду жить?
- •Будем проще
- •Синтаксис: размечайте, как хотите
- •Мы так не разговариваем
- •Было приятно познакомиться, чао
- •Перемен, мы ждем перемен!
- •Анонимная цитата
- •Элемент a на стероидах
- •Новые игрушки! api JavaScript
- •3. Мультимедиа
- •Танец вокруг архитектуры: как рисовать с помощью кода
- •Canvas. Ага! и для чего он нужен?
- •Доступ запрещен
- •Умный Canvas
- •Вырваться из-под контроля
- •Буферизация
- •Его вам сразу вклю́чат, а может быть, включáт
- •Запасной вариант
- •Доступ на все уровни
- •Нативный режим
- •Типы полей ввода
- •Контакты
- •Ползунки
- •Проверка
- •Счетчики
- •Дата и время
- •Выбор цвета
- •Сделай сам
- •В ожидании будущего
- •5. Семантика
- •Расширяемость
- •Микроформаты
- •Вскипятить океан
- •Новые элементы
- •Структура
- •Лекарство от избытка дивов?
- •Модели содержимого
- •Содержимое, разбивающее на секции
- •Алгоритм содержания
- •Корневые элементы разделов
- •Переносимость
- •Локальные стили
- •6. Использование html5 сейчас
- •Заголовки
- •Валидация
- •Тестирование функций
- •Выберите собственную стратегию
- •Ресурсы
- •Включайтесь!
- •Будущее
- •Об авторе
Анонимная цитата
В HTML5 изменено определение элемента cite. Раньше он означал «отсылку к другим источникам», а теперь – «название работы, к которой идет отсылка». Достаточно часто ссылка на источник цитаты и есть название работы (скажем, книги или фильма), но настолько же часто источником может быть и человек. До HTML5 вы могли разметить имя этого человека с помощью cite. Теперь это однозначно запрещено – прощай, обратная совместимость.
Оправдывают это изменение примерно следующим: браузеры выделяют текст внутри тега <cite> курсивом; названия работ обычно выделяют курсивом3, а имена людей – нет, таким образом, элемент cite не должен использоваться для того, чтобы размечать имена авторов.
Это просто неправильно. Я полностью за то, чтобы HTML5 ориентировалась на существующие в браузерах реалии, но здесь явный случай того, когда хвост виляет собакой.
К счастью, ни один валидатор не отличит, относится ли текст между открывающими и закрывающими тегами <cite> к человеку или нет, так что ничто не мешает нам, веб-разработчикам, использовать элемент cite имеющим смысл образом, к тому же поддерживающим обратную совместимость.
Элемент a на стероидах
Если изменения в уже существующих элементах включают в себя креативную игру в определения, один элемент в HTML5 обновился полностью.
Элемент a, без сомнения, самый важный элемент в HTML. Он превращает наш текст в гипертекст. Это соединительная ткань Всемирной паутины.
Элемент a всегда был строчным (inline) элементом. Если вы хотели сделать заголовок и абзац гиперссылками, нужно было использовать несколько элементов a:
<h2><a href="/about">Обо мне</a></h2>
<p><a href="/about">Узнайте, почему я такой.</a></p>
В HTML5 вы можете обернуть несколько элементов в один элемент a:
<a href="/about">
<h2>Обо мне</h2>
<p>Узнайте, почему я такой.</p>
</a>
Единственная оговорка – вы не можете поместить элемент a внутри другого элемента a.
Может показаться, что оборачивать несколько элементов в один элемент a – очень серьезное изменение, но большинству браузеров не придется очень много делать для того, чтобы поддерживать эту новую модель ссылок. На самом деле они уже поддерживают ее – даже несмотря на то, что такая разметка вплоть до HTML5 технически никогда не была разрешенной.
Это кажется немножко противоречащим здравому смыслу: наверное, браузеры должны реализовывать уже имеющуюся спецификацию? Но получается наоборот: новейшая спецификация документирует то поведение браузеров, которое уже наличествует.
Новые игрушки! api JavaScript
Если вы хотите почитать документацию по CSS, то отправляетесь смотреть спецификацию CSS. Если ищете документацию по разметке, обращаетесь к спецификации HTML. Но где можно найти спецификацию по различным API JavaScript, таким как document.write, innerHTML и window.history? Спецификация JavaScript касается только языка программирования – вы не найдете в ней никаких браузерных API.
Вплоть до настоящего момента браузеры создавали и реализовывали API JavaScript независимо друг от друга, заглядывая друг другу через плечо, чтобы посмотреть, что делают другие. HTML5 задокументирует эти API раз и навсегда, что должно обеспечить лучшую совместимость.
Кажется странным, что документация по JavaScript находится в спецификации разметки, но не забывайте, что HTML5 начал свое существование как спецификация для веб-приложений (Web Apps 1.0). JavaScript – неотъемлемая часть разработки веб-приложений.
Ряд разделов спецификации HTML5 целиком посвящен новым API для создания веб-приложений. Описан, например, менеджер отмены (UndoManager), который позволяет браузеру отслеживать изменения документа. Есть отдельный раздел по созданию офлайновых веб-приложений с помощью использования манифеста кэширования. Детально описан процесс перетаскивания объектов.
Как всегда, если уже существует реализация, спецификация будет опираться на нее, а не изобретать велосипед. В Internet Explorer уже несколько лет существует API для перетаскивания объектов, поэтому она и стала фундаментом для перетаскивания в HTML5. К сожалению, у API Microsoft – как бы помягче сказать – есть свои проблемы. Может быть, иногда не так уж плохо заново изобретать велосипед, если у тебя есть только велосипед с квадратными колесами.
API в HTML5 могут очень многое. И еще они полностью за гранью моего понимания. Я предоставлю возможность писать о них разработчикам, которые умнее меня. Эти API заслуживают своей собственной, отдельной книги.
В то же время в HTML5 есть еще очень много нового, что приведет нас, веб-разработчиков, в полный восторг. И этот восторг начинается прямо в следующей главе.
