Акции школ
Войти

Курс «Декоративные эффекты»

Составитель: Денис Сметнёв

box-shadow с десятью слоями, градиент вместо картинки, текст с переливом — всё это CSS-трюки, которые отделяют верстальщика-середнячка от того, кому доверяют визуально сложные проекты. Курс HTML Academy по декоративным эффектам разбирает именно этот пласт: тени, линейные, радиальные и конические градиенты, оформление текста. Бесплатно, без регистрационного взноса. Подойдёт фронтендеру со средним уровнем, который уже знает базу CSS и хочет уверенно брать задачи по UI без Photoshop-вставок.

Подробнее


Компания: HTML Academy (HTML академия)

Язык: ru

Уровень: Средний Старт: в любое время

Актуальная программа курса (8 модулей, по данным школы)

  1. Игра теней
  2. Линейные градиенты
  3. Оформление текста. Погружение
  4. Мастерская: декоративные эффекты
  5. Радиальные градиенты
  6. Радиальные градиенты. Часть 2
  7. Конические градиенты
  8. Мастерская. Градиентная заливка текста

Кем вы сможете работать

Фронтенд-разработчик · UI-инженер

Сколько зарабатывают в профессии (медиана hh.ru, по 117 вакансиям)

Junior
80 000 ₽
Middle
130 000 ₽

Сравнение с похожими курсами других школ

КурсШколаЦенаСрокРейтингДиплом
Декоративные эффекты (этот) HTML Academy (HTML академия) беспл.
Верстка адаптивной css галереи LoftSchool (Лофт скул) беспл. 4.5 Обзор
Основы HTML и CSS Netology (Нетология) беспл. 3 недели 4.5 Перейти
Занимательные элементы интерфейса в HTML/CSS GeekBrains (ГикБреинс) беспл. 3.6 Сертификат Перейти

Стоит ли идти на этот курс

Плюсы

  • Программа покрывает весь градиентный стек современного CSS: linear-gradient, radial-gradient и conic-gradient в одном курсе — редкость даже в платных программах по фронтенду.
  • Модуль «Слайдер на чистом CSS» — прикладная задача, которую реально показывают на техническом интервью; такой разбор внутри бесплатного курса — честный бонус.
  • Цена нулевая: можно проверить уровень подачи HTML Academy без финансового риска и решить, стоит ли продолжать с их платными программами.
  • «Мастерская» как отдельный формат внутри курса предполагает сборку чего-то целого, а не только упражнения на синтаксис — это ближе к реальной задаче верстальщика.

Минусы и кому не стоит

  • Длительность не указана — невозможно спланировать нагрузку заранее; если время ограничено, это неудобно.
  • Нет данных о документе об окончании: если он нужен для резюме или отчётности, рассчитывать на него не стоит.
  • Курс заточен под один узкий пласт CSS — декоративные эффекты. Кто хочет закрыть пробелы в целом по вёрстке или перейти в профессию, одной этой программой не обойдётся.

Когда этот курс вам не нужен

Если вы уже уверенно работаете с многослойными тенями и знаете разницу между radial-gradient и conic-gradient на практике — этот курс повторит то, что вы и так знаете. Не подойдёт и тем, кто хочет системно войти во фронтенд: одни декоративные эффекты профессию не строят. Если цель — сертификат для резюме, данных о документе нет, и рассчитывать на него не стоит.

Как выбрать курс по этому направлению

Курсы по разработке интерфейсов делятся на два типа: те, где вам объясняют, что такое div, и те, где разбирают конкретные инструменты в деле. Если вы выбираете платный курс — смотрите на соотношение теории и практических заданий: хорошая программа даёт задачу раньше, чем объяснение. Проверьте, есть ли в модулях работа с реальными кейсами, а не только синтаксис в песочнице. Для CSS-специфики важно также, насколько актуален стек: конические градиенты и современные свойства текста — это не 2015 год. Документ об окончании и менторская поддержка — смотрите в описании школы отдельно, они влияют на то, как курс ляжет в портфолио.

Частые вопросы

Нужен ли опыт в CSS, чтобы начать?

Курс заявлен как средний уровень, хотя в карточке есть пометка «с нуля». На практике тени и градиенты — не первые темы в CSS. Если вы никогда не писали стили, лучше пройти базовый курс по HTML/CSS сначала, иначе модуль по коническим градиентам окажется абракадаброй.

Сколько времени займёт курс?

Длительность в описании курса не указана. Ориентируйтесь на объём программы: восемь модулей с практическими мастерскими — это несколько недель при умеренной нагрузке, но точнее скажет только сам темп прохождения.

Дадут ли сертификат или диплом?

Данных о документе об окончании в описании курса нет. Уточните на сайте HTML Academy до того, как это станет критерием выбора.

Поможет ли курс найти работу?

