Интенсивный онлайн‑курс
Профессиональный HTML и CSS,
уровень 1

12 ноября 2018 — 23 января 2019

Записаться на курс
Интенсивный онлайн‑курс «Профессиональный HTML и CSS, уровень 1»

Курс разработан для новичков в IT: тех, кто хочет быстро сменить профессию и стать высокооплачиваемым профессионалом, работающим из любой точки мира.

Консультация по телефону
8 800 555-86-28

Что вас ждёт на онлайн‑курсе

Живые лекции

Живые лекции проходят по понедельникам и четвергам с 19:00 до 21:00 по московскому времени. Запись лекции доступна на следующий день.

Преподаватель рассказывает тему, а студенты задают вопросы в чате.
Полная программа курса

Личный наставник

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

Расписание консультаций вы определяете сами.
Подробнее о наставнике

Практика

На протяжении курса вы будете работать над личным проектом под руководством наставника, выполнять задачи по теме каждого блока.
Подробнее об учебном процессе

Критерии качества

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

Результат

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

Что даёт курс

После защиты на курсе можно начать карьеру с младшего верстальщика, а также продолжить обучение на других наших курсах.

Младший верстальщик
30 000 
Уровень знаний младшего верстальщика

Записаться на курс

Наставники

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

Студент на интенсиве HTML Academy
Привет, посмотри, пожалуйста, макет. Никак не могу понять почему блоки не выравниваются по высоте.
Наставник на интенсиве HTML Academy
Конечно, отправляй — сейчас гляну.
Наставник на интенсиве HTML Academy

Наставник рассказывает о своей работе

Привет, Максим.

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

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

После каждой лекции даётся домашнее задание — практические примеры для закрепления теории. Все они делятся на интерактивные курсы и задания по написанию кода страниц учебного и личного проекта. Да, всё именно так, за интенсив тебе нужно будет постараться успеть сверстать два проекта: учебный и личный. Учебный проект один, он одинаковый у всех студентов, но при этом его выполнение не является обязательным. А в самом первом задании тебе нужно будет выбрать какой именно личный проект ты будешь делать. Всего их пять, они немного отличаются по сложности, и мы можем обсудить какой подойдёт тебе лучше других, чтобы наиболее эффективно пройти курс.

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

О том, как будет строиться наша с тобой работа

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

Если с чем-то будут сложности, то в любой момент можно пересмотреть лекцию или пролистать презентацию лекции. Если же всё равно останутся непонятными какие-то вопросы, то ты сможешь написать мне, отправив свой код на проверку. Проверив код, я либо напишу комментарии к нему, либо предложу созвониться, чтобы его обсудить и найти решение вместе. Заодно, конечно же, проверю не только проблемный участок, но и весь остальной код. И если найду что-то, что можно улучшить или оптимизировать, сразу расскажу о том, как это может улучшить твою вёрстку и как это скажется на поддержке твоего сайта в будущем.

Если ты сможешь сверстать всё самостоятельно и после этого отправишь код на проверку, то я всё равно полностью его просмотрю и дам общую обратную связь. У нас нет оценок, есть только хороший код и код, который нужно доработать. И мы будем вместе стремиться к тому, чтобы твой код всегда был хорошим!

Вообще, конечно, вёрстка — это процесс творческий, то есть единственно верного решения нет. И у тебя, наверное, может появиться вопрос: если вариант вёрстки не один и все верстают немного по-своему, то откуда я узнаю, что в итоге мой код будет хорошим? В этом нам помогут мой опыт и список критериев. Этот список нужен для того, чтобы перепроверить твою вёрстку с помощью объективных правил. Мы будем постоянно с ними сверяться и в конце курса, перед защитой, тебе уже не нужно будет ничего исправлять, так как ты сразу будешь учиться верстать правильно.

