Профессия верстальщика
О чём курс
Вам нужен готовый сайт, который корректно отображается в любом браузере и на любом мобильном устройстве — именно этот навык здесь разбирают от архитектуры веб-страницы до финальной сборки. Вы научитесь превращать макеты из Photoshop в полноценный код, используя современную блочную верстку, семантические теги HTML5 и стили CSS3. Внутри курса подробно разбирается, как работать с модульными сетками, оптимизировать верстку для ускорения загрузки и внедрять динамические элементы вроде слайдеров или галерей. Материал подойдет тем, кто хочет освоить базу веб-разработки и понять процесс создания сайтов с нуля до публикации.
Программа обучения
- Урок 1. Основные понятия в веб-разработке
- Как работает интернет, Что такое сайт, Что представляет собой веб-страница, Виды сайтов, Процесс разработки сайта, Что такое гипертекст, теги и атрибуты, Подготовка рабочего места, Простой пример HTML странички, Пример сложной веб-страницы, Горячие клавиши для перемещения по документам
- Урок 2. Основы языка разметки документов HTML
- Структура HTML документа, Основные теги оформления текста, Спецсимволы, Комментарии в HTML, Гиперссылки, Типы изображений для web, Загрузка изображений на страницу, Списки, Формы и их элементы. Создание таблиц, Объединение ячеек, Вложенные таблицы, Стилевое оформление таблиц
- Урок 3. Основы языка оформления стилей документа CSS
- Что такое CSS, Синтаксис CSS, Способы объявления CSS, Селекторы (id, class, tag), Селекторы атрибутов, Основные свойства стилей, Вложенность, наследование и группирование свойств, Приоритеты применения стилей, Псевдоклассы и псевдоэлементы
- Урок 4. Верстка слоями (блочная верстка) - часть 1
- Основные теги для верстки (div и span), Отступы элементов (margin и padding), Обтекаемые элементы, Позиционирование блоков, Создание структуры страницы с помощью блоков, Создание меню на основе блочной модели
- Урок 5. Верстка слоями (блочная верстка) - часть 2
- Создание основной разметки сайта, Применение overflow и clear в реальной вёрстке, Заполнение разметки частями макета, Приёмы позиционирования элементов, Использование модульной сетки в структуре макета, Резиновая и адаптивная верстка для мобильных устройств
- Урок 6. Работа с макетом дизайна в формате PSD
- Основные функции программы Photoshop, Выделение основных частей макета, Нарезка макета, Верстка макета сайта при помощи модульной сетки
- Урок 7. Стандарты web и вспомогательные инструменты
- Проблема «кроссбраузерности», Стандарты HTML/CSS, Валидация страниц, Будущее за стандартами HTML5 и CSS3, Грамотная, универсальная верстка, Файловая система проекта, Знакомство с фреймворком Twitter Bootstrap
- Бонус 1. Организация работы
- Способы ведения проекта и взаимодействие верстальщика с командой. Как подходить к поиску работы. Подготовка портфолио и составление резюме. Знакомимся с работой на фриланс биржах.
- Бонус 2. Продвинутый CSS
- Углубляемся в CSS. Селекторы атрибутов, псевдоселекторы, позиционирование. Возможности и спецэффекты CSS3: Переходы и анимация, Трансформация объектов, Тени, Градиенты.
- Бонус 3. Новые HTML5 теги и ускорение работы
- Знакомимся с HTML5 тегами для семантической разметки страницы. Внедряем инструменты для ускорения верстки. Оптимизируем рабочий процесс так чтобы максимально ускорить процесс верстки. Ускорение вашей работы до 50%.
- Бонус 4. Оптимизация верстки, спрайты, шрифты. Динамические элементы
- Создание спрайтов изображений, подключение дополнительных шрифтов. Знакомимся с динамическими элементы: Слайдер, Модальные окна, Вкладки, Лайтбокс, Галерея изображений.
Отзывов пока нет. Будьте первым!
Этот курс сейчас в процессе организации складчины. Нажмите кнопку «Записаться» и ожидайте старта — вам придёт уведомление. Когда складчина стартует, в карточке курса будет указан актуальный взнос. Текущая цена пока в процессе формирования и может отличаться от финальной.
Да, мы стремимся, чтобы финальный взнос был не больше ≈10% от оригинальной цены курса. Чем больше участников записывается в складчину, тем ниже выходит взнос для каждого.
Нажмите кнопку «Записаться» и авторизуйтесь на сайте через email (через ту же почту, которую будете использовать для входа). В личном кабинете вас будут ждать инструкции, как пригласить других участников — чем больше людей записалось, тем быстрее стартует складчина и тем ниже взнос. Как только складчина готова к приобретению, вам придёт уведомление.