Напрямую — нет: это узкоспециализированная тема внутри фронтенда, не полноценная программа трудоустройства. Зато навыки box-shadow, градиентов и CSS-слайдера реально повышают ценность на интервью для позиций фронтенд-разработчика или UI-инженера.

Курс точно бесплатный?

Да, цена указана как нулевая. Но уточните условия доступа на сайте школы: иногда бесплатны только отдельные уроки, а полный курс требует регистрации или подписки.

Чем отличается этот курс от обычного туториала на YouTube?

Структурой и форматом мастерских: восемь связных модулей с нарастающей сложностью и практическими сборками — это другой опыт, чем разрозненные видео. HTML Academy известна задачным подходом, где код пишется в браузере, а не смотрится.

Длительность курса

Длительность курса

Формат обучения

Формат обучения

Интерактивный курс: теория, задания и испытания Обучение в свободном режиме

Обратная связь

Обратная связь

Общение на форуме учеников

Теория и практика

Теория и практика

6 глав 119 заданий 12 испытаний

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

  • Изменять расположение элементов на странице
  • Использовать приёмы трансформаций для создания декоративных эффектов
  • Подключать к работе свойство box-shadow
  • Использовать множественные тени
  • Разбираться в синтаксисе функции linear-gradient
  • Применять фильтры к разным элементам
  • Комбинировать и анимировать элементы
Перейти на страницу курса Запишись на курс
прямо сейчас!

О курсе

О курсе

Веб-разработчикам

Условия оплаты

доступ ко всем курсам этой школы осуществляется по подписке:
профессиональный - $39/месяц
премиум - $199/месяц

19 заданий

1 испытание

Глава 1:

Позиционирование

Взглянем на несколько режимов позиционирования элементов: относительный, абсолютный и фиксированный. А также попрактикуемся изменять расположение элементов на странице с помощью CSS-свойств для позиционирования.

29 заданий

3 испытания

Глава 2:

Двумерные трансформации

Будем крутить, наклонять, перемещать, уменьшать и увеличивать объекты, а также взрывать их фаерболами, телепортироваться и использовать телекинез. Ну и, конечно, разберём крутые приёмы использования трансформаций для создания декоративных эффектов.

15 заданий

2 испытания

Глава 3:

Игра теней

Взглянем на процесс создания теней с помощью CSS. Мы по косточкам разберём свойство box-shadow, научимся использовать множественные тени, а также изучим некоторые продвинутые приёмы работы с тенями.

19 заданий

4 испытания

Глава 4:

Линейные градиенты

Узнаем, что такое линейные градиенты и как их можно использовать для создания интересных декоративных эффектов. Разберём синтаксис функции linear-gradient, некоторые интересные приёмы, попрактикуемся создавать сложные орнаменты с помощью градиентов.

12 заданий

2 испытания

Глава 5:

Кекстаграм: Начало. CSS-фильтры

Вместе станем мастерами фильтров в CSS: разберёмся, как применять фильтры к разным элементам, а также комбинировать и анимировать их.

25 заданий

Глава 6:

Кекстаграм: Эпилог. JavaScript

В сиквеле курса «Кекстаграм» нам предстоит запрограммировать небольшое фотоприложение с фильтрами на JavaScript.

HTML

CSS

JavaScript

Изменение расположеняе элементов на странице с помощью CSS-свойств для позиционирования.

Использование трансформаций для создания декоративных эффектов

Создание теней с помощью CSS, свойство box-shadow.

Создание сложные орнаменты с помощью градиентов.

Создание фотоприложения с фильтрами на JavaScript.

Навыки, которые вы получите

 
ВЕРСТКА РАБОТА С КОМПОЗИЦИЕЙ ТЕНИ С ПОМОЩЬЮ CSS ФОТОПРИЛОЖЕНИЯ НА JAVASCRIPT

Компания, проводящая курс

HTML Academy (HTML академия)

21 курс по 77 темам

Академия HTML запустилась в 2013 году. Является участником Сколково. На платформе насчитывается 67 онлайн-курсов, 6 интенсивов и более 300...

Отзывов об этом курсе пока нет

Ниже — отзывы о школе HTML Academy (HTML академия): они помогут составить впечатление, но в рейтинге курса не учитываются. Проходили этот курс? Поделитесь — это поможет другим студентам.

Подборки лучших курсов по теме

По темам этого курса на MOOC есть рейтинги лучших программ — сравнение цен, длительности и отзывов в одном месте.

больше курсов

Похожие курсы компании

HTML Academy (HTML академия)
(3)
HTML Academy (HTML академия)
(1)
HTML Academy (HTML академия)
(0)
HTML Academy (HTML академия)
(0)
HTML Academy (HTML академия)
(0)
HTML Academy (HTML академия)
(2)
HTML Academy (HTML академия)
(0)
HTML Academy (HTML академия)
(0)
1 060 
HTML Academy (HTML академия)
(0)