[Типичный верстальщик] Базовый курс для верстальщиков 2018-2019 (Анна Блок)

Стартовая лекция.
- Разбор основ программы Adobe Photoshop;
- Работа с изображениями;

Начало работы. Основы HTML
- Подготовка проекта к верстке;
- Структура html-документа (html, head, body) ;
- Обзор популярных тегов HTML;
- Обзор семантических тегов HTML.

Основы HTML
- Идентификаторы и классы;
- Aтрибуты для input и textarea;
- Отличия между button и a;
- Ссылки для социальных сетей;
- Работа с почтой и скайпом;
- Работа с git.

Подключение CSS, работа с текстом
- Подключение CSS к документу HTML;
- Структура CSS-файлов;
- Способы подключения шрифтов на страницу;
- Форматирование текста при помощи CSS;
- Стили для работы со шрифтами;
- Разные типы записи цвета в CSS документе;

Размещение объектов CSS
- Селекторы, которые стоит знать и применять;
- Типы позиционирования элементов;
- Установка favicon на страницу.

Стилизация элементов CSS
- Стилизация ссылок и кнопок;
- Работа со списками;
- Работа с after и before;

Виды сеток CSS
- Центрирование объектов в документе;
- Отступы padding и margin;
- Flexbox CSS;
- CSS Grid;

Фон и изображения CSS
- Цвет фона;
- Загрузка изображения через CSS;
- Повтор изображения;
- Создание градиента в CSS;
- Фильтры в CSS.

Рамки и обводки CSS
- Создание рамок CSS;
- Создание радиусов CSS;
- Создание теней;
- Создание внешних рамок CSS;

Оживляем сайт с CSS
- Переходы в CSS;
- Трансформации в CSS;
- Создание анимаций при помощи CSS3

Адаптивность CSS
- Проверка HTML и CSS на валидность;
- Медиа-запросы;
- Основные правила создания адаптивного сайта;
- Отличия резиновой верстки от адаптивной.

Векторные изображения
- Сохранение SVG-изображений в Illustrator;
- Создание SVG через теги;
- Base64;
- Cоздание паттернов SVG.

Верстка email-писем
- Правилам верстки email;
- Создание на примере;
- Сервисы, для выгрузки своего шаблона;
- Кроссбраузерная верстка.

Основы jQuery
- Библиотеки JavaScript;
- Добавление библиотеки jQuery на страницу;
- Основные селекторы;
- Фильтры jQuery;
- Отобразить и спрятать объект с jQuery.

Основы jQuery
- Обзор плагина jQuery UI;
- События наведения и смещения указателя мыши;
- Распространенные задачи, решаемые с помощью jQuery.

Популярные плагины для работы
- Слайдеры;
- Галерея изображений.

CSS-препроцессоры
- Подробный обзор SASS;
- Краткий обзор LESS;
- Краткий обзор Stylus;
- Какой препроцессор выбрать для работы?

Создание сайта на бесплатном хостинге Github
- Краткое описание систем контроля версий. Для чего они нужны?
- Регистрация на сайте Github;
- Создание репозитория;
- Наполнение репозитория файлами.

CSS-фреймворки
- Что такое CSS-фреймворки?
- Какие CSS-фреймворки существуют на сегодняшний день?
- Bootstrap: какую версию выбрать?
- Обзор элементов Bootstrap.

Актуальные темы.
- Как найти свой первый заказ или устроиться на работу, если ты новичок;
- Выясним, что лучше подойдет именно тебе: офис, удаленная работа или фриланс;
- Самоорганизация и работа в команде: рассмотрим популярные сайты и приложения по управлению проектами;
- Список актуальных фриланс-бирж.