Собирает видимую часть сайта: разметку и стили. То, что человек видит и трогает.
В макете всё аккуратно, а на телефоне блоки разъезжаются, кнопка не нажимается, а текст не читается на солнце. Верстальщик — тот, кто превращает картинку в работающую страницу и отвечает за то, чтобы она вела себя одинаково на любом экране.
Работа на стыке двух миров: с одной стороны нужно понимать замысел дизайнера, с другой — ограничения браузеров. Половина задач здесь не про «сделать красиво», а про «сделать так, чтобы не сломалось на маленьком экране и при медленном интернете».
Это самый быстрый вход в разработку: не нужно глубокой математики и сложной архитектуры, а результат виден сразу. Плата за простой вход — потолок: чистый верстальщик растёт медленнее, чем программист, и упирается в необходимость учиться дальше.
Со стороны кажется, что работа механическая: посмотрел на макет и написал. На деле макет показывает один экран, а страница живёт на сотне разных: от узкого телефона до широкого монитора, с длинными именами, пустыми списками, медленной связью и увеличенным шрифтом.
Хороший верстальщик заранее думает о том, чего в макете нет: что будет, если заголовок окажется в три строки, если картинка не загрузится, если пользователь увеличит масштаб. Именно эти случаи отличают рабочую страницу от красивой картинки.
И отдельно про доступность: возможность пользоваться сайтом с клавиатуры и с экранным диктором всё чаще становится требованием, а не пожеланием. Верстальщик, который это умеет, стоит заметно дороже.
Шкала общая для всего справочника — видно, где эта профессия стоит относительно остальных. Полоса начинается там, где начинается доход на этом уровне, и заканчивается там, где он заканчивается.
| Уровень | Диапазон в месяц | Кто это |
|---|---|---|
| На старте | 50 000 – 80 000 ₽ | Первые проекты, опыта в профессии почти нет |
| Уверенный специалист | 110 000 – 180 000 ₽ | 1–3 года практики, отвечает за результат |
| Сильный специалист | 180 000 – 280 000 ₽ | Ведёт направление или несколько проектов |
Сильнее всего доход зависит от того, остались вы на вёрстке или пошли в смежное. Верстальщик в агентстве на потоке задач зарабатывает меньше разработчика с теми же годами опыта. Второй фактор — доступность и производительность: за них платят отдельно.
Источник: Ориентир по открытым вакансиям, октябрь 2026
Это ориентир, а не обещание: работодатели платят за конкретный набор навыков и за результат, а не за название профессии. Перед тем как платить за обучение, посмотрите 10–15 актуальных вакансий и обратите внимание не на цифру, а на требования — они и определяют, чему учиться.
Редактор кода · Инструменты разработчика в браузере · Система контроля версий · Макет в редакторе интерфейсов · Сервис проверки скорости
Чистая вёрстка — вход, а не финиш. Через два-три года становится видно: одни остаются на потоке однотипных страниц и растут только по скорости, другие уходят в смежное и начинают брать задачи целиком.
Есть два естественных направления. Первое — в программирование: вы начинаете писать логику на стороне браузера и сервера, и это уже разработчик с полным набором навыков. Второе — в интерфейсы: разбираться, почему человек не понимает страницу, и влиять на решения, а не только на их исполнение.
Общее правило простое: доход растёт не от того, сколько страниц вы сверстали, а от того, сколько ответственности берёте. Верстальщик, который сам предложил, где поправить макет, чтобы не сломалось на телефоне, ценнее того, кто молча исполнил.
Это база: без неё дальше не двинуться. Учитесь не на видео, а на живых страницах — открывайте чужие сайты и разбирайте, как они собраны.
Возьмите бесплатный макет из открытого источника и соберите его целиком. Смотреть будут не на красоту, а на поведение при узком экране и на аккуратность.
Проверьте страницу с клавиатуры без мыши и посмотрите, сколько она весит. Эти два навыка отличают верстальщика, которого берут, от того, кто «умеет в HTML».
Одна работа, где вы сами решили, как всё устроено, показывает больше, чем десять свёрстанных по чужому макету. Здесь видно, как вы думаете.
Заранее решите, куда растёте: в программирование или в интерфейсы. Верстальщик без плана через два года упирается в потолок и не понимает, почему.
Первые месяцы уходят на разметку, стили и главный навык — приводить страницу в порядок на разных экранах. Это осваивается быстрее, чем программирование: через три-четыре месяца можно брать первые небольшие задачи.
Дальше появляется портфолио: две-три страницы, свёрстанные по чужому макету, и одна, придуманная самостоятельно. Смотреть будут не на красоту, а на то, как ведёт себя страница при узком экране.
Первая работа обычно приходит через агентства и небольшие студии, где нужен человек на поток задач. Это нормальный вход: там есть кому подсказать и есть на чём набить руку.
К концу года становится видно, растёте вы или стоите. Растёт тот, кто начал разбираться в смежном: логике, доступности, поведении интерфейса.
С программистом. Программист отвечает за логику и данные, верстальщик — за видимую часть. На небольших проектах это часто один человек, но задачи разные, и на собеседовании спрашивают разное.
С дизайнером. Дизайнер решает, как будет устроено и выглядеть; верстальщик это собирает и отвечает за то, чтобы замысел не сломался в браузере.
С тем, кто «просто пишет код страницы». Современная вёрстка — это ещё и доступность, производительность, поведение при медленной связи. Если этого нет, страница технически открывается, но пользоваться ей неудобно.
Пройдите тест из шести вопросов о том, чем вам интересно заниматься и сколько времени вы готовы учиться. В конце — три профессии справочника, которые подходят под ваши ответы. Бесплатно, без регистрации и без контактов.
Пройти тест за 2 минутыБлизко, но не то же самое. Верстальщик пишет код, который описывает вид, а не логику. Программирование начинается там, где появляются данные, условия и взаимодействие с сервером.
Да, это самый доступный вход в разработку. Но и конкуренция здесь выросла: на младшие позиции приходят люди с курсами, поэтому выигрывают те, у кого есть свёрстанные работы.
Базово — три-четыре месяца до первых задач. До уровня, на котором уверенно берут в команду, обычно полгода и больше, и всё это время нужно что-то верстать своими руками.
Простые страницы уже собираются автоматически, и это снизило цены на типовые макеты. Дороже стали цениться те, кто разбирается в доступности, производительности и в том, как устроены компоненты.
В программирование — писать логику на стороне браузера и сервера. Или в интерфейсы — разбираться, почему человек не понимает страницу, и влиять на решения, а не только исполнять их.
Пишет код, который решает задачу: от небольшого сервиса до системы, которой пользуются миллионы.
На старте: 60 000 – 90 000 ₽ДизайнДелает визуал: баннеры, карточки товаров, оформление соцсетей, макеты для печати и презентации.
На старте: 30 000 – 55 000 ₽Разработка и тестированиеИщет, где сломается: проверяет программы до того, как их увидят пользователи.
На старте: 50 000 – 80 000 ₽