Эта книга поможет вам открыть для себя весь спектр возможностей, предлагаемых HTML
5. Материал изложен таким образом, чтобы читатель смог как можно быстрее освоить концепции, предусматриваемые HTML5 и родственными спецификациями. Вы ознакомитесь со средствами поддержки необходимых инструментов, изучите типичные примеры их применения и разрешите для себя множество вопросов, ответы на которые вам не удастся найти в спецификациях. Приведенные в книге образцы кода не просто иллюстрируют тривиальные примеры использования отдельных инструментов HTML5, но позволяют пройти через все этапы создания полноценных веб-приложений.
Издание ориентировано на опытных разработчиков веб-приложений, знакомых с программированием на javascript.
Предисловие 11
Об авторах 12
Введение 13
Глава 1. Обзор HTML 5 17
Глава 2. Элемент Canvas 41
Глава 3. Работа со звуком и видео в HTML 5 79
Глава 4. Геолокационные средства 99
Глава 5. Коммуникационные средства 125
Глава 6. Веб-сокеты 147
Глава 7. Работа с формами в HTML 5 175
Глава 8. Технология Web Workers 199
Глава 9. Технология Web Storage 217
Глава 10. Создание автономных веб-приложений в HTML 5 247
Глава 11. Будущее HTML 5 261
Предметный указатель 271
Глава 1. Обзор HTML 5 17
История появления HTML 5 17
Миф о 2022 годе и как к нему относиться 18
Кто занимается разработкой HTML 5 19
Новая идеология 20
Совместимость: идем проторенным путем 20
Удобство в использовании и принцип приоритетности 21
Упрощение взаимодействия с браузерами 22
Универсальность доступа 23
Парадигма без подключаемых модулей 23
Что включено в HTML 5, а что не включено 24
Что нового в HTML 5 26
Новый дескриптор D0CTYPE и новое объявление кодировки символов 26
Новые и устаревшие элементы 27
Семантическая разметка 28
Упрощение выбора элементов за счет использования селекторных функций 33
Протоколирование и отладка JavaScript-кода 37
window.JSON 38
DOM Level 3 38
Monkey, SquirrelFish и прочие диковинки 38
Резюме 40
Глава 2. Элемент Canvas 41
Обзор средств HTML 5 Canvas 41
Предыстория 41
Что такое холст 42
Координаты холста 42
Когда не следует использовать элемент canvas 43
Альтернативное содержимое 43
CSS и элемент canvas 44
Поддержка спецификации HTML 5 Canvas браузерами 44
Программный интерфейс HTML 5 Canvas 45
Проверка поддержки в браузере 45
Добавление элемента canvas на страницу 46
Использование преобразований в рисунках 48
Работа с путями 51
Работа со стилями линий 53
Работа со стилями заливки 54
Заливка прямоугольника 55
Рисование кривых 56
Вставка изображений в элемент canvas 57
Использование градиентов 59
Использование фоновых изображений 63
Масштабирование объектов холста 63
Использование преобразований 65
Использование текстовых функций объекта холста 67
Применение теней 69
Работа с пиксельными данными 70
Обеспечение безопасности холста 73
Создание приложения с использованием программного интерфейса HTML 5 Canvas 74
Дополнительные рекомендации: полностраничная прозрачная панель 77
Резюме 78
Глава 3. Работа со звуком и видео в HTML 5 79
Обзор возможностей элементов audio и video в HTML 5 79
Видеоконтейнеры 79
Аудио- и видеокодеки 80
Ограничения, действующие при использовании элементов audio и video 81
Поддержка элементов audio и video браузерами 82
Программный интерфейс элементов audio и video 82
Проверка поддержки в браузере 83
Мультимедийные элементы 84
Работа со звуком 89
Работа с видео 90
Дополнительные рекомендации 96
Резюме 98
Глава 4. Геолокационные средства 99
Информация, используемая для указания местоположения 100
Географические координаты — широта и долгота 100
Источники информации о местоположении 100
Получение геолокационной информации с помощью IP-адресов 101
Получение геолокационной информации с помощью технологии GPS 102
Получение геолокационной информации с помощью технологии Wi-Fi 102
Получение геолокационной информации с помощью сетей мобильной связи 102
Определяемые пользователем геолокационные данные 103
Поддержка спецификации HTML 5 Geolocation браузерами 103
Защита личных данных 104
Запуск механизма защиты личной информации 105
Обработка информации о местоположении 106
Программный интерфейс HTML 5 Geolocation 106
Проверка поддержки в браузере 106
Запрос позиции 107
Создание приложения, работающего в режиме реального времени, на основе HTML 5 Geolocation API 113
Создание HTML-кода , 115
Обработка геолокационных данных 115
Окончательный код 118
Дополнительные рекомендации 121
Каково состояние приложения 121
Как найти себя на карте Google 123
Резюме 124
Глава 5. Коммуникационные средства 125
Обмен сообщениями между документами 125
Безопасность источников 128
Браузерная поддержка обмена сообщениями между документами 129
Использование метода postMessage () 129
Создание приложения, использующего метод postMessage () 130
XMLHttpRequest Level 2 135
Кроссдоменные XMLHttpRequest-запросы 136
События состояния запроса 138
Поддержка спецификации XMLHttpRequest Level 2 в браузерах 138
Программный интерфейс XMLHttpRequest 139
Создание приложения, использующего XMLHttpRequest-запросы 140
Дополнительные рекомендации 144
Структурированные данные 144
Подавление фреймов 144
Резюме 145
Глава 6. Веб-сокеты 147
Веб-сокеты в HTML 5 147
Работа в реальном времени и HTTP 147
Концепция веб-сокетов в HTML 5 149
Поддержка спецификации HTML 5 WebSocket браузерами 155
Простой эхо-сервер WebSocket 155
Программный интерфейс HTML 5 WebSocket 161
Проверка поддержки в браузере 161
Использование базовых функций 162
Создание приложения на основе веб-сокетов HTML 5 165
Создание HTML-кода 166
Добавление кода для работы с веб-сокетом 168
Добавление кода для работы с геолокационными данными 169
Сводим все вместе 169
Финальный код приложения 171
Резюме 174
Глава 7. Работа с формами в HTML 5 175
Обзор форм HTML 5 175
Сравнение спецификаций HTML Forms и XForms 176
Функциональные формы 176
Поддержка спецификации HTML 5 Forms браузерами 177
Каталог элементов ввода 177
Программный интерфейс HTML 5 Forms 181
Новые атрибуты и функции форм 181
Проверка достоверности форм 185
Обратная связь с пользователем при проверке ввода значений в элементы формы 190
Создание приложения на основе формы HTML 5 192
Дополнительные рекомендации 197
Проверка пароля 197
Резюме 198
Глава 8. Технология Web Workers 199
Поддержка спецификации HTML 5 Web Workers браузерами 200
Программный интерфейс HTML 5 Web Workers 200
Проверка поддержки в браузере 200
Создание потоков Web Workers 201
Загрузка и выполнение дополнительного JavaScript-кода 201
Обмен сообщениями с потоками 201
Добавление кода на основную страницу 202
Добавление кода в JavaScript-файл потока 202
Обработка ошибок 203
Прекращение выполнения потоков 203
Использование одних потоков внутри других 203
Использование таймеров 204
Простой пример 204
Создание приложения на основе технологии HTML 5 Web Workers 205
Код вспомогательного сценария blur.js 206
Код страницы приложения blur. Html 207
Код сценария blueWorker. j s 209
Передача сообщений потокам 209
Приложение в действии 210
Код примера 211
Резюме 216
Глава 9. Технология Web Storage 217
Обзор технологии HTML 5 Web Storage 217
Под держка спецификации HTML 5 Web Storage браузерами 218
Программный интерфейс HTML 5 Web Storage 219
Проверка поддержки в браузере 219
Сохранение и извлечение значений 220
Нарушения области действия данных 221
Сравнение локального хранилища и хранилища сеанса 222
Другие атрибуты и функции Web Storage 224
Передача уведомлений об обновлениях Web Storage 225
Просмотр хранилищ Web Storage в браузерах 227
Создание приложения, использующего технологию HTML 5 Web Storage 228
Будущее браузерных хранилищ 240
Дополнительные рекомендации 243
Сохранение объектов JSON 243
Совместное использование окон 244
Резюме 245
Глава 10. Создание автономных веб-приложений в HTML 5 247
Концепция автономных веб-приложений в HTML 5 247
Поддержка автономных веб-приложений браузерами 249
Программный интерфейс автономных веб-приложений в HTML 5 250
Проверка поддержки в браузере 250
Создание простого автономного приложения 250
Переход в автономный режим 250
Файлы манифеста 251
Объект applicationCache 252
Создание автономного веб-приложения 253
Создание файла манифеста для ресурсов приложения 255
Создание HTML-структуры и CSS-файла для пользовательского интерфейса 255
Создание JavaScript-сценария для автономного режима 256
Проверка поддержки кеша приложения 258
Добавление обработчика щелчка на кнопке обновления 258
Добавление кода для отслеживания геолокационных координат 259
Добавление кода для работы с хранилищем 259
Добавление обработчика событий перехода в автономный режим 260
Резюме 260
Глава 11. Будущее HTML 5 261
Поддержка HTML 5 браузерами 261
HTML развивается 262
WebGL 262
Устройства 265
Программный интерфейс работы со звуком 265
Усовершенствованное видео 266
События сенсорных устройств 266
Пиринговые сети 269
Главное направление 269
Резюме 270
Предметный указатель 271