HTML и CSS с нуля за 2 недели: план обучения

Вёрстка — идеальный старт в IT. Не нужно быть математиком, достаточно внимательности и желания. За две недели интенсивной практики вы сможете сверстать лендинг и получить первые заказы на фрилансе.

День 1-3: Основы HTML

Выучите базовые теги:

Структура документа: html, head, body
Заголовки: h1-h6
Текст: p, span, strong, em
Списки: ul, ol, li
Ссылки: a href
Изображения: img src
Таблицы: table, tr, td

                <h1>Привет, мир!</h1>

                <p>Мой первый <strong>сайт</strong> на HTML</p>

                <a href="https://google.ru">Ссылка на Google</a>

День 4-7: CSS — стилизация

Поймите, как работает каскадность:

Селекторы: по тегу, классу, id
Цвета: background-color, color
Шрифты: font-size, font-family, font-weight
Отступы: margin, padding
Рамки: border, border-radius
Flexbox — главный инструмент для сеток

День 8-10: Flexbox и Grid

Изучите современные способы вёрстки. Играйте в тренажёры:

Flexbox Froggy — учим flex в игре
Grid Garden — учим CSS Grid

Flexbox для одномерной вёрстки (меню, карточки в ряд), Grid для двухмерной (сетка сайта).

День 11-12: Адаптивная вёрстка

Сайт должен красиво выглядеть на телефоне. Используйте медиазапросы:

                @media (max-width: 768px) {

                  .container {

                    flex-direction: column;

                  }

                }

День 13-14: Ваш первый проект

Сверстайте сайт-визитку или лендинг:

Скачайте макет с Figma Community (бесплатно)
Разбейте на компоненты (шапка, герой, карточки, подвал)
Используйте семантические теги: header, main, section, footer
Выложите на GitHub Pages или Netlify (бесплатно)

Ресурсы для обучения

HTML Academy — интерактивные курсы
MDN Web Docs — документация на русском
YouTube: каналы "Фрилансер по жизни", "WebDev с нуля"
Практика: Codewars (задачи на CSS), Frontend Mentor (готовые макеты)

Результат: Через 2 недели вы сможете верстать лендинги под заказ. Стартовая цена — 3000-5000 руб за проект. Через месяц практики — 10 000-15 000 руб.