В итоге, верстая личный проект, приводя твой код к наилучшему виду и проводя консультации, мы подготовим твой личный проект к сдаче случайному наставнику. Наставник выбирается системой проверки случайным образом, и я сам не знаю, кто это будет. Этот наставник работает по тем же критериям, и его задача — перепроверить код ещё раз свежим взглядом, и если будут какие-то неточности — выписать их и отправить проект на доработку. Я, естественно, не оставлю тебя без помощи и помогу исправить все недочёты и получить самый высший балл, какой только возможно.

Теперь о времени

У тебя в общей сложности есть пять часов на консультации в течение пяти недель интенсива. Эффективнее всего проводить две получасовых консультации в неделю. Если хорошо подготовить список вопросов, то ты очень удивишься, сколько вопросов можно успеть обсудить за полчаса! То время, которое не будет использовано на одной неделе, будет перенесено на следующие и ближе к концу курса оно нам очень пригодится.

Для проведения консультаций нам нужно добавить друг друга в скайпе. Буду ждать заявку на добавление, ссылка на мой профиль есть в интерфейсе. Также нам нужно договориться о днях и времени, когда мы будем проводить консультации. Напиши, в какие дни и в какое время тебе было бы удобно созваниваться?

У меня есть несколько вопросов по поводу твоих начальных знаний и пожеланий:

  1. Какой у тебя уровень знаний на момент начала интенсива? Начинал ли ты изучать вёрстку самостоятельно? Проходил ли ты курсы на сайте Академии?
  2. Удобнее ли тебе работать самостоятельно, или мне необходимо контролировать выполнение заданий, чтобы мы точно успевали всё сделать в срок?
  3. Установлены ли уже все необходимые программы, или нужна какая-то помощь в выборе и настройке?

Расскажу ещё немного о себе

Я не всегда был наставником и верстальщиком. До этого я попробовал несколько разных профессий и всё время что-то меня не устраивало: то зарплата, то невозможность делать реально полезные вещи, то коллектив. Когда я впервые столкнулся с необходимостью писать HTML-код и украшать его с помощью CSS, я сразу понял, что сочетание визуального искусства и написания кода мне очень по душе. Я видел, что могу создавать реальные вещи, которыми будут пользоваться, возможно, тысячи людей и от того, насколько хорошо я справлюсь со своей задачей, будет зависеть то, насколько удобно будет пользоваться моим сайтом.

Я долго пытался учиться этому самостоятельно, но только после того, как попал к наставнику (это было ещё до появления интенсивов HTML Academy), я смог научиться чему-то реальному и практическому. Месяц моего общения с наставником был эффективнее чем полгода самообразования. В тот момент, помню, мне было очень жалко потерянного времени.

Я ни разу не пожалел, что попал в эту область, в которой так много интересных и увлечённых людей. Практически каждый из них стремится создавать что-то реальное и полезное, всегда готов поддержать или посоветовать как решить ту или иную задачу. Видимо, это та самая профессия, в которой люди могут и эффективно решать задачи, и относятся друг к другу как к равным. Наверное, всё это — HTML-семья.

Учебный процесс

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

Учебные макеты

После прохождения интенсива вы сможете верстать макеты такого же уровня сложности, как специально разработанные для интенсива учебные макеты «Техномарт», «Глейси», «Нёрдс», «Девайс» и «Седона».

Во время курса вы можете работать с нашими или своими макетами.

Учебный макет «Техномарт»
Учебный макет «Глейси»
Учебный макет «Седона»

Теория

Интерактивные демонстрации
Интерактивные демонстрации
Пошаговые демонстрации вёрстки, в которых можно экспериментировать с кодом учебного проекта.
Живые лекции и скринкасты
Живые лекции и скринкасты
На онлайн-семинарах преподаватель рассказывает и показывает новый материал, а вы можете задавать вопросы. В скринкастах разбираются дополнительные вопросы.
Полезные статьи
Статьи
Полезные статьи для каждого раздела интенсива.

Практика

