Расширенные возможности вёрстки веб-страниц
Изучение продвинутых инструментов для вёрстки веб-страницКурс рекомендован веб-мастерам, верстальщикам, веб-дизайнерам, контент-менеджерам, владеющим основами HTML-вёрстки и желающим повысить свой профессиональный уровень
Вёрстка веб-страницы с применением современных технологий HTML5 и CSS3: трансформация, анимация, градиенты, модульные сетки
Разработка адаптивного дизайна. Создание мобильной версии страницы и версии для печати
Использование препроцессоров в написании кода
Продолжительность обучения: 18 академических часов
Дополнительно: 10 учебных часов самостоятельной работы — бесплатно!
Для эффективной работы html-верстальщика, контент-менеджера, веб-мастера сегодня требуется не только уметь писать валидный код на HTML и CSS, но и владеть инструментами быстрой и удобной вёрстки.
На курсе «Расширенные возможности вёрстки веб-страниц» вы можете повысить свой профессиональный уровень, изучив принципы вёрстки веб-страниц с использованием grid layout, возможности создания анимации на CSS, «прокачать» навыки работы с веб-шрифтами и градиентным фоном. Также вы узнаете, как оптимизировать и ускорить свою работу при помощи препроцессоров.
Основное внимание на курсе уделяется вопросам создания адаптивного дизайна страниц. Слушатели знакомятся с концепцией вёрстки «mobile first» и учатся создавать медиа-запросы для различных устройств. В течение курса выполняются практические уроки-упражнения, каждый из которых является завершенным проектом.
Продолжительность курса является достаточной для того, чтобы улучшить ваши навыки HTML-верстки и повысить конкурентоспособность на рынке труда. Вы можете углубить свою подготовку, воспользовавшись дополнительным бесплатным временем для самостоятельной работы в объеме до 10 учебных часов.
Для успешного освоения программы курса необходимо иметь базовые навыки работы с языками HTML5 и CSS3. Получить необходимые знания можно на наших курсах HTML5 и CSS3 для создания сайтов, или самостоятельно.
Продолжительность курса при занятиях в группе составляет 18 учебных часов (1 учебный час равен 45 минутам). Кроме этого, каждый слушатель получает 10 часов бесплатного самостоятельного обучения в наших классах с использованием учебно-методических материалов Центра.
Возможно обучение в вечерних (с 17.40 до 20.20) группах. Занятия проводятся 3 раза в неделю, конкретный график занятий определяется с учетом пожеланий слушателей на первом занятии. Время самостоятельной подготовки подбирается с учетом возможностей клиентов. Продолжительность курса составляет 2 недели.
При индивидуальном обучении продолжительность курса составляет 15 учебных часов. Время занятий назначается с учетом пожеланий слушателя.
Также данный курс можно прослушать в нашем Центре в формате вебинара. Для уточнения деталей такого обучения, пожалуйста, свяжитесь с нами любым удобным Вам образом.
Стоимость обучения и запись на курсы
Стоимость курса, при занятиях в группе составляет 4400 рублей. Осуществлять предоплату не требуется, более того, вы имеете право бесплатно посетить первое занятие (3–4 учебных часа) и уже после этого принять решение о продолжении обучения и оплате занятий.
При индивидуальном обучении стоимость курса составляет до 7200 рублей.
Документ, подтверждающий прохождение курсов
По окончании обучения и после сдачи практических зачетов вы получите Сертификат по курсу Расширенные возможности вёрстки веб-страниц.
Тема 1. Работа с веб-шрифтами
Использование собственных веб-шрифтов на сайте. Типы файлов шрифтов. Правовые вопросы использования веб-шрифтов. Поиск веб-шрифтов. Создание нескольких форматов шрифтов. Способы подключения веб-шрифтов при помощи директивы @font-face. Обеспечение совместимости со старыми версиями браузера Internet Explorer.
Тема 2. Осуществление преобразований, переходов и анимации с помощью CSS
Преобразования. Вращение. Масштабирование. Перемещение. Наклон. Множественные преобразования. Исходная точка.
Переходы. Добавление перехода. Распределение скорости выполнения перехода по времени. Задержка начала перехода. Краткая запись свойства transition. .
Анимация. Определение ключевых кадров. Применение анимации. Распределение скорости выполнения анимации по времени. Завершение анимации. Краткая запись свойства animation.
Тема 3. Использование градиентных фонов
Разработка собственного градиентного фона. Линейные градиенты. Цветовые опорные точки. Префиксы производителей и поддержка Internet Explorer. Повторяющиеся линейные градиенты. Радиальные градиенты. Повторяющиеся радиальные градиенты.
Тема 4. Адаптивный дизайн
Макетные сетки. Верстка страницы с применением grid layout
Вёрстка страницы и разработка стилей под разные устройства. Концепция «Mobile First». Медиа-запросы. Адаптивные изображения.
Создание аппаратно-зависимых таблиц стилей. CSS для печати.
Тема 5. Основы использования препроцессоров в написании кода
Создание хорошо структурированной разметки с помощью препроцессора Haml. Объявление , создание тегов и атрибутов в Haml. Классы и идентификаторы в теге div. Написание комментариев и «тихих» комментариев. Преобразование файлов *.haml в *.html.
Упрощение написания CSS-кода при помощи препроцессора Sass. Синтаксис Sass. Создание селекторов. Создание вложенных селекторов. Вложенные свойства. Преобразование файлов *.sass в *.css.
Установка CSS-свойств при помощи переменных в препроцессоре Sass. Интерполяция переменных. Вычисления. Преобразование шестнадцатиричного значения цвета в RGBa средствами препроцессора. Операции с цветом.
Некоторые примеры работ, выполняемых в ходе изучения курса
