[Udemy] Познавая вёрстку: HTML, CSS и кое что ещё (2018)

Описание

Автор: Udemy
Название: Познавая вёрстку: HTML, CSS и кое что ещё (2018)

Описание:

Чему вы научитесь

Как от дизайна или идеи прийти к верной структуре кода
Как правильную структуру наполнить верными тегами
Как верным тегам написать правильные стили
Как писать стили удобно и быстро
Как писать стили с учётом адаптивности и кроссбраузерности
Как организовать файлы проекта
Как все знания связать вместе и использовать в работе
Требования
Нет

Описание

Курс создан на основе нескольких десятков онлайн групп по обучению на тему веб вёрстки.
Финальный результат: ясное понимание и уверенность в вёрстке. Это фундамент, на котором может строиться дальнейший путь в области веб-разработки.
В 30-е годы прошлого столетия исследователь Альфред Коржибски сказал: ценно не само знание, ценно — структура знания.
Этот курс — попытка дать вам структуру знания html вёрстки. Не просто сказать о том, что куда писать, а объяснить, почему это писать именно сюда или сюда.
Этот курс — попытка разбить умение вёрстки на совокупность мелких навыков и дать вам возможность их изучить и оттренировать.
Этот курс — попытка дать вам шаг, который вы можете пройти. Пройти и двигаться дальше, не оборачиваясь.
Вам решать, на сколько у меня получилось

Для кого этот курс?

Кто решился начать познавать веб разработку
Кто не до конца понял, что такоё веб вёрстка
– Что входит в курс?
18 часов видео

88 лекций – 17:54:47
Введение – 51:34
О чём этот курс – 08:29
Советы по обучению – 07:41
Что такое страница сайта – 03:42
Что такое тег – 11:45
Анатомия тега – 05:37
Страница изнутри – 14:20
– Верстка бегло на примере очень простой страницы – 28:34

Списки – 09:20
Инструменты разработчика – 02:15
Особенности поведения некоторых тегов – 03:02
Как привязать стили к странице – 06:47
Как писать стили – 07:10
– Фундамент вёрстки – 01:48:59

Структура html страницы – 12:00
Разбиение страницы на блоки – 22:22
Разбиение блоков на элементы – 12:34
Группировка элементов – 10:26
Советы по решению заданий – 08:09
Задание 1 – 01:02
Задание 1 – решение – 12:12
От разбиения к верстке условным тегом – 11:01
Даём названия классам правильно – 19:13
– Применяем знания к тестовому проекту – 01:03:13

Несколько популярных тегов – 26:07
Меняем условный тег на нужный – 07:18
Выпадающие спики – 06:40
Таблицы – 10:04
Задание 2 – 01:54
Задание 2 – разбор – 03:58
Обзор пройденного – 07:12
– Основы стилей CSS – 03:00:34

Правильное подключение стилей – 06:23
Верстка макета для примера – 05:24
Что такое CSS селекторы – 16:18
Приоритет селекторов – 15:18
Шпаргалка по стилям в виде mindmap – 17:07
Отступы – 11:49
Блоковая модель box model – 28:04
Техника pixel perfect – 16:48
Шрифты – 14:55
Позиционирование элементов – 26:37
Задание 3 – 00:45
Задание 3 – разбор – 08:02
Обзор пройденного – 13:04
– Продвинутые техники – 47:00

Препроцессоры и что это такое – 11:07
Препроцессор scss и visual studio code – 12:53
Методология на примере RSCSS – 19:28
Понятие контекста – 03:32
– Создаем шапку тестового проекта – 01:44:21

Верстка шапки – 18:50
Подключение шрифтов – 11:34
Стили для шапки – способ 1 – 14:49
Нормализация – 03:05
Стили для шапки – способ 2, на флексбоксах – 23:08
Добавляем кнопки соц сетей – 06:06
Пытаемся сделать pixel perfect для шапки – 13:06
Цвета как переменные – 13:43
– Верстаем календари – 02:21:53

Ограничиваем максимальную ширину сайта – создаём контейнер – 15:05
Снова про выпадающие списки – 10:27
Аналог функций в SASS – 20:09
Приближаем календарь к pixel perfect – 16:39
Ещё раз про таблицы (ньюансы) – 16:52
Что такое псевдоклассы – 15:18
Иконочные шрифты – 26:35
Задание 4 – 06:26
Задание 4 – разбор – 14:22
– Адаптивность и кроссбраузерность – 01:01:30

Введение в адаптивность – 14:23
Выравнивание календарей – 14:10
SASS и миксины – 04:41
Префиксы для старых версий браузеров – 06:25
Media запросы – 16:01
Пару слов о bootstrap – 05:50
– Решаем популярные задачи – 03:34:55

Стиль кодирования – 04:23
Изображение в виде фона на всю ширину – 18:09
Элементы формы – 14:26
Методы отправки формы – 07:21
Снова формы: fieldset и radio – 12:05
Меняем стили для формы – 13:41
О свойстве box-sizing – 08:55
Варианты в методологии RSCSS – 07:03
Варианты задания размеров – 13:43
Анимация – 22:31
Структура папок проекта – 04:58
Ещё о кроссбраузерности – 19:39
Оптимизация – 11:42
Внезапно: баг в проекте – 16:45
Комментарии в коде – 05:46
Организация кода в разных файлах – 10:06
HTML5 – 23:42
– Нюансы, о которых надо знать – 01:12:14

Бойцы невидимого фронта: мета теги – 24:18
Ещё одни возможности для адаптивности: мета тег viewport – 15:16
Последний штрих: фавикон – 10:11
Бонус: навыки верстки – 22:29