Курсы Академии
Курсы Академии
В интерактивных курсах вы знакомитесь с базовой теорией, а также закрепляете приёмы вёрстки, разобранные на живых лекциях.
Личный проект
Личный проект
Проект, который вы будете самостоятельно верстать на протяжении всего курса. В процессе вам будет помогать наставник.

Программа

Первая неделя

Введение

Теоретическая лекция
Теоретическая лекция
Понедельник с 19:00 до 21:30
Ведущий: Алексей Симоненко, опыт веб-разработки 18 лет

Вводная лекция про роль и место верстальщика в мире веб-технологий.

Как проходит курс. Организационные вопросы.

  • Обзор личных проектов.
  • Как работать с наставником.
  • Критерии качества вёрстки.
  • Защита личного проекта и получение сертификата.

Что на самом деле происходит, когда вы вводите в браузере адрес сайта и нажимаете Enter?

  • IP-адрес, сервер и веб-сервер, «виртуальные хосты».
  • Доменные имена, URL-адреса и система DNS.
  • Загрузка и «сборка» веб-страницы.
  • Особенности HTTP и HTTPS. Протоколы HTTP/1.1 и HTTP/2.
  • Приёмы оптимизации веб-страниц.

Инструменты веб-разработчика и рабочий процесс на интенсиве.

  • Системы контроля версий.
  • Инструменты вёрстки: редакторы кода, инспекторы, полезные веб-сервисы.
  • Немного о браузерах, браузерных движках и различиях между ними.
КурсыКурсыСтатьиСтатьи
  • 6 практических курсов для знакомства с HTML.
  • Статьи, которые помогут выбрать редактор кода, разобраться с принципами работы веб-браузеров и начать работать с системами контроля версий.
ПроектыЗадания
  • Получаем наставника.
  • Настраиваем инструменты разработки, получаем графические макеты и создаём репозитории проектов.
  • Отрабатываем процесс выполнения заданий. Вносим изменения в проект и отправляем их в Гитхаб.

На выполнение заданий потребуется около шести часов. Вы можете выполнять их в любое удобное время.

Разметка

Теоретическая лекция
Теоретическая лекция
Четверг с 19:00 до 21:00
Ведущий: Александр Першин, к.т.н., опыт веб-разработки 12 лет

Создадим логическую HTML-разметку страниц учебного и личного проектов. Попрактикуемся использовать подходящие теги, задавать имена классов, оценивать сложность разметки.

Введение в HTML.

  • Синтаксис HTML, типы HTML-тегов.
  • Структура простейшего HTML-документа.
  • Как работать со спецификацией HTML.
  • Обзор HTML-тегов из личных проектов.

Качественная разметка и стили кодирования.

  • Простая, понятная, читабельная и логичная разметка: примеры и антипримеры.
  • Типовые ошибки разметки: «ссылка или кнопка», «картинка или фон» и другие.
  • Модульность разметки или использование «пространств имён».
  • Когда использовать <article>, <section> и <div>?
  • Кодгайды для разметки.
  • Алгоритмы создания разметки: «страница как документ», «страница как приложение», «дивянка».

Создаём разметку главной страницы учебного проекта.

ДемонстрацииИнтерактивная демонстрацияСкринкастыСкринкасты
  • 3 интерактивные демонстрации по разметке учебного проекта: «разметка главной страницы», «разметка каталога» и «разметка карточки товара».
  • 2 скринкаста по разметке учебного проекта: «разметка каталога» и «разметка карточки товара».
КурсыКурсыСтатьиСтатьи
  • 3 практических курса для знакомства с базовым синтаксисом CSS, возможностями по стилизации текста и управления фоном.
  • Статьи и кодгайды, которые помогут вам делать качественную разметку.
ПроектыЗадания
  • Задания на разметку страниц учебного и личного проектов.

На выполнение заданий потребуется около восьми часов.

Вторая неделя

Работа с графикой

Практическая лекция
Практическая лекция
Понедельник с 19:00 до 21:30
Ведущий: Виталий Зюзин, опыт веб-разработки 9 лет

