Привет, дружище! ✋
А ты знал, что, по данным сайта TRUD.COM, верстальщики HTML и CSS зарабатывают 50+ тысяч рублей в месяц? Это в полтора раза больше средней зарплаты в России! Даже мой батя, который сутками пашет на заводе и то меньше получает.
То есть, освоив профессию верстальщика, ты сможешь зарабатывать немало денег. Вопрос только в том, как её освоить.
А ответ прост — с помощью платных и бесплатных курсов по HTML и CSS (вдобавок, думаю, можно припихнуть сюда также JavaScript и PHP).
О них я и расскажу в этой статье.
Сначала о бесплатных курсах, потому что знаю, как тебе не хочется тратить лишние деньги. А потом о платных тренингах и программах.
Итак. Без лишних предисловий… Полетели! 🚀
Бесплатные курсы по вёрстке на HTML и CSS —ТОП-30 лучших
№1. «HTML/CSS» от beONmax
Кто проводит: Сергей Никонов, основатель образовательного проекта FructCode, веб-разработчик с 12-летним стажем.
Формат: видеоуроки + интерактивные упражнения + домашние задания.
Сколько длится: 31 видеоурок = 5 часов.
Что ты узнаешь из курса:
- Какие программы и инструменты надо использовать для вёрстки.
- Какие теги HTML существуют.
- Основы синтаксиса CSS.
- Как создавать меню, хедер, футер, сайдбар и многое другое.
🏆 На правах рекламы. Онлайн-курс «Я — Веб-разработчик PRO» от SkillBox [гарантированное трудоустройство]
Стоимость: 304 000 182 400 ₽ по скидке. В рассрочку — от 5 884 ₽/мес. (первый платёж через 6 месяцев).
Получить скидку — жмяк.
Длительность: 2 года.
Документ об окончании: диплом.
Формат: видеоуроки + домашние задания с проверкой и обратной связью от команды наставников + общение в закрытом коммьюнити с другими студентами + создание проектов для портфолио + оффлайн-мероприятия (экскурсии в компании и воркшопы) + консультации
Вообще главным возражением при покупке курсов SkillBox является их высокая цена.
Однако, если говорить честно, — она не такая высокая, как кажется. Если ты добросовестно её освоишь, то сможешь претендовать на вакансии с зарплатой от 100-200 тысяч рублей в месяц. То есть при грамотном подходе обучение окупается за 1-2 месяца. И это я не учитываю те заказы на биржах фриланса, которые ты сможешь выполнять уже в первые месяцы курса.
Преподаватели курса:
Василий Грудистов
Разработчик с 10-летним стажем. Участвовал в разработке сайтов для ПАО «ВТБ», Samsung, Epson, Teachbase и многих других компаний.
Полный список преподавателей смотри на странице курса.
Другие классные курсы SkillBox по теме:
- «Веб-дизайн с 0 до PRO»
- «Профессия Fullstack-разработчик на Python»
- «PHP-разработчик c 0 до PRO»
- «Профессия Frontend-разработчик c 0 до PRO»
- «Профессия Java-разработчик PRO»
- «Профессия Go-разработчик»
- Свыше 1 000+ бесплатных вебинаров
№2. «Интерактивный курс создания сайтов HTML и CSS с нуля» (с сертификатом об окончании)
Кто проводит: уже упомянутый ранее Сергей Никонов.
Формат: видеоуроки + интерактивные упражнения + домашние задания.
Сколько длится: 6 часов.
Стоимость: часть курса бесплатна, другая часть доступна после оформления недорогой подписки.
Что ты узнаешь из курса:
- Как пользоваться html-тегами div, span, p, ul, li и другими.
- Для чего нужен CSS (каскадные таблицы стилей).
- Как использовать css-свойства margin, position, padding, color, background и другие.
- Что такое адаптивная вёрстка.
- Как сделать вёрстку сайта.
- Как пользоваться инструментами разработчика в браузере Google Chrome.
- Что такое viewport и как его использовать.
- Как создать раздел с комментариями на сайте.
- Как встроить видео в html-страницу.
- Как изменить вёрстку сайта в браузере.
- Как связать html-страницы между собой.
- Как сверстать меню на сайте.
№3. «Основы HTML и CSS»
Кто проводит: онлайн-университет интернет-профессий «Нетология».
Формат: онлайн-вебинары 2 раза в неделю.
Сколько длится: 2 недели.
Что ты узнаешь из курса:
- Как вносить правки в HTML-код страницы и верстать текстовые блоки.
- Как менять оформление и стиль элементов сайта.
- Как профессиональные верстальщики работают над проектами.
№4. Курсы от HTML Academy
Помню сам проходил эти курсы. Целую неделю по 3-4 часа в день сидел за бесплатными уроками от инструктора Кекса.
Кто проводит: HTML Academy, на мой взгляд, её сайт — лучшее место для обучения основам вёрстки.
Формат: интерактивные уроки с практическими заданиями.
Сколько длится: зависит от твоей скорости и мотивации.
Стоимость: большая часть курсов бесплатна.
Что ты узнаешь из курса:
- Основы HTML5.
- Базовое представление о CSS3.
- Основы JavaScript.
- Основы PHP.
№5. Курсы на Udemy
Кто проводит: разные преподаватели со всего мира.
Формат: видеоуроки + практические задания + тесты.
Сколько длится: зависит от курса и программы обучения, которую составил автор.
Стоимость: есть бесплатные курсы, есть платные.
№6. Курсы на CodeAcademy
Кто проводит: разные преподаватели (в основном на английском языке, поэтому, если у тебя с ним туговато, лучше читай дальше).
Формат: интерактивные уроки, результат виден сразу же прямо в браузере.
Сколько длится: в зависимости от твоих способностей и наличия свободного времени.
№7. Бесплатный курс Евгения Попова по HTML для новичков
О нём ходят очень противоречивые слухи. Некоторые говорят, что Евгений обучает людей к чертям устаревшим знаниям. Другие думают, что для ознакомления сойдёт. По мне — курс довольно-таки неплохой, для начинающих в самый раз.
Формат: видеоуроки.
Сколько длится: 33 видеоурока.
Что ты узнаешь из курса:
- Понятие тега.
- Как создавать каркас страниц.
- Как создавать параграфы и заголовки.
- Как создавать списки.
- Как создавать атрибуты.
- Как ставить ссылки.
- Как делать красивые таблицы.
- Как красиво оформлять текст.
- Как создавать поля форм, радиокнопки и чекбоксы.
- И т. п.
№8. Бесплатный курс Евгения Попова по CSS
Формат: 45 видеоуроков.
Сколько длится: всё зависит от твоих сил и скорости.
Что ты узнаешь из курса:
- Принципы работы CSS.
- Как подключать 3 базовых селектора.
- Что такое групповые селекторы.
- Что такое селекторы потомков.
- Что такое псевдоселекторы ссылок.
- Какие бывают семейства шрифтов.
- Как выравнивать текст.
- Как задавать высоту строки.
- Как делать сокращенную запись.
- Как делать рамки.
- Как работать со списками.
- Что такое наследование.
- Каскадность и приоритетность.
- Блочная модель, margin и padding.
- Ширина и высота блока, выравнивание.
- Конфликты полей.
- Блочные и встроенные элементы.
- Фоновый цвет и изображение.
- Повтор фонового изображения.
- Позиционирование фонового изображения.
- Фиксация фона.
- Краткая запись фоновых свойств.
- Как делать таблицы.
- Как создавать простой каркас на основе float.
- Что такое чистка обтекания.
- Колонки одной высоты.
- Позиционирование.
- Абсолютное позиционирование.
- Относительное позиционирование.
- Фиксированное позиционирование.
- Z-индексы.
- Видимость элементов.
- Максимальная и минимальная ширина сайта.
- Два способа подключения стилей
- Что такое наследование ненаследуемых свойств.
№9. «HTML для начинающих»
Кто проводит: Артём Ивашкевич, программист компании Lamoda.
Формат: пошаговые статьи-уроки.
Сколько длится: 55 уроков.
Какие уроки есть в курсе:
- Создаём свою первую HTML-страницу.
- Теги как основа HTML-страницы.
- Тег doctype: указываем версию HTML.
- Из чего должна состоять любая страница в HTML.
- Заголовок HTML-страницы.
- Кодировка HTML-страницы.
- Ключевые слова (кейворды, keywords).
- Тег description: краткое описание страницы.
- Комментарии в HTML.
- Подключение CSS-стилей к HTML.
- Подключение скриптов JavaScript в HTML.
- Итог второго уровня курса по HTML.
- Разметка текста.
- Делаем абзацы в HTML.
- Делаем заголовки в HTML.
- Маркированные списки в HTML.
- Нумерованный список в HTML: тег ol.
- Делаем вложенный список в HTML.
- Выделяем важное жирным шрифтом.
- Курсив в HTML: теги em и i.
- Переносы и разделители в HTML: теги br и hr.
- Используем цитаты в HTML.
- Верхние и нижние индексы: оформляем формулы.
- Выводим текст как есть: тег pre.
- Учимся делать ссылки в HTML.
- Что такое абсолютные и относительные ссылки.
- Делаем ссылку на файл.
- Ссылка с якорем.
- Всплывающая подсказка для ссылок.
- Как вставлять картинки в HTML.
- Делаем картинку ссылкой.
- Описание картинки в HTML.
- Создаём таблицу в HTML: тег table.
- Делаем границы для таблицы в HTML.
- Горизонтальные и вертикальные границы в таблице HTML.
- Отступы в таблицах.
- Название таблицы в HTML.
- Ячейки-заголовки в таблице HTML.
- Объединение ячеек в таблицах.
- Выравниваем текст в таблице HTML.
- Способы выравнивания таблицы по центру в HTML.
- Учимся изменять цвет таблицы в HTML.
- Изменяем размер таблицы в HTML.
- Учимся создавать формы в HTML.
- Как задать значение по умолчанию для поля в форме.
- Как правильно сделать подписи к полям ввода.
- Создаём форму авторизации на HTML.
- Многострочное поле ввода: тег textarea.
- Поле-галочка в HTML.
- Поле-переключатель в форме HTML.
- Делаем раскрывающийся список в HTML.
- Форма для загрузки файлов.
- Используем скрытое поле в форме.
- Табличная вёрстка HTML-страничек. Прототип сайта.
- Как выложить сайт в Интернет: простая инструкция.
№10. «HTML и CSS — вёрстка сайтов для начинающих»
Кто проводит: PHP-School.
Формат: статьи-уроки + домашние задания.
Сколько уроков: 11.
Продолжительность: 20 часов.
№11. Free HTML and CSS tutorial
Кто проводит: Джереми Томас, американский фронтенд-разработчик и фрилансер, сотрудничающий с такими компаниями, как Microsoft и Sony.
Формат: текстовые уроки (на английском языке).
Сколько уроков: 50 уроков.
Продолжительность: зависит от тебя.
Что ты узнаешь на курсе:
- Синтаксис HTML.
- Его семантические элементы.
- Всё о создании ссылок.
- Основы форматирования текста.
- Как позиционировать элементы в CSS.
- Как менять шрифты.
- Как делать задний фон на сайте.
- И многое другое.
№12. Курсы по HTML от HTML Dog
Кто проводит: англоязычный сайт для обучения программированию.
Формат: текстовые уроки.
Сколько уроков: 3 курса (для начинающих, середнячков и профи) примерно по 10 уроков.
Продолжительность: зависит от тебя.
№13. Курсы по CSS от HTML Dog
Кто проводит: HTML Dog.
Формат: статьи-уроки.
Сколько уроков: также 3 курса 8-15 уроков.
Продолжительность: зависит от тебя.
№14. «Учим HTML за 1 Час! #От Профессионала»
№15. «Как выучить HTML & CSS? Самый аху##### способ!»
№16. «Вёрстка сайта с нуля для начинающих | HTML, CSS»
№17. «HTML вёрстка сайта»
№18. «HTML5 уроки для начинающих» от Гоши Дударя
№19. Курс HTML & CSS с домашними заданиями
№20. «HTML для начинающих» от Loftblog
№21. «Учим HTML за 35 минут для начинающих от 10 лет (Основы) + Мотивация для разработчиков»
№22. «Профессия HTML верстальщик — умерла? Нужны ли HTML верстальщики в 2020 году?»
№23. HTML5 для чайников | ВВЕДЕНИЕ — веб-программирование с нуля
№24. «Вёрстка HTML + CSS За 2 Часа. Из PSD. С Нуля. Полная Запись»
№25. Учебник HTML для начинающих
№26. HTML5 Учебник
№27. Учебник HTML и CSS от Трепачёва Дмитрия
№28. Самоучитель HTML
№29. Самоучитель CSS
№30. Профессия веб-разработчик от «Яндекс.Практикум»
Другие курсы и материалы по HTML и CSS:
- HTMLBook — огромный справочник по HTML.
- HTML5 и CSS3 на примерах — книга от Webref.
- Веб-разработка для начинающих на Stepik — бесплатный курс по html и css.
- Погружение в HTML5 — перевод книги Марка Пилгрима.
- HTML Tutorial — справочник по HTML (на английском).
- HTML | MDN — документация от Mozilla.
- CSS-Tricks — англоязычный ресурс.
- WPSchool — полезный ресурс по WordPress (уроки, обучение, статьи).
- 50 Бесплатных Шаблонов Сайтов на HTML5 и CSS3.
- 20 самых красивых и творческих сайтов на HTML5.
- Шаблон сайта на чистом HTML.
Платные курсы по вёрстке на HTML и CSS — ТОП-9 лучших
№1. «Я — Веб-разработчик PRO» от SkillBox
Стоимость: 304 000 182 400 ₽ по скидке. В рассрочку — от 5 884 ₽/мес. (первый платёж через 6 месяцев).
Получить скидку — жмяк.
Длительность: 2 года.
Документ об окончании: диплом.
Формат: видеоуроки + домашние задания с проверкой и обратной связью от команды наставников + общение в закрытом коммьюнити с другими студентами + создание проектов для портфолио + оффлайн-мероприятия (экскурсии в компании и воркшопы) + консультации
Вообще главным возражением при покупке курсов SkillBox является их высокая цена.
Однако, если говорить честно, — она не такая высокая, как кажется. Если ты добросовестно её освоишь, то сможешь претендовать на вакансии с зарплатой от 100-200 тысяч рублей в месяц. То есть при грамотном подходе обучение окупается за 1-2 месяца. И это я не учитываю те заказы на биржах фриланса, которые ты сможешь выполнять уже в первые месяцы курса.
Преподаватели курса:
Василий Грудистов
Разработчик с 10-летним стажем. Участвовал в разработке сайтов для ПАО «ВТБ», Samsung, Epson, Teachbase и многих других компаний.
Полный список преподавателей смотри на странице курса.
№2. «Frontend-разработчик с нуля»
Кто проводит: университет интернет-профессий Нетология.
Формат: вебинары + видеоуроки + практические проекты для портфолио + домашние задания + личные разборы с преподавателями.
Сколько длится: 10 месяцев.
Стоимость: 6 600 рублей в месяц.
Что ты получишь в ходе прохождения курса:
- Исчерпывающие знания об HTML5, CSS3, JavaScript, JSX, React, VirtualDOM, Flexbox и React Router.
- Диплом от известного онлайн-университета, который точно понравится твоим работодателям.
- Готовое профессионально оформленное портфолио.
- Трудоустройство с зарплатой от 85 000 рублей в месяц.
№3. «Как создать сайт самостоятельно»
Кто проводит: крупнейшее российское агентство интернет-маркетинга TexTerra.
Формат: 13 лекций по 1,5 часа + домашние задания и обратная связь.
Сколько длится: 2 месяца.
Стоимость: 10 000 рублей.
Что ты узнаешь из курса:
- Какие типы сайтов существуют.
- Что такое юзабилити и как его улучшить.
- Как прототипировать сайты.
- Как верстать на HTML и CSS.
- Как разрабатывать сайты на WordPress.
№4. «Профессия Frontend-разработчик»
Кто проводит: портал GeekBrains и Mail.ru Group (компания, которая владеет такими популярными соцсетями, как VK, Одноклассники и Мой Мир).
Формат: самостоятельная работа + работа с преподавателем (обладающим минимум 5-летним опытом Frontend-разработки) + работа с наставниками из числа лучших выпускников предыдущих потоков.
Сколько длится: 7 месяцев.
Кем ты станешь после прохождения курса:
Грамотным Frontend-разработчиком, умеющим верстать сайты по современным стандартам и виртуозно владеющим HTML, CSS и JavaScript.
Что ты получишь:
- Диплом.
- Портфолио.
- Среднюю зарплату в 100 000 рублей.
- Возможность поработать в стартапах других выпускников.
- Стажировку у партнёров GeekBrains (ПАО Сбербанк, ПАО Вымпелком и других).
- Полные знания об HTML и CSS.
- Подарочный 3-месячный курс по английскому языку.
- Обучающие мастер-классы и воркшопы.
Стоимость: 7 141 рубль в месяц.
№5. «Frontend-разработчик» от SkillFactory
№6. Курс «Python для веб-разработки»
№7. «Профессия Веб-дизайнер»
№8. «Профессия Fullstack-разработчик»
Для тех, кто хочет создавать дизайны сайтов и сразу же их верстать на HTML/CSS.
№9. «Fullstack-дизайнер»
На сегодня всё.
Это были самые лучшие курсы HTML и CSS в 2020 году.
Надеюсь, ты нашёл для себя что-то полезное.
Желаю удачи и до встречи! 💪
P.S. Ещё больше курсов по HTML и CSS ты можешь найти — здесь.
P.P.S. Вёрстка вёрсткой, а я всё-таки предпочитаю зарабатывать на копирайтинге и SEO.
Благодарю за подборку
Рад, что она кому-то пригодилась)
Огромное спасибо!Давно хотел найти подобные курсы
Не за что, Давид)))
Спасибо, пригодилось
Спасибо за подборку! Я знаю еще один полезный бесплатный курс по HTML — https://imdiz.ru/kurs-html/
Вместе с дочуркой прохожу онлайн- курс по английскому языку. Вместе и веселее и практичнее.
Огромное спасибо за подборку. А я бы хотел порекомендовать этот курс веб разработки https://chr.by/study/html-css-js-basic . Отлично подойдет для новичков. Преподаватель использует самую актуальную информацию и объясняет все доступным языком.
Спасибо за рекомендацию)
Спасибо Алексей, очень интересная статьи и раскрывает суть бесплатных курсов. Что можно обучиться всему чему хочешь, главное желание.
Это Вам спасибо за комментарий 🙂
Есть ещё один сайт бесплатного изучения не только HTML и CSS https://codebra.ru/
Подборка огонь. Есть еще крутой курс https://wezom.academy/courses/html-css-js/ .
Обясняют просто и понятно.