ШарпР
 Скачать 5.46 Mb.
| Образовательный портал Как узнать результаты егэ Стихи про летний лагерь 3агадки для детей |
| ББК 32.988.02-018 УДК 004.438.5 Л 81 Лоусон Б ., Шарп Р . Л 81 Изучаем HTML5. Библиотека специалиста . 2- е изд . — СПб .: Питер , 2012. — 304 с .: ил ISBN 978-5-459-01156-2 Эта книга, существенно обновленная и дополненная во втором издании, посвящена изучению нового стандарта веб-программирования HTML5 и использованию новых функциональных воз- можностей, предоставляемых веб-разработчикам. Написанная опытными программистами, давно работающими с HTML5, книга расскажет, как приступить к освоению этого языка программиро- вания и адаптации веб-проектов для того, чтобы в полной мере воспользоваться преимуществами нового стандарта. Авторы не заставляют вас читать избыточно подробные спецификации языка, а учат применять HTML5 на конкретных примерах. С помощью этой книги вы узнаете, каковы новые семантики и структуры HTML5, как использо- вать мультимедийные элементы HTML5 для размещения аудио- и видеоданных, как разрабаты- вать «умные» веб-формы и совершенствовать приложения, использующие географическую при- вязку, с помощью API геолокации. Новое издание книги дополнено более подробной информацией о работе с аудио, видео и графи- кой, о функциях геолокации, автономном режиме хранения данных, применении HTML5 в старых браузерах. ББК 32.988.02-018 УДК 004.438.5 Права на издание получены по соглашению с New Riders Publishing. Все права защищены Никакая часть дан - ной книги не может быть воспроизведена в какой бы то ни было форме без письменного разрешения владель - цев авторских прав Информация , содержащаяся в данной книге , получена из источников , рассматриваемых издательством как надежные Тем не менее , имея в виду возможные человеческие или технические ошибки , издательство не может гарантировать абсолютную точность и полноту приводимых сведений и не несет ответственности за возможные ошибки , связанные с использованием книги ISBN 978-0321784421 англ © Remy Sharp and Bruce Lawson ISBN 978-5-459-01156-2 © Перевод на русский язык ООО Издательство « Питер », 2012 © Издание на русском языке , оформление ООО Издательство « Питер », 2012 КРАТКОЕ ОГЛАВЛЕНИЕ Введение . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Глава 1 . Основная структура . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23 Глава 2 . Текст . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45 Глава 3 . Формы . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 99 Глава 4 . Видео и аудио . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 127 Глава 5 . Холст . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 161 Глава 6 . Хранение данных . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 187 Глава 7 . Автономная работа . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 221 Глава 8 . Перетаскивание . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 239 Глава 9 . Геолокация . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 253 Глава 10 . Сообщения и фоновые вычисления . . . . . . . . . . . . . . . . . . . . . . 265 Глава 11 . Работа в режиме реального времени . . . . . . . . . . . . . . . . . . . . . 281 Глава 12 . Заполнение: латаем старые браузеры и учим их понимать HTML 5 291 ОГЛАВЛЕНИЕ Введение . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13 Для кого эта книга? 15 Чем не является эта книга 15 Что мы имеем в виду под HTML5 16 Кто? Что? Когда? Почему? Краткая история HTML5 16 Как HTML5 чуть не канул в безвестность 16 Принципы, скрывающиеся за HTML5 19 Глава 1 . Основная структура . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23 Today I drank coffee for breakfast. 14 hours later, ¬ I went to bed. ) Что гораздо важнее, поскольку HTML5 создает согласованную объектную модель документа (DOM) для каждого случая плохой разметки, вам будет прости- тельно задуматься над тем, имеет ли валидация все еще какое-то значение Мы тоже задаем себе этот вопрос Мы пришли к выводу, что валидация всегда была лишь инструментом обеспечения качества, средством для достижения цели, а не самой целью Целью же является семантическая разметка: мы пытаемся добиться того, чтобы выбор элементов определялся значением содержимого, а не его внешним представлением Можно создать веб- страницу в полном соответствии с правилами, используя только таблицы, элементы div и span, но такая разметка не будет иметь отношения к семантике И наоборот, один незакодированный амперсанд может сделать прекрасно структурированную и семантически богатую веб-страницу невалидной, но при этом она останется семантической Когда мы руководим группами разработчиков, мы требуем, чтобы код обязательно проходил валидацию перед любой проверкой, не говоря уже о создании «живого» кода Это отличный способ убедиться в том, что ваш код работает правильно Ведь несмотря на то, что браузеры создают объектную модель документов (DOM) и для плохой разметки, это может быть не та модель, которая вам нужна Кроме того, парсеры HTML5 еще не добавлены во все существующие браузеры, поэтому забота о правильности страниц является залогом предсказуемого поведения CSS и JavaScript Мы используем валидаторы https://validator.w3.org и https://html5.validator.nu/ И мы рассчитываем на то, что в дальнейшем валидаторы будут развиваться: появятся такие возможности, как усиление требований к синтаксису, чтобы при желании вы могли получать уведомления о несоответствии кода, к примеру, стандартам XHTML, хотя спецификация этого не требует Хорошее впечатление производит https://lint brihten com, но мы не можем быть уверены, что он использует актуальные процедуры валидации Основная структура • 29 И СПОЛЬЗОВАНИЕ НОВЫХ СТРУКТУРНЫХ ЭЛЕМЕНТОВ HTML5 В 2004 году главный редактор спецификации HTML5 Ян Хиксон проиндексировал с помо- щью Google 1 млрд веб-страниц, чтобы посмотреть, из чего сделана «реальная» сеть. Одна из статей, в которых впоследствии были опубликованы результаты ( https://code google com/ intl/ru-RU/webstats/2005-12/classes html ), содержит список самых часто используемых имен классов в этих HTML-документах. Совсем недавно, в 2009 году, поисковая система Opera MAMA просмотрела атрибуты классов в 2 148 723 случайно выбранных URL, а также атрибуты id различных элементов (результаты индексирования Google не содержат аналогичных данных) в 1 806 424 URL (см. табл. 1 и табл. 2). Таблица 1 .1 . Имена классов Популярность Значение Частота 1 footer 179 528 2 menu 146 637 3 style1 138 308 4 msonormal 123 374 5 text 122 911 6 content 113 951 7 title 91 957 8 style2 89 851 9 header 89 247 10 copyright 86 979 11 button 81 503 12 main 69 620 13 style3 69 349 14 small 68 995 15 nav 68 634 16 clear 68 571 17 search 59 802 18 style4 56 032 19 logo 48 831 20 body 48 052 Если исключить из рассмотрения классы, явно относящиеся к оформлению, мы можем получить представление о структурах, которые авторы пытаются реализовать при созда- нии веб-страниц. 30 • Глава 1 Таблица 1 .2 . Имена id Популярность Значение Частота 1 footer 288 061 2 content 228 661 3 header 223 726 4 logo 121 352 5 container 119 877 6 main 106 327 7 table1 101 677 8 menu 96 161 9 layer1 93 920 10 autonumber1 77 350 11 search 74 887 12 nav 72 057 13 wrapper 66 730 14 top 66 615 15 table2 57 934 16 layer2 56 823 17 sidebar 52 416 18 image1 48 922 19 banner 44 592 20 navigation 43 664 Точно так же, как в HTML 5 обнаруживаются характерные черты раннего поколения Сети — мира ученых и инженеров (именно поэтому в нем есть такие элементы, как , и ), HTML5 служит отражением состояния Сети в период его разработки: добавлено 30 новых элементов, и выбор многих из них основан на данных вышеприве- денного списка имен классов и id , поскольку это именно то, что разработчики на самом деле используют. Пока нас интересуют скорее практические цели, чем философские размышления, давайте будем их использовать. В качестве примера здесь приводится разметка главной страницы блога, выполненная в стиле HTML 5 с использованием семантически нейтрального эле- мента  перейти в каталог файлов | Образовательный портал Как узнать результаты егэ Стихи про летний лагерь 3агадки для детей |