Разберём всё необходимое для работы верстальщика с графическими редакторами. Подготовим графику для проектов.

Обзор основных графических редакторов и инструментов для работы с макетами: Adobe Photoshop, Sketch, Zeplin, Avocode.

Типовые задачи верстальщика в графических редакторах.

  • Настройка интерфейса.
  • Работа со слоями, типы слоёв.
  • Получение параметров текста.
  • Измерение размеров блоков, отступов, получение информации о цвете.
  • Получение параметров сложных декоративных эффектов: тени, градиенты и прочее.
  • Экспорт графики, работа с повторяющимися паттернами.

Обзор форматов графики в вебе.

  • Растровая графика — PNG, JPEG, GIF.
  • Векторная графика — SVG.
  • Как выбрать подходящий формат?
  • Оптимизация графики.

Разбор графических макетов проектов.

КурсыКурсыСтатьиСтатьи
  • 5 практических курсов о селекторах и каскадировании в CSS и формах в HTML.
  • Статьи о работе в Фотошопе и особенностях графических форматов.
ПроектыЗадания
  • Задания на подготовку графики и текстовых стилей учебного и личного проектов.

На выполнение заданий потребуется около шести часов.

Доступность

Практическая лекция
Практическая лекция
Четверг с 19:00 до 21:00
Ведущий: Вадим Макеев

Научимся делать интерфейсы удобные и доступные для всех. Управление фокусом, важность семантики, тестирование и скринридеры.

Интерфейсы — не картинки.

  • Какие есть слои интерфейса, кроме графики.
  • Зачем нужные интерактивные элементы.
  • Неочевидное использование интерфейсов.

Понятие доступности.

  • Что мешает пользоваться интерфейсами.
  • Ежедневные ситуации недоступности.
  • Физиологические и ментальные особенности.

Взаимодействие с клавиатуры.

  • Интерфейсы без указателя.
  • Зачем нужен фокус на элементах.
  • Как сделать элементы интерактивными.

Значимые элементы.

  • Зачем семантика и как не подхватить диватоз.
  • Почему не нужно переделывать элементы.
  • Кнопки и ссылки, в чём разница?

Лейблы элементов.

  • Кому нужны описания элементов.
  • Разбор ошибок в реальных интерфейсах.
  • Инспекторы доступности и скринридеры.
ДемонстрацииИнтерактивная демонстрацияСкринкастыСкринкасты
  • 3 интерактивные демонстрации по доступной разметке учебного проекта: «доступная разметка главной страницы», «доступная разметка других страниц» и «преимущества кнопок».
  • Скринкаст по доступной разметке внутренних страниц учебного проекта.
КурсыКурсыСтатьиСтатьи
  • 4 практических курса о продвинутых селекторах и декоративных возможностях CSS.
  • Статьи про создание доступных веб-интерфейсов.
ПроектыЗадание
  • Задания на шлифовку разметки учебного и личного проектов.

На выполнение заданий потребуется около шести часов.

Третья неделя

Введение в CSS

Практическая лекция
Практическая лекция
Понедельник с 19:00 до 21:00
Ведущий: Александр Першин

Разберёмся с базовыми механизмами CSS и начнём стилизацию проектов.

Введение в CSS.

  • Синтаксис CSS.
  • CSS-селекторы, псевдоклассы и псевдоэлементы.
  • Наследование, каскадность и приоритеты в CSS.
  • Единицы измерения в CSS: абсолютные, относительные, для управления цветом.
  • CSS-функции и директивы.

Практика стилизации.

  • Зачем нужна нормализация.
  • Пространства имён и независимые компоненты.
  • Стили кодирования для CSS.
  • Работа с нестандартными шрифтами.
  • Стилизация состояний интерактивных элементов.

Начинаем стилизацию главной страницы учебного проекта.

Задаём глобальные стили документа, описываем текстовые параметры элементов и состояния интерактивных элементов.

