Если ты думаешь, что знаешь, что такое удобная вёрстка — просто посмотри видео:
Программа курса
Вводный вебинар
- Техническая информация
- Доступы в группы и к тренажёрам
- Обзор программы курса
- Обзор вспомогательных инструментов
Урок #1
- Основы Flexbox
- Основная и вспомогательная оси
- Тонкости выравнивания элементов
- Адаптивка без media-запросов
- Расчёт размеров элемента
- Разбор домашних работ
- Фокусы flex-grow
- Нюансы в IE 11
- Погрешность расчёта размеров
- Код без media-запросов: за и против
Урок #2
- Flex-direction: column
- Нюансы переноса элементов
- Вертикальные и горизонтальные отступы
- Смена порядка следования элементов
- Задачи, для которых flex неудобен
- Разбор домашних работ
- Общие выводы по технологиям
- Необходимость автоматизации мелочей
- Моральная подготовка к node.js
Урок #3
- Node.js и NPM — основы магии
- Gulp — сборка проекта
- Autoprefixer — кроссбраузерность
- Concat — соединение файлов
- Sourcemaps — удобная отладка
- Разбор домашних работ
- Плагин Clean CSS
- Group CSS Media Queries
- Неудобства плагина concat
- Чего не хватает в чистом CSS
Урок #4
- Основы CSS-препроцессоров
- Иерархическое написание
- Переменные и примеси
- Написание кода на LESS
- Написание кода на SASS (SCSS)
- Разбор домашних работ
- Синтаксисы разных препроцессоров
- LESS vs SCSS
- Препроцессоры vs постпроцессоры
Урок #5
- npm i smart-grid — поехали!
- Основы создания сетки
- Отступы в px или в %
- Margin и padding варианты
- Настройка свойств сетки
- Разбор домашних работ
- Нюансы fields и offset
- Резиновые и обычные элементы
- Row и col без size
Урок #6
- Вёрстка макета
- Оптимизация кода
- Иерархия селекторов vs BEM
- Дополнительные приёмы вёрстки
- Кроссбраузерность
- Разбор домашних работ
- Подведение итогов курса
- Ответы на финальные вопросы
- Направление дальнейшего развития
