Курс предназначен для широкого круга Web-разработчиков, желающих углубить свои знания и освоить на практике новые возможности, предоставляемые HTML5 и CSS3.
Предварительный уровень подготовки: навыки браузерной верстки, а так же базовые знания HTML, CSS и JavaScript.
Программа курса
HTML5: платформа и спецификация
Краткая история HTML. Новая идеология HTML5. Отличия HTML5 от HTML4.01 и XHTML1.x. Новые теги и атрибуты. Устаревшие теги.
Новые семантические элементы HTML5.Основная структура документа. Смысл появления новых элементов и примеры использования. Поддержка новых тегов в устаревших браузерах.
Новые возможности для создания форм. Новыетипывводаданных: search, email, url, tel, range, number, datetime и др. Новые атрибуты полей ввода: autofocus, placeholder, reqired, autocpmlete идр.Валидация данных форм на стороне клиента. Обратная совместимость с устаревшими браузерами.
Основы верстки. Блоки — основная экранная единица. Строчные и блочные боксы. Поток и расположение элементов. Позиционирование: абсолютное и относительное. Схлопывание границ (margin collapsing). Выступ за границы родительского элемента. Верска плавающими (float) блоками. Очистка float. Приоритет селекторов CSS (специфичность).
Совершенствование пользовательских интерфейсов средствами CSS3
Что такое CSS3? Что нового в CSS3? Преимущества CSS3.
Стилевое оформление таблиц с использованием псевдоклассов. Чередование цвета строк (:nth-of-type). Выравнивание текста столбцов (:nth-child). Выделение последней строки (:last-child). Поиск в обратном направлении (:nth-last-child). Печать ссылок (:after). Создание многостолбцовых макетов. Построение мобильных интерфейсов. Роли ARIA и упрощение навигации. Создание обновляемых областей с улучшенной доступностью.
Графика и звук
Рисование логотипа. Построение диаграмм средствами RGraph. Внедрение видео и аудио. Визуальные эффекты. Закругление прямых углов. Тени, градиенты и преобразования. Использование шрифтов.
За пределами HTML5
Работа с данными на стороне клиента. Сохранение настроек с использованием localStorage. Хранение информации в реляционной базе данныхна стороне клиента. Взаимодействие с другими API. Передача информации между доменами. Чат на базе Web Sockets.
API геолакации. Определение своего местоположения. Интеграция с Google Maps.
Встроенная поддержка перетаскивания. API перетаскивания. События перетаскивания. Перетаскивание файлов.
Файловый API. Считывание информации с файла. Контроль процесса загрузки файлов.
Взаимодействие с Web-сервером. Опрос посредством серверных событий. Web-сокеты. Событие onMessage.