ДемонстрацииИнтерактивная демонстрацияСкринкастыСкринкасты
  • 4 интерактивных демонстраций по базовой стилизации: «стилизация главной страницы», «стилизация страницы каталога», «стилизация карточки товара» и «флексбоксы: карточки».
  • 2 скринкаста по базовой стилизации «страницы каталога» и «карточки товара».
КурсыКурсыСтатьиСтатьи
  • 4 практических курса для знакомства с блочной моделью документа, флексбоксами и приёмами построения сеток.
  • Статьи, которые помогут вам разобраться с тонкостями использования CSS: нормализацией, подключением нестандартных шрифтов и доступной стилизацией интерактивных элементов.
ПроектыЗадания

Задания на базовую стилизацию учебного и личного проектов.

На выполнение заданий потребуется около шести часов.

Сетки

Теоретическая лекция
Теоретическая лекция
Четверг с 19:00 до 21:30
Ведущий: Александр Першин

Разберёмся с блочной моделью документа. Создадим сетки страниц учебного и личного проектов.

Поток документа и блочная модель документа.

  • Понятие сетки и потока документа.
  • Блочные и строчные элементы и их особенности.
  • Свойства блочной модели: размеры, рамки и отступы.
  • Тонкости блочной модели: «схлопывание» и «выпадание» внешних отступов, width: 100% и width: auto, свойство box-sizing и другие.
  • Свойство display. Управление типом элементов.

Создание сеток на флексбоксах.

  • Введение во флексбокс.
  • Флекс-контейнер, флекс-элементы, флекс-оси.
  • Алгоритм расчёта размеров флекс-элементов.
  • Выравнивание и распределение флекс-элементов вдоль осей.
  • Однострочный и многострочный флекс-контейнер, управление флекс-рядами.
  • Особенности флексбоксов при создании сеток.

Создаём сетку главной страницы учебного проекта.

ДемонстрацииИнтерактивная демонстрацияСкринкастыСкринкасты
  • 3 интерактивные демонстрации по созданию сетки: «сетка главной страницы», «сетка страницы каталога» и «сетка карточки товара».
  • 2 скринкаста по созданию сетки «страницы каталога» и «карточки товара».
КурсыКурсыСтатьиСтатьи
  • 5 практических курса по созданию сложных декоративных элементов.
  • Статьи, которые помогут вам разобраться с особенностями блочной модели документа, флексбоксами и приёмами построения сеток.
ПроектыЗадания

Задания на создание сеток учебного и личного проектов на флексбоксах.

На выполнение заданий потребуется около восьми часов.

Четвёртая неделя

Декоративные элементы

Практическая лекция
Практическая лекция
Понедельник с 19:00 до 21:00
Ведущий: Александр Першин

Познакомимся с приёмами создания декоративных элементов. Завершим вёрстку главных страниц учебного и личного проектов.

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

  • Относительное позиционирование.
  • Абсолютное позиционирование: координаты, изменение точки начала координат, относительные координаты и размеры, координаты по умолчанию.
  • Фиксированное позиционирование.
  • Управление порядком слоёв.

Приёмы создания элементов интерфейса.

  • Блочно-строчные элементы и их особенности.
  • Борьба с пробелами между блочно-строчными элементами.
  • Особенности флексбоксов при создании элементов интерфейсов.
  • Типовой приём «псевдоэлемент с абсолютным позиционированием».
  • Использование CSS-графики для создания декоративных элементов.

Завершаем вёрстку главной страницы учебного проекта.

ДемонстрацииИнтерактивная демонстрацияСкринкастыСкринкасты
  • Интерактивная демонстрация «завершаем стилизацию учебного проекта».
  • 5 интерактивных демонстраций сложных элементов в личных проектах.
  • 5 скринкастов про создание сложных декоративных элементов.
  • Скринкаст по работе с SVG.
КурсыКурсы

3 практических курса для закрепления навыков создания декоративных элементов.

ПроектыЗадания

Задания на создание декоративных элементов учебного и личного проектов.

На выполнение заданий потребуется около шести часов.

Оформление контента

Практическая лекция
Практическая лекция
Четверг с 19:00 до 21:00
Ведущий: Александр Першин

Завершим вёрстку внутренних страниц и подготовим проекты к публикации. Начнём готовиться к защите личного проекта.

Практикуемся в вёрстке элементов содержимого.

  • Сверстаем текстовую страницу учебного проекта. Подготовим универсальные стили содержания, которые будут хорошо работать при наполнении страницы из CMS.
  • Сверстаем всплывающие окна с формой входа и интерактивной картой. Разберём приёмы стилизации нестандартных элементов форм.
  • Подготовим свёрстанный учебный макет к публикации или передаче заказчику.

Разбираем типовые случаи переполнения и способы борьбы с ними.

Готовим проект к защите. Подробный разбор критериев защиты выпускных проектов.

ДемонстрацииИнтерактивные демонстрации
  • Интерактивная демонстрация «вёрстка текстовой страницы учебного проекта».
  • Интерактивная демонстрация «вёрстка всплывающих окон учебного проекта».
  • Интерактивная демонстрация «примеры переполнения».
КурсыКурсыСтатьиСтатьи
  • 3 практических курса для знакомства с JavaScript и один курс по CSS-анимациями.
  • Статьи о тонкостях оформления текстового содержимого и элементов форм.
ПроектыЗадания

Задание на завершение вёрстки личного проекта. Подготовка проекта к защите.

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

Пятая неделя

Введение в JavaScript

Практическая лекция
Практическая лекция
Четверг с 19:00 до 21:00
Ведущий: Алексей Симоненко

Познакомимся с JavaScript, узнаем что такое Vanilla JS и оживим некоторые блоки вёрстки.

Язык программирования JavaScript.

  • Роль программирования в жизни верстальщика.
  • Что такое DOM и зачем нам объект document.
  • Зачем нужен объект window.

Типовые случаи использования JavaScript.

  • Как найти любой элемент на странице.
  • Как реагировать на события, происходящие на странице.
  • Как менять CSS-стили у элементов.
  • Как использовать анимацию на странице.

Оживляем всплывающее окно и вставляем интерактивную карту на главной странице учебного проекта.

ДемонстрацииИнтерактивная демонстрация
  • Интерактивная демонстрация «оживление формы в учебном проекте».
  • Интерактивная демонстрация «оживление карты в учебном проекте».
СтатьиСтатьи

Статьи об опыте взаимодействия форм и особенностях работы JavaScript в браузере.

ПроектыЗадания

Задание по оживлению всплывающих окон и добавлению интерактивной карты в личный проект.

На выполнение заданий потребуется около четырёх часов.

Лучшие практики

Теоретическая лекция
Теоретическая лекция
Четверг с 19:00 до 21:00
Ведущий: Вадим Макеев

Узнаем как правильно применять практические знания, как учиться новому и развиваться в профессии.

Совместимая вёрстка.

  • Прогрессивное улучшение.
  • Постепенная деградация.
  • Цена совместимости.
  • Независимые слои улучшения.

Реальное тестирование.

  • Многообразие браузеров и устройств.
  • Инспекторы, эмуляторы, виртуальные машины.
  • Слабые устройства и медленные сети.
  • Минификация, сжатие, оптимизация.
  • Эмпатия, приоритеты, сначала контент.

Корневые технологии.

  • Веб-стандарты и фантазийные велосипеды.
  • Ваниль против библиотек и фреймворков.
  • Мода, хайп, вечное и светлое.

Развитие в профессии.

  • Как не потерять актуальность знаний.
  • Обмен знаниями, события, выступления.
  • Пограничные дисциплины.
СтатьиСтатьи

Статьи и видеозаписи докладов о прогрессивном улучшении.

Сертификат

После курса вы получите сертификат.

Сертификат интенсива «Профессиональный HTML и CSS, уровень 1»

Об Академии

6лет на рынке обучения
64интенсива проведено
10 756студентов закончили курсы

Главная цель интенсивных курсов — готовить профессионалов для IT-индустрии.

Поэтому обучение на интенсивах максимально приближено к рабочему процессу в компаниях: разработка проектов ведётся в Гитхабе, а роль старшего разработчика берёт на себя наставник. Во время курса ученики создают учебный проект и защищают его по критериям качества, которые были составлены совместно с сообществом разработчиков и считаются актуальными на рынке.

12 ноября 2018 — 23 января 2019

Записаться и оплатить
Курс «HTML и CSS, уровень 1»

Осталось 97 мест

14 500

Нажимая «Оплатить», вы подтверждаете своё согласие с условиями предоставления услуг.

Заполните, пожалуйста, ваши имя и электронную почту для регистрации.

После оплаты курса вам придёт письмо с инструкциями и ссылкой для доступа в интерфейс участника интенсива.

Uniweb

На первый интенсив шёл чисто из любопытства и был приятно удивлён заинтересованностью лекторов и моего наставника. Лекции были наглядные и интересные, а наставник всегда был на связи. Отдельно хочу отметить пользу консультаций. Это не только проверка заданий и помощь более опытного коллеги, но и возможность узнать о сфере веб-разработки изнутри, что действительно важно для новичка.

После успешного окончания базового интенсива, решил продолжить обучение на продвинутом. Git, БЭМ, препроцессор, адаптивность, автоматизация — эти слова здесь познаются как в теории, так и на практике. Также рассказывают об SVG и флексбоксе. Все эти вещи необходимо знать для того, чтобы стать квалифицированным специалистом.

Полученные навыки и качественные макеты в резюме помогли мне устроиться на отличную работу, где успешно применяю знания, полученные на интенсивах, а также приобретаю новые.

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

Леонид Лебедев, верстальщик в Uniweb.

Центр Высоких Технологий

Несколько раз я проводил собеседования с разработчиками, прошедшими курсы HTML Academy. Все они показывали хорошо структурированные знания HTML, CSS и других инструментов, легко оперировали терминами и объясняли решения прикладных повседневных задач. В составе курсов в теории и на примерах объясняются базовые понятия верстки и современные практики фронтенд-разработки. Некоторые из выпускников HTML Academy сейчас проходят стажировку или работают в нашей компании.

Я рекомендую пройти все базовые и продвинутые курсы тем, кто хочет стать фронтенд-разработчиком, и тем, кто уже занимается версткой каждый день, но еще не задумывался о приведении полученных базовых знаний в порядок.

Сергей Смольников, ресурс-директор в Центре Высоких Технологий.

Наталья Ёркина

Я помню как пришла на собеседование только окончив интенсив, и первое, что мне сказали, посмотрев на макет: «А, вы окончили курсы HTML Academy? Мы уже видели этот макет у других претендентов». Меня удивило то, что компания, а она не самая большая и известная, но всё-таки знала про этот обучающий ресурс. К слову, макет смотрели недолго. Других макетов у меня не было, я пришла только с учебным. Поспрашивали ещё JavaScript немного. JavaScript я провалила, зато на все вопросы по вёрстке ответила без лишних усилий. И мне сказали, что я подхожу прямо на собеседовании.

Когда позднее я уточнила, почему меня всё-таки взяли в штат, мой новый руководитель ответил, что: «Вы даже не представляете, как сейчас верстают кандидаты. Мы готовы доучить вас программировать, восполнить какие-то другие пробелы, лишь бы вы могли повторить то, что у вас на макете». Сейчас я полгода как работаю в этой компании. Полёт нормальный. Я очень довольна тем, что когда-то выбрала для обучения именно этот ресурс. Огромное спасибо HTML Academy.

Наталья Ёркина, верстальщик в JokerInteractive.

Агентство Molinos

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

Радует, что Академия развивает программы и следит за их актуальностью. Так держать!

Евгений Сергеев, технический директор в агентстве Molinos.

Денис Байдаров

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

