{EPIC SKILLS} HTML5 + CSS3: Мы научим собирать сайты с нуля!

HTML5 + CSS3: Мы научим собирать сайты с нуля!​

Вы сможете верстать страницы практически любой сложности, узнаете, как работать с чужим кодом и правильно публиковать сайты в сети, соберете портфолио из 2-3 сайтов и выполните больше 200 учебных заданий, получите фирменную кружку, стикеры и дипломчик в рамочке.

Спойлер: Что вы сможете сделать после курса?

Что вы сможете сделать после курса?​

Создавать статические сайты средней сложности

Похвастаться отличным портфолио в интернете

Найти работу или стажировку, если не ленились

Чтобы начать специальных навыков и знаний не требуется, достаточно уметь пользоваться интернетом и быстро печатать. И перестаньте читать книжки, они все равно устаревают по дороге из магазина. Учитесь у практиков!

Спойлер: Чему мы научим на курсе?

Чему мы научим на курсе?​

Верстать страницы Даже адаптивные! Вот, например, как эта

Организации работы И какие инструменты понадобятся вам в работе

Чувствовать разницуМежду хорошей версткой и работой дилетанта

Загадочной кроссбраузерности И почему все так не любят Internet Explorer

Быстро создавать рабочие прототипы На основе популярного фреймворка Bootstrap 3

Прикручивать спецэффекты А также анимации и трансформации. И не забудем об основах jQuery

Спойлер: Программа

Программа​

День 1 Вводное занятие: основы HTML

Что делаем: Изучаем грамматику, основные теги HTML

Чему научим: Принципы работы браузеров и различиях между ними. Семантические теги HTML5. Инструменты: редактор кода, инспектор. Emmet — ускоряемся.

Что сделаем: Разметку

День 2 Основы CSS, таблицы стилей

Что делаем: Изучаем грамматику CSS, селекторы.

Чему научим: Правила написания CSS. Правильное именование классов. Наследование, каскадность, приоритеты. Структура проекта (index.html и style.css). Как подключать стили (локально).

Что сделаем: Разметку и стили 1-2 страниц рабочего макета.

День 3 Блочная модель и выравнивание

Что делаем: Практикуем блочную модель, виды display.

Чему научим: Отступы margin/padding. Математика: учимся измерять ширину, высоту, отступы и границы у элементов. Вертикальное/горизонтальное выравнивание.

Что сделаем: Доделываем страницы рабочего макета.

День 4 Простые и модульные сетки

Что делаем: Изучаем структуру, каркас сайта.

Чему научим: Создание колонок (inline-block, float) Распорки/сбросы (overflow, clear, clearfix)

Что сделаем: Много сеток

День 5 Фотошоп, подключение шрифтов, спрайты

Что делаем: Изучаем Фотошоп для верстальщика.

Чему научим: Веб-безопасные шрифты, их подключение. Иконочные шрифты. Спрайты и ресурсы для их построения. Настраиваем фотошоп. Учимся нарезать/экспортировать картинки/фоны, узнавать размеры, цвета, шрифты. Подключаем шрифт с гугл/веб фонта, иконочные шрифты. Строим спрайты.

Что сделаем: Настроим рабочее окружение для быстрой работы.

День 6 Хелп-дэй + файловая система

Что делаем: Готовимся к сдаче финального проекта.

Чему научим: Файловая система: что такое, как подключаться и пользоваться. Критерии для сдачи проекта.

Что сделаем: Проверка рабочих проектов.

День 7 Формы и списки, тени и градиенты, таблицы.

Что делаем: Погружаемся в изучение оформления элементов.

Чему научим: Элементы форм, списки. Тени и градиенты. Генераторы теней и градиентов. Таблицы.

Что сделаем: Разментку финального проекта

День 8 Позиционирование и псевдоэлементы.

Что делаем: Изучаем позиционирование элементов, виды position.

Чему научим: Применение позиционирования. Псевдоэлементы before, after. Распорка clearfix.

Что сделаем: Треки позиционирование и псевдоэлементы.

День 9 Адаптивная верстка, основы bootstrap.

Что делаем: Изучаем медиазапросы, сетку бутстрапа — делаем по ним треки.

Чему научим: Медиазапросы, работа с адаптивными изображениями. Использование Twitter Bootstrap.

Что сделаем: Треки по адаптивности и бутстрапу.

День 10 Анимации и трансформации, основы jQuery

Что делаем: Делаем задания из трека по анимациям и трансформациям. Тренируемся в песочнице jQuery

Чему научим: Основы jQuery. Плагины jQuery (слайдеры, табы).

Что сделаем: Оживляем в финальном макете слайдер.

День 11 Бонусное: проверка финального проекта

Что делаем: Проверка и сдача финального проекта

Чему научим: Критерии для сдачи и оценки качества верстки.

Что сделаем: Финальный макет.