С чего начинать frontend новичку?

Оптимальный старт для новичка — HTML и CSS, затем JavaScript и только после этого фреймворки.

Есть ли в курсе адаптивная вёрстка?

Да, в курсе есть разделы по медиа-запросам, responsive-паттернам и современным техникам адаптивности.

Разбираются ли современные CSS-подходы?

Да, в программе есть темы по CSS-переменным, архитектуре стилей, компонентному подходу и производительности.

HTML & CSS

Основа фронтенда: разметка, стили, Flexbox, Grid, адаптивный дизайн и анимации.

0/740

0/48

уроков

пройдено

Начать курс

Что такое HTML?

HTML & CSS: Основы HTML · +10 XP

Основы HTML

0/10

Что такое HTML?+10 XP

Структура HTML-документа+10 XP

Заголовки и абзацы+10 XP

Ссылки: тег <a>+10 XP

Изображения: тег <img>+10 XP

Списки: ul, ol и li+10 XP

Атрибуты HTML+10 XP

Формы: тег <form>+15 XP

Типы полей формы+15 XP

Таблицы+10 XP

HTML Семантика

0/5

Семантический HTML+15 XP

div и span: контейнеры+10 XP

Мета-теги и SEO+15 XP

Доступность: alt, label, aria+15 XP

Правила хорошего HTML+15 XP

Основы CSS

0/8

Что такое CSS?+10 XP

Селекторы CSS+10 XP

Специфичность и каскад+15 XP

Цвета в CSS+10 XP

Шрифты и типографика+15 XP

Блочная модель CSS+15 XP

Позиционирование элементов+20 XP

Display: block, inline, flex+15 XP

Flexbox и Grid

0/3

Flexbox: управление строкой+20 XP

Flexbox: выравнивание и wrap+20 XP

CSS Grid: сетка страницы+20 XP

Адаптивность

0/4

Медиа-запросы и адаптивность+20 XP

Адаптивные изображения+20 XP

Паттерны адаптивности+20 XP

Адаптивные макеты+20 XP

Продвинутое CSS

0/14

CSS-переменные (Custom Properties)+15 XP

Псевдоклассы и псевдоэлементы+15 XP

Переходы и анимации CSS+20 XP

CSS-переменные: продвинутые техники+20 XP

Container Queries: компонентно-адаптивный дизайн+20 XP

CSS Grid: продвинутые техники+20 XP

CSS Анимации: Web Animations API+20 XP

3D трансформации и перспектива+20 XP

Clip-path и маски: нестандартные формы+15 XP

CSS фильтры и режимы наложения+15 XP

Scroll Snap и Scroll-driven Animations+15 XP

:has(), :is(), :where() — продвинутые CSS-селекторы+15 XP

CSS для печати и доступности+10 XP

CSS-производительность и оптимизация+20 XP

Архитектура CSS

0/4

BEM: методология именования классов+15 XP

SASS/SCSS: препроцессоры CSS+20 XP

CSS-in-JS: styled-components и Emotion+20 XP

Логические свойства: интернационализация CSS+15 XP

Курс HTML и CSS с нуля: что изучишь и куда идти дальше

Этот блок помогает быстро понять программу курса, ключевые навыки и следующий шаг после вёрстки.

Что ты изучишь

Создавать семантическую HTML-разметку и доступные интерфейсы
Уверенно работать с Flexbox, Grid и адаптивной вёрсткой
Применять современные CSS-подходы: переменные, компоненты, архитектура стилей
Собирать аккуратные страницы, готовые к подключению JavaScript

Полезно по теме

Тема: JavaScript с нуля Гайд: план обучения frontend Практика: DOM и события Полный roadmap по frontend

FAQ

Можно ли стать frontend-разработчиком только с HTML и CSS?

HTML и CSS дают мощную базу, но для работы обычно нужен ещё JavaScript и понимание браузера.

Сколько нужно практики по вёрстке до перехода к JavaScript?

Обычно достаточно 2-4 недель регулярной практики, чтобы уверенно перейти к основам JavaScript.

Зачем изучать семантику и доступность в начале?

Это повышает качество интерфейсов, улучшает SEO и делает продукт удобнее для пользователей.

48 уроков · 740 XP всего