Htm разработка приложений для мобильных устройствСерия Бестселлеры O Reilly

Э. Вейл
HTML5. Разработка приложений для мобильных устройств
Серия «Бестселлеры O’Reilly»
Перевели на русский Н. Вильчинский, О. Сивченко
Заведующий редакцией
Д. Виницкий
Ведущий редактор
Н. Гринчик
Литературный редактор
Н. Рощина
Художник
Л. Адуевская
Корректор
Е. Павлович
Верстка
А. Барцевич
ББК 32.988.02-018
УДК 004.438.5
Вейл Э.
В26 HTML5. Разработка приложений для мобильных устройств. — СПб.: Питер,
2015. — 480 с.: ил. — (Серия «Бестселлеры O’Reilly»).
ISBN 978-5-496-01125-9
Создавайте сногсшибательные сайты и приложения для любых мобильных и настольных платформ.
Для этого вам потребуется всего лишь добавить в ваш инструментарий веб-разработки технологии
HTML5 и CSS3. Вооружившись этой практичной книгой, вы научитесь разрабатывать веб-приложения, которые не только хорошо работают на iOS, Android, Blackberry и Windows Phone, но и очень удобны в использовании.
Книга содержит множество примеров кода и разметки. Она поможет вам освоить работу с раз- нообразными инструментами HTML5 — в частности, с новыми веб-формами, масштабируемой векторной графикой (SVG), холстом (Canvas), localStorage и другими родственными API. Кроме того, в этом издании подробно рассмотрены таблицы стилей CSS3. Вы научитесь разрабатывать приложе- ния, которые одинаково хорошо работают как на огромных мониторах, так и на крошечных экранах.
12+
(В соответствии с Федеральным законом от 29 декабря 2010 г. № 436-ФЗ.)
ISBN 978-1449311414 англ.
Authorized Russian translation of the English edition Mobile HTML5
(ISBN 9781449311414) © 2014 Estelle Weyl. This translation is published and sold by permission of O’Reilly Media, Inc., the owner of all rights to publish and sell the same.
ISBN 978-5-496-01125-9
© Перевод на русский язык ООО Издательство «Питер», 2015
© Издание на русском языке, оформление ООО Издательство «Питер», 2015
Права на издание получены по соглашению с O’Reilly. Все права защищены. Никакая часть данной книги не может быть воспроизведена в какой бы то ни было форме без письменного разрешения владельцев авторских прав.
Информация, содержащаяся в данной книге, получена из источников, рассматриваемых издательством как на- дежные. Тем не менее, имея в виду возможные человеческие или технические ошибки, издательство не может гарантировать абсолютную точность и полноту приводимых сведений и не несет ответственности за возможные ошибки, связанные с использованием книги.
ООО «Питер Пресс», 192102, Санкт-Петербург, ул. Андреевская (д. Волкова), 3, литер А, пом. 7Н.
Налоговая льгота — общероссийский классификатор продукции ОК 005-93, том 2; 95 3005 — литература учебная.
Подписано в печать 27.08.14. Формат 70×100/16. Усл. п. л. 38,700. Тираж 1000. Заказ 0000.
Отпечатано в полном соответствии с качеством предоставленных издательством материалов в ГППО «Псковская областная типография». 180004, Псков, ул. Ротная, 34.

Краткое содержание
Введение
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
От издательства
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
Глава 1.
Подготовка к изучению API для работы с мобильным HTML5,
CSS3 и JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
Глава 2.
Как усовершенствоваться до HTML5 . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
Глава 3.
Новые элементы, появившиеся в HTML5 . . . . . . . . . . . . . . . . . . . . . . . . 93
Глава 4.
Веб-формы в HTML5 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .118
Глава 5.
Масштабируемая векторная графика, холст, аудио и видео . . . . . . . . .168
Глава 6.
Другие API HTML5 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .194
Глава 7.
Переход на новый качественный уровень с помощью CSS3 . . . . . . . . . .229
Глава 8.
Расширение вариантов настроек с помощью значений CSS3 . . . . . . . . .277
Глава 9.
CSS3: модули, модели и изображения . . . . . . . . . . . . . . . . . . . . . . . . .296
Глава 10.
CSS3: преобразования, переходы и анимация . . . . . . . . . . . . . . . . . .342
Глава 11.
Использование свойств CSS в адаптивном веб-дизайне . . . . . . . . . . .378
Глава 12.
Разработка приложений для мобильных устройств . . . . . . . . . . . . . . .405
Глава 13.
Ориентация на мобильные устройства и сенсоры . . . . . . . . . . . . . . . .427
Глава 14.
Производительность мобильных устройств . . . . . . . . . . . . . . . . . . . . .444
Приложение.
CSS-селекторы и уровни конкретизации . . . . . . . . . . . . . . . . . . .471

Оглавление
Введение
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16
Сравнение нативных приложений и веб-приложений . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
Напутствие (прощание со старым Internet Explorer) . . . . . . . . . . . . . . 19
Браузерный ландшафт . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Сравнение веб-приложений и нативных приложений. Краткий исторический экскурс . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
Выход SDK. Появление сторонних приложений . . . . . . . . . . . . . . . . . 21
Что нового? Новые элементы и API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
Теги для семантической группировки . . . . . . . . . . . . . . . . . . . . . . . . . 23
Веб-формы . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
Масштабируемая векторная графика и холст . . . . . . . . . . . . . . . . . . . 24
Видео и аудио . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
Геолокационный API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
Офлайн-контент и хранилище данных . . . . . . . . . . . . . . . . . . . . . . . . 25
Другие API . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
Что нового в CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25
Проблемы, специфичные для мобильной среды . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
Что особенного в этой книге . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Размер экрана . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
Чего хотят пользователи . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
О чем эта книга . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
Условные сокращения, используемые в книге . . . . . . . . . . . . . . . . . . . . . . . 30
Работа с примерами кода . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
Как с нами связаться . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
Благодарности . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
От издательства
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
Глава 1.
Подготовка к изучению API для работы с мобильным HTML5,
CSS3 и JavaScript . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
CubeeDoo: игра для мобильных браузеров на HTML5 . . . . . . . . . . . . . . . . . 36
Инструменты разработки . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38

Оглавление
7
Текстовый редактор . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
Браузер . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38
Инструменты отладки . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
Отладчики для работы на ПК . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40
Удаленная отладка . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42
Инструменты тестирования . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Эмуляторы и симуляторы . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 49
Онлайн-инструменты . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51
Смартфоны . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
Автоматизированное тестирование . . . . . . . . . . . . . . . . . . . . . . . . . . 55
Глава 2.
Как усовершенствоваться до HTML5 . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
Синтаксис HTML5 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
Элементы . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57
Атрибуты . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 58
Глобальные атрибуты и атрибуты интернационализации . . . . . . . . . . 59
Атрибуты HTML 4, вошедшие в число основных в HTML5 . . . . . . . . . . 62
Что нового в HTML5: глобальная доступность и интерактивные атрибуты . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
Синтаксис HTML-элементов и атрибутов . . . . . . . . . . . . . . . . . . . . . . . . . . . 69
Самозакрывающиеся элементы . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
Рекомендуемые методы . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 72
Необходимые компоненты . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 73
Элементы, находящиеся в
;

заглавие документа, находящееся в заголовке, —
;

тело документа, прямой потомок html
—

  1   2   3   4   5   6   7   8   9   ...   21