1. HTML и CSS
- Общие понятия о браузерах. Структура HTML-документа. Структура сайта. Метагеги, их назначение и применение.
- HTML. История, версии, теги ссылок, текста, списков, блоков.
- HTML. Использование цветов. RGB и CMYK. Изображения.
- Формы.
- Таблицы. Табличная верстка.
- HTML. Теги обьектов, карты изображений, разметки, специфические. Вставка flash в html.
- HTML 5 — знакомство. Canvas.
- HTML. Фреймы. Верстка с использованием фреймов. Применение фреймов.
- CSS. Каскадные таблицы стилей и их применение. Подключение. Селекторы. Классы. Идентификаторы. Стили ссылок, текста.
- CSS. Стили списков, таблиц, изображений, позиционирования, границ. Особенности использования шрифтов
- CSS. Трюки и эффекты с использованием css. Css Css и различные браузеры. Фон и градиенты.
- CSS. Вертикальное позиционирование в блоках. Интерполяция изображений в IE. Проблема IE PNG. Прозрачность
- CSS. Браузерные особенности. Создание выпадающего списка на CSS. Подсвечивание ссылок.
2. Javascript в HTML
- Теги script и noscript
- Способы подключение Javascript на HTML странице
- Отложенная и асинхронная загрузка скриптов с defer, async
3. Основы Javascript
- Синтаксис
- Переменные и имена переменных
- Объявление и область видимости переменной
- Типы данных
- Основные операторы
- Условные операторы и тернарный оператор
- Операторы сравнения и логические операторы
- Побитовые операторы
- Циклы
- Директивы continue и break. Метки
- Инструкции switch, with
- Функции, аргументы функций, инструкция return
- Strict Mode
4. Программирование на JavaScript
- Javascript. История. Особенности языка. Для чего нужен javascript и что на нем можно сделать.
- Javascript. Использование переменных и массивов. Составление выражений.
- Javascript. Управление ходом выполнения программы. Работа с функциями.
- Функции setInterval и setTimeout. Управление временем.
- Обработка событий
- Использование объектов. Работа с окнами. Работа со строками.
- Работа с форматами дат и времени.
- Работа с объектом MATH
- Работа с формами
- Работа с фреймами
- Определение свойств Web-среды пользователя. Использование COOKIE.
- Отладка ошибок в Javascript. Наиболее распространенные ошибки.
- Объект Canvas, создание динамических изображений
5. Объектная модель документа (DOM)
- Объект Document
- Элементы DOM: их свойства и методы
- Дерево DOM. Узел DOM
- Родительско-дочерние отношения узлов
- Свойства узлов
- Атрибуты и «свои» свойства
- Поиск элементов
- Selectors API
- Модификация элементов
- Добавление содержимого в документ
- Удаление узлов
- Мультивставка с insertAdjacentHTML и createDocumentFragment
- Метод document.write
6. Фреймворк Jquery
- Что такое фреймворк Jquery и для чего его использовать. Селекторы, фильтры, выборки Jquery.
- Атрибуты тегов. Цепные функции. Доступ к свойствам CSS. Функция Html.
- Анонимные функции. $this
- Управление событиями. Методы продвинутого управления событиями.
- Эффект смены изображений. Эффекты и анимация Jquery. Прозрачность.
- Фотогалерея на jquery
- Плагины Jquery: Corner, Table-dnd, Tabs, Tablesorter, Draggable, Dropable и др.
- Jquery и формы. Верификация форм. Плагин jquery Validation
- Меню аккордеон. Вкладки tabbed panels
- Jquery. Диагностика скриптов и отладка. Безопасность скриптов и XSS
7. Формы. Встроенное аудио и видео
- Поле ввода контактной информации.
- Использование полей ввода даты и времени.
- Численный ввод.
- Отображение поискового поля ввода.
- Выбор значения из числового диапазона.
- Создание редактируемого раскрывающегося списка.
- Обязательные поля формы.
- Автофокусировка на поле формы.
- Отображение замещающего текста.
- Отключение автозаполнения.
- Ограничение значений.
- Создание простой формы.
- Добавление НТML5-аудио и управление аудиопотоком.
- Создание аудиопроигрывателя.
- Добавление НТМL5-видео.
- Кроссбраузерная поддержка видео и настройка видеоразрешения.
- Цикличное воспроизведение видео.
8. Микроданные и пользовательские данные. Геолокация
- Добавление в разметку микроданных.
- Использование микроданных.
- Добавление в разметку пользовательских данных.
- Доступ к пользовательским данным с помощью JavaScript.
- Управление пользовательскими данными.
- Создание приложения для карты с помощью пользовательских данных.
- Получение основных геолокационных данных.
- Альтернативный способ получения основных геолокационных данных.
- Получение адреса путем обратного геокодирования широты и долготы.
- Преобразование адреса в широту и долготу.
- Drag and drop
- Progress bar
9. Элемент Canvas
- Рисование на элементе canvas.
- Использование эффекта прозрачности.
- Установка размеров «холста».
- Использование градиентов, узоров и стилей линий.
- Добавление на «холст» внешних изображений.
- Настройка цветовых преобразований.
- Использование геометрических преобразований.
- Добавление на «холст» текста.
- Обрезка рисунков на «холсте».
- Добавление эффекта анимации к рисункам на «холсте».
- Рисование графиков на «холсте».
- Сохранение рисунка с «холста» в файле.
10. Элементы доступа и расширенные возможности JavaScript в HTML5
- Создание текстового описания рисунка.
- Определение аббревиатур и сокращений.
- Определение разделов страницы с помощью ключевых ролей ARIA.
- Создание доступных навигационных ссылок.
- Связывание полей формы с метками.
- Логическая группировка полей формы.
- Динамическое включение fieldset.
- Определение обязательных полей формы.
- Использование ARIA для динамических обновлений.
- Локальное хранилище.
- Кэширование приложений.
- Перетаскивание.
- Рабочие процессы.
- Веб-сокеты.
- История.
- Локальные файлы.
11. Кроссбраузерные свойства CSS3
- Введение в CSS3.
- Border-radius.
- Text-shadow.
- Box-shadow.
- Background-origin.
- Background-size.
- Одновременное использование нескольких фоновых изображений.
- Parallax.
- Opacity.
- RGBA.
- Практический пример с применением пройденных на уроке свойств.
12. Переходы в CSS. Градиенты в CSS3. Улучшенние форм
- Временные функции.
- Задержка перехода.
- Краткая форма записи.
- Краткая форма записи перехода с задержкой.
- Поддержка в браузерах.
- Полная запись перехода.
- Состояния перехода.
- Переход нескольких свойств.
- Переход всех возможных состояний.
- К каким свойствам применимы переходы.
- Простой пример переходов с помощью CSS3.
- Градиенты.
- Разметка для простой формы регистрации.
- Стили для полей и подписей.
- О CSS3-селекторах.
- Оформление полей ввода.
- Пример формы с помощью CSS3.
13. Преобразование содержимого и добавление CSS-анимаций
- Масштабирование.
- Поворот.
- Кручение.
- Сдвиг.
- Ключевые кадры.
- Ссылки на keyframe.
- Повторное использование анимации в состоянии hover.
- Практический пример «Создание галереи изображений с помощью HTML5 и CSS3».
14. Работа с границами, текстом, шрифтом. Полезные псевдо-классы
- Свойство word-wrap.
- Свойство text-overflow.
- Свойство word-wrap.
- Свойство @font-face.
- Работа с границами.
- Использование условных комментариев.
- Добавление авторского стиля.
- Полезные псевдо-классы.
15. Адаптивный дизайн
- Введение в адаптивный дизайн.
- Fluid grid.
- Fluid images.
- Media queries.
- CSS Regions.
- Mobile first.
16. Javascript и HTTP. AJAX
- Введение в AJAX
- Объект XMLHttpRequest
- Особенности в IE
- Форматы данных
- Отправка форм
- Длинные опросы (long polling)
- Использование JSONP
- Jquery и ajax. Функции load(), get(), post(), Форматирование данных
- Базовое программирование AJAX, jMAP
- iFRAME для асинхронных запросов
- Введение в Web Sockets
- Отправка и получение данных с помощью Web Sockets
- Введение в Web Workers
- Выполнение асинхронной обработки с помощью Web Workers
