В курсе рассказывается об истории создания HTML5, возможностях, совместимости с другими стандартами, основных структурных элементах и их использовании в современных браузерах.
Демонстрируются новые элементы разметки и атрибуты, улучшающие формы, элемент video и создание индивидуального видеоплеера, "холст", API сокеты, кэширование приложение и хранилища данных на клиентских компьютерах. Дается введение в технологию многопоточного выполнения кода Web Workers и описываются основные возможности геолокации.
Глава << | Занятие | Заголовок << | Дата изучения |
|
Глава 1 << | | Основы HTML5 | |
| 22 минуты |
Основные вехи истории создания HTML5. Перспективы языка, сравнение с другими стандартами. Проблемы совместимости. Обсуждаются новые свойства языка разметки, а также технологии, не имеющие прямого отношения к стандарту HTML5, но тесно с ним связанные. API браузеров. JavaScript/DOM. Сокеты. Автономные web приложения, кэши приложений и локальная база данных Web SQL. Увеличение производительности за счет компонента Web Workers. Геолокация.
| - |
| 41 минута |
В лекции рассматриваются структурные элементы HTML5. Демонстрируется, каким образом новые свойства языка взаимодействуют друг с другом в контексте реальной web-страницы. Использование тегов логической компоновки документа: колонтитулов, навигационных панелей, автономных фрагментов контента, блоков для иллюстраций, разметки времени и даты. Специфика описания типа документа (DTD - Document Type Definition). Как новые средства языка поддерживаются в популярных браузерах. Методики, позволяющие заставить старые клиентские программы отображать неизвестные элементы разметки.
| - |
| 27 минут |
Рассказывается о новых элементах разметки и атрибутах, улучшающих формы. Примеры новых элементов числового ввода, ползунков, списков выбора даты и времени, выбора цвета из цветовой палитры, индивидуального поиска по сайту, элементов ввода со списком вариантов, поля для телефонных номеров, e-mail- и url-адресов. Новые механизмы вывода информации: вывод результатов вычислений, панель индикатора выполнения. Встроенная в HTML5 проверка заполнения формы.
| - |
| 36 минут |
| - |
|
Глава 2 << | | Видео | |
| 29 минут |
В данной лекции описывается элемент <video> и некоторые связанные с ним API. Перечислены основные поддерживаемые видеоформаты. Автор рассказывает о наиболее важных способах, с помощью которых можно управлять видео через JavaScript и возможностях создания собственных элементов управления проигрывателем. Как элемент <video> сочетается с другими элементами web страницы. Оформление видео с помощью каскадных таблиц стилей (CSS3). Особое внимание уделяется совместимости новых свойств языка со старыми браузерами.
| - |
| 42 минуты |
Лекция представляет собой описание проекта создания индивидуального видеоплеера HTML5 с улучшенной доступностью. На примерах рассматривается разработка элементов управления плеером: кнопок и ползунков. Создание титров и стенограмм. Описывается проблемы, связанные с управлением плеером посредством клавиатуры. Использование JavaScript-библиотеки jQuery для программирования индивидуальных особенностей видеоплеера. Приводится подборка полезных ресурсов в сети интернет.
| - |
| 36 минут |
| - |
|
Глава 3 << | | Холст и сокеты | |
| 26 минут |
Основы использования элемента "холст". Из данной лекции вы узнаете, как создавать на холсте графические примитивы в виде прямоугольных и треугольных областей со свойствами заливки и обводки. Даны особенности рисования линий и штрихов. Рисование фигур с помощью путей. Вставка в холст других изображений, сформированных элементами img и canvas. Манипуляции с пикселями изображения. Методики добавления на холст текста, теней и градиентов.
| - |
| 18 минут |
Приводится описание API сокетов HTML5 с примерами использования. Основные протоколы для обмена информацией между клиентскими и серверными приложениями. Методы, свойства и события объекта WebSocket. Описаны конструкторы для создания соединения с сервером, использующие различные настройки. Открытие и закрытие соединений. Характеристика сообщений от сервера, обработка основных ошибок, возникающих при работе с сокетами. Методики проверки поддержки сокетов в браузере клиента.
| - |
| 36 минут |
| - |
|
Глава 4 << | | Кэширование и хранение клиентских данных | |
| 33 минуты |
В данной лекции речь идет о методах кэширования приложений на клиентских компьютерах. Отличия кэша браузеров от кэша приложений HTML5. Файл манифеста и его основные директивы. Подключение манифеста к web приложению. Явное определение файлов для кэширования. Предоставление пользователю резервного контента. Использование API кэша приложений и событий для проверки использования актуальных версий файлов. Проверка поддержки технологии браузером. Статусы, события и обработчики событий кэша приложений.
| - |
| 19 минут |
Рассматриваются сессионные (Session Storage) и локальные (Local Storage) хранилища данных на стороне клиента. Сравнение технологий хранилищ HTML5 с технологией Cookie. Помещение и извлечение данных из сессионного и локального хранилищ. Удаление данных. Лимит хранилища. Использование событий хранилища. Вопросы безопасности и соответствующие рекомендации.
| - |
| 36 минут |
| - |
|
Глава 5 << | | Технология Web Workers и геолокация | |
| 14 минут |
Введение в технологию многопоточного выполнения кода Web Workers. Принципы работы и случаи использования. Какие стандартные объекты JavaScript доступны для Web Workers. Присущие ему ограничения. Поддержка в современных браузерах. Дополнительные ссылки по теме.
| - |
| 19 минут |
В завершающей курс лекции описываются основные возможности API геолокации. Как определяется местоположение пользователя. Стандартные предупреждения безопасности. Способы использования API геолокации в приложениях web. Прямое и обратное геокодирование. Геолокация на примере карт от Google.
| - |
| 36 минут |
| - |
|
|