- Регистрация
- 13.03.2019
- Сообщения
- 48 482
Первый шаг на пути к веб разработке Чему вы научитесь Как от дизайна или идеи прийти к верной структуре кода Как правильную структуру наполнить верными тегами Как верным тегам написать правильные стили Как писать стили удобно и быстро Как писать стили с учётом адаптивности и кроссбраузерности Как организовать файлы проекта Как все знания связать вместе и использовать в работе Требования Нет Описание Курс создан на основе нескольких десятков онлайн групп по обучению на тему веб вёрстки. Финальный результат: ясное понимание и уверенность в вёрстке. Это фундамент, на котором может строиться дальнейший путь в области веб-разработки. В 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 О преподавателе Gleb Chubarenko web-developer Обучаю веб-разработке с 2015 года. Стараюсь совместить проектный подход к обучению Уильяма Килпатрика, идеи Е. Умрюхина и свои собственные наработки в области преподавания и тренировки навыков. Для обучения не важно, что ты умеешь, где работал и что сделал, если ты не можешь передать свои навыки другим. Большинство первоклассных разработчиков не могут. Я не первоклассный разработчик Если всё же кому-то интересна профессиональная биография: Начал в 2010 году как фриланс разработчик. За 4 года сделал 7 крупных проектов и около 100 мелких на cms WordPress. В 2014 году присоединился к команде для работы над проектами компании: 15 сайтов на системах WordPress и Drupal. Поддерживал ряд магазинов на Drupal, где разрабатывал новый функционал, исправлял ошибки и подбирал разработчиков. Сейчас в команде крупного, в своей нише, проекта на щедро переписанной cms wordpress. Соучредитель компании по веб-разработке и онлайн маркетингу. - люблю cms системы: Drupal, WordPress. - конечно знаю html, css, препроцессоры, методологии - частенько пишу на javascript - иногда даже балуюсь React-ом - никуда без PHP - использую git, gulp, composer - проверяю свою работу с помощью codeception - организую трудовые будни внедряя scram, kanban, pomodoro, теорию ограничений 
|