Главной особенностью является наставник, и в общем-то, именно из-за этого хочется пойти на интенсив. В интернете есть множество учебных материалов, но они не заменят живого профессионала, который будет дотошно проверять каждую строчку твоего кода. Он объяснит и структурирует знания. Поможет формированию хорошего стиля. После прохождения каждого из интенсивов чувствуешь огромный скачок знаний.

Конечно, пройти интенсив трудно, после прохождения нужно работать над собой и закреплять знания, но старт дан. Пройдя все интенсивы, можно стать отличным специалистом, разбирающимся во всех основных направлениях фронтенда.

Денис Байдаров, фрилансер.

Nimax

Мы всегда ищем толковых фронтенд-специалистов и обращаем особое внимание на тех, кто проходил обучение в HTML Academy. Почти все наши сотрудники, включая менеджеров проектов, проектировщиков и дизайнеров проходили как минимум базовые курсы вёрстки чтобы лучше понимать технологии, с которыми мы работаем. Настойчиво рекомендуем.

Никита Михеенков, директор по развитию в Nimax.

Агентство ARTW

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

Отдельной благодарности HTML Academy заслуживает за активное участие в отраслевых конференциях и семинарах.

Ярослав Шаповал, креативный директор в интерактивном агентстве ARTW.

Сергей Кравченко

Два года назад случайно нашёл курсы Академии и с удовольствием проходил их, тогда ещё не было интенсивов и первый поток только готовился, и перед самым его стартом я выбирал куда записаться — на вёрстку в Академию или сторонний курс по веб-дизайну, так как сайт, которым занимался и из-за которого я в принципе стал изучать веб-технологии, нуждался в редизайне и новой вёрстке, и хотелось освоить это самому, но самообучение отнимало достаточно много времени.

В тот момент я всё-таки выбрал курс по веб-дизайну и на базовый интенсив Академии записался через полгода, уже на третий набор. На этот момент у меня было с чем сравнивать и интенсив Академии полностью оправдал себя, сравнивая не по тематике, а по организации курса, подаче материала, продуманности, соответствии ожиданий и того, что получилось на выходе. К тому моменту у меня были базовые знания от самообучения и практики, поэтому базовый интенсив помог систематизировать и закрепить эти знания, разрешить некоторые спорные вопросы и сэкономить время на самообучении.

Сергей Кравченко, CTO в агентстве Перцы.

Breadhead

Если кратко — большое спасибо за то, что вы делаете. Это супер-круто. К нам приходит много фронтендеров на собеседования, но человека от вас можно отличить сразу — вы даёте такую базу, систему, до которой редко кто доходит сам даже за пять лет в профессии.

Если честно, я сейчас вообще не понимаю, как мы жили до вас. Последние три года все верстальщики, с которыми мы работали — от вас.

Леонид Николаев, сооснователь Breadhead.

Владислав Балабанович

Академия ни много ни мало подарила мне профессию: два года назад я лишь смутно понимал, как устроен мир разработки, а сейчас я фрилансер-разработчик, веб-дизайнер, путешественник (пишу эти строки сидя под пальмами в Гоа).

Интенсив, который я прошёл в Академии, послужил для меня толчком и одновременно почвой под ногами — оперевшись на полученные навыки, я стал расти дальше — день за днём, и вот я уже так далеко, как не мог себе представить раньше.

Благодарю!

Владислав Балабанович, фрилансер.

Максим Фарига

Вёрстка кажется несложным процессом, но таит в себе много подводных камней. Именно за этими подводными камнями я и пришёл в HTML Academy. Благодаря моему наставнику я разобрался с ними. В HTML Academy учат не просто верстать, а делать вёрстку пуленепробиваемой, с «защитой от дурака».

Больше всего запоминаются курсы, которые построены в игровой и весёлой атмосфере (задания с котиками и прочие), и проходить их это одно удовольствие. Время пролетает незаметно, но желание сделать задание на 100% неумолимо.

Максим Фарига, фрилансер.