ЕЩЁ БОЛЬШЕ ИНФОТОВАРОВ И ОНЛАЙН КУРСОВ ПО ФИКСИРОВАННОЙ ЦЕНЕ 30 РУБ МОЖНО НАЙТИ ТУТ - https://po30.ru/
Кому полезен этот курс:
- Новичкам. Хочешь научиться самой востребованной интернет профессии? Обязательно приходи к нам.
- Бэкендерам. Давно уже работаешь с серверной частью проектов, но хочешь научиться менять визуал сайтов? Тебе к нам!
- Веб-дизайнерам. Давно рисуешь сайты, но хотел бы сам научиться верстать? Посети курс и на практике узнаешь как создаются сайты.
- Маркетологам. Не хватает основ веб-разработки для продвижения сайтов? Мы поможем восполнить этот пробел.
- SMMщикам. Работа SMM, как правило, неразрывна с поддержкой сайтов. Самое время изучить основы веб-разработки.
- Предпринимателям. Сложно представить современный бизнес без сайта. Освой азы, чтобы общаться с разработчиками на одном языке.
Во время обучения мы верстаем сайт, который так или иначе будет связан с темами курса. Будет интересно!
По окончанию курса у Вас будет две сверстанные странички, которые будут храниться в личном профиле GitHub. Первая страничка — это вёрстка по учебному макету, вторая — по самостоятельно выбранному макету для закрепления всего материала.
Программа обучения:
- Стартовая лекция:
— Разбор основ программы 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.
Домашнее задание.
- Актуальные темы:
— Как найти свой первый заказ или устроиться на работу, если ты новичок;
— Выясним, что лучше подойдет именно тебе: офис, удаленная работа или фриланс;
— Самоорганизация и работа в команде: рассмотрим популярные сайты и приложения по управлению проектами;
— Список актуальных фриланс-бирж.