Урок 1. Основы синтаксиса и семантики и передовые методы разметки. • Объявление DOCTYPE.
• Определение кодировки, языка.
• Оптимизация и link.
• Добавление в структуру документа новых элементов HTML5.
• Элемент article или section.
• Проверка и изменение структуры документа.
• Временное скрытие содержимого.
• Управление нумерацией списков.
• Создание редактируемых частей страницы.
• Проверка поддержки HTML5.
• Валидация HTML5.
Урок 2. Формы. Встроенное аудио и видео. • Поле ввода контактной информации.
• Использование полей ввода даты и времени.
• Численный ввод.
• Отображение поискового поля ввода.
• Выбор значения из числового диапазона.
• Создание редактируемого раскрывающегося списка.
• Обязательные поля формы.
• Автофокусировка на поле формы.
• Отображение замещающего текста.
• Отключение автозаполнения.
• Ограничение значений.
• Создание простой формы.
• Добавление НТML5-аудио и управление аудиопотоком.
• Создание аудиопроигрывателя.
• Добавление НТМL5-видео.
• Кроссбраузерная поддержка видео и настройка видеоразрешения.
• Цикличное воспроизведение видео.
Урок 3. Микроданные и пользовательские данные. Геолокация. • Добавление в разметку микроданных.
• Использование микроданных.
• Добавление в разметку пользовательских данных.
• Доступ к пользовательским данным с помощью Java.
• Управление пользовательскими данными.
• Создание приложения для карты с помощью пользовательских данных.
• Получение основных геолокационных данных.
• Альтернативный способ получения основных геолокационных данных.
• Получение адреса путем обратного геокодирования широты и долготы.
• Преобразование адреса в широту и долготу.
• Drag and drop
• Progress bar
Урок 4. Элемент Canvas. • Рисование на элементе canvas.
• Использование эффекта прозрачности.
• Установка размеров «холста».
• Использование градиентов, узоров и стилей линий.
• Добавление на «холст» внешних изображений.
• Настройка цветовых преобразований.
• Использование геометрических преобразований.
• Добавление на «холст» текста.
• Обрезка рисунков на «холсте».
• Добавление эффекта анимации к рисункам на «холсте».
• Рисование графиков на «холсте».
• Сохранение рисунка с «холста» в файле.
Урок 5. Элементы доступа и расширенные возможности Java в HTML5. • Создание текстового описания рисунка.
• Определение аббревиатур и сокращений.
• Определение разделов страницы с помощью ключевых ролей ARIA.
• Создание доступных навигационных ссылок.
• Связывание полей формы с метками.
• Логическая группировка полей формы.
• Динамическое включение fieldset.
• Определение обязательных полей формы.
• Использование ARIA для динамических обновлений.
• Локальное хранилище.
• Кэширование приложений.
• Перетаскивание.
• Рабочие процессы.
• Веб-сокеты.
• История.
• Локальные файлы.
Урок 6. Кроссбраузерные свойства CSS3. • Введение в CSS3.
• Border-radius.Text-shadow.
• Box-shadow.
• Background-origin.Background-size.
• Одновременное использование нескольких фоновых изображений.
• Parallax.
• Opacity.
• RGBA.
• Практический пример с применением пройденных на уроке свойств.
Урок 7. Переходы в CSS. Градиенты в CSS3. Улучшенние форм. • Временные функции.
• Задержка перехода.
• Краткая форма записи.
• Краткая форма записи перехода с задержкой.
• Поддержка в браузерах.
• Полная запись перехода.
• Состояния перехода.
• Переход нескольких свойств.
• Переход всех возможных состояний.
• К каким свойствам применимы переходы.
• Простой пример переходов с помощью CSS3.
• Градиенты.
• Разметка для простой формы регистрации.
• Стили для полей и подписей.
• О CSS3-селекторах.
• Оформление полей ввода.
• Пример формы с помощью CSS3.
Урок 8. Преобразование содержимого и добавление CSS-анимаций. • Масштабирование.
• Поворот.
• Кручение.
• Сдвиг.
• Ключевые кадры.
• Ссылки на keyframe.
• Повторное использование анимации в состоянии hover.
• Практический пример «Создание галереи изображений с помощью HTML5 и CSS3».
Урок 9. Работа с границами, текстом, шрифтом. Полезные псевдо-классы. • Свойство word-wrap.
• Свойство text-overflow.
• Свойство word-wrap.
• Свойство @font-face.
• Работа с границами.
• Использование условных комментариев.
• Добавление авторского стиля.
• Полезные псевдо-классы.
Урок 10. Адаптивный дизайн. • Введение в адаптивный дизайн.
• Fluid grid. Fluid images.
• Media queries.
• CSS Regions.Mobile first.
