Хто такий насправді верстальник і чим він займається. Міфи і реальність

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

Цю статтю ми спробували написати удвох. Ми — це Наталія Строкова і Лариса Бєлова, Frontend-розробниці компанії HOSTiQ. Але до того як стати фронтендерами, ми обидві багато років працювали верстальницями. Важко пригадати, скільки разів нас вітали з днем програміста чи дизайнера, бо люди не розуміли, чим саме ми займаємось.

Тож настав час пояснити, хто такі верстальники, розвіяти деякі міфи щодо верстки та, можливо, заохотити новачків приєднатися до нашої професійної спільноти (одразу попереджаємо: дня верстальника не існує).

Так що саме робить верстальник? Він бере макет сторінки сайту — умовно кажучи, картинку, яку підготував дизайнер у відповідній програмі — та, дивлячись на макет, пише деякий код. І коли файлик з цим кодом відкриваєш в браузері — ти бачиш справжню сторінку, якою її задумав дизайнер.

Однак для того, аби зверстана сторінка стала частиною сайту, далі потрібно залучати до процесу Frontend- чи Backend-розробника (кого саме — залежить від архітектури сайту).

Внесемо ясність: верстальник лише робить з макета статичну HTML-сторінку. Frontend-розробник може також зверстати сторінку самостійно, а може використати готову верстку. Далі Frontend-розробник «оживляє» інтерактивні елементи та наповнює сторінку реальними даними з баз даних або сторонніх ресурсів.

У своїй роботі верстальник користується двома мовами написання коду — HTML та CSS.

HTML (HyperText Markup Language, мова розмітки гіпертексту) — задає структуру сторінки. Це робиться за допомогою так званих тегів — певних послідовностей символів, у які обертаються відповідні частини тексту. І коли браузер читає код сторінки, він розуміє, що оце — заголовок, тут — маркований список, а там — таблиця.

А як саме ці елементи виглядатимуть, описує CSS (Cascading Style Sheets, каскадні таблиці стилів). Він регулює кольори тексту та фону, шрифти, розміри, положення та поведінку елементів один відносно одного та багато іншого.

Інколи новачки називають HTML та CSS мовами програмування. Але це не так. Тут ми зіткнулися з одним із міфів або помилкових вражень, які існують навколо професії верстальника. Нижче ми хотіли б розглянути деякі з них ширше.

Міф № 1: опанувати професію верстальника можна швидко й самому

Як і в інших галузях IT, серед верстальників багато світчерів — тобто людей, які прийшли в IT з інших професій. Але саме серед верстальників більшість тих, хто починав опановувати професію самостійно.

Ми — також світчери і вивчали HTML та CSS за книжками та онлайн-уроками. Це було дійсно нескладно, тому можна погодитись із тим, що здобути базові знання і з ними одразу спробувати увійти в професію — цілком можливо.

Але може пройти певний час від поодиноких замовлень на фрилансі до першого оферу. Щоб отримати роботу верстальника, зазвичай недостатньо просто передивитися відео на YouTube або прочитати корисні статті. Насправді базові знання HTML та CSS є необхідною вимогою для всіх фахівців з веброзробки, тож наявність цих базових знань ще не означає, що ви є верстальником та вмієте верстати. Потрібні системні знання з HTML та CSS — можливо, навіть отримані на професійних курсах. А ще багато чого.

Спираючись на вимоги до кандидатів на позицію верстальника, спробуємо перелічити, в чому саме треба розбиратися та з чим, можливо, доведеться працювати:

• векторні та растрові графічні редактори (наприклад, Photoshop та Figma);
• CSS-препроцесори;
• CSS-фреймворки;
• CSS-методології;
• SVG;
• адаптивна верстка;
• семантична верстка;
• CSS-анімація;
• JavaScript на рівні користувача;
• популярні CMS — наприклад, Wordpress (вміти застосувати дизайн до сайту на WP);
• системи контролю версій (наприклад, Git).

І, як все в IT, інструменти верстальника постійно розвиваються, кожен день зʼявляється щось нове, тому вчитися доведеться усе своє професійне життя — постійно бігти, щоб залишатися на своєму місці.

Міф № 2: верстальник — це «недороблений» Frontend-розробник

Професії верстальника та фронтенд-розробника частково перетинаються, але кожна з них має свої особливості та вимагає специфічних здібностей та знань.

Звісно, верстка може стати сходинкою на шляху до професії Frontend-розробника. Але професія верстальника має цінність сама по собі. Щоб стати справжнім верстальником, треба розумітися не лише на технологіях та інструментах, перелічених вище.

Потрібно усвідомлювати, що верстка — це про гармонію, про зручність та якісне донесення до користувача ідеї, яку закладено замовником сторінки. Треба відчувати, що вебсторінка — жива істота, яка існуватиме самостійно і може жити своїм життям ще багато років після того, як ви її зверстаєте. Може додатися новий текст, може появитися чи зникнути якийсь розділ, але все одно сторінка повинна залишитись гармонійною та зручною на будь-якому пристрої. І все це не обовʼязково вміє фронтендер — особливо, якщо він прийшов у професію не через верстку.

Тож, хоча професія Frontend-розробника передбачає багато технічних знань та навичок, яких не буде у верстальника, треба усвідомлювати, що коли в оголошенні написано, «шукаємо верстальника-фронтендера», це означає, що потрібна людина, яка опанувала дві суміжні, але окремі професії.

Міф № 3: верстання — одноманітна та абсолютно не творча робота

Відразу скажемо: щоб бути верстальником, треба мати певний особливий склад характеру та певні риси.

Точно потрібні уважність та скрупульозність. А також готовність до того, що іноді робота може бути дійсно одноманітною. Чимось це схоже на рукоділля — є люди, які обожнюють в’язати, вишивати чи складати оригамі, а є ті, кого ці заняття не лише не заспокоюють, а навіть дратують.

Як приклад можемо навести проєкт українізації нашого сайту, який ми провели декілька років тому і у якому було багато роботи верстальників, що можна назвати одноманітною. Була задача створити двомовний сайт, і особливості поточної архітектури сайту змусили нас зробити копії близько сотні шаблонів сторінок та вручну замінити усі тексти з російських на українські.

Але ніяк не можна погодитись, що робота верстальника не є творчою. Наразі існує величезна кількість інструментів, якими ми користуємося. І вибір оптимального інструменту або підходу до розв’язання конкретної задачі — сам собою вже є творчістю. Але навіть в рамках одного підходу чи набору інструментів у двох розробників вийде різний код — як у двох господинь за одним рецептом вийдуть два різні борщі.

Міф № 4: хороша англійська не є обов’язковою

Англійська вочевидь потрібна, якщо команда, в якій ви працюєте, англомовна або компанія працює з англомовними замовниками.

Втім навіть у випадку, коли у повсякденній роботі вам не треба спілкуватися англійською, вона все одно знадобиться. Адже англійською написані усі специфікації HTML, CSS тощо. Документацію до плагінів чи фреймворків також варто читати англійською — бо скоріше за все ви або не знайдете перекладу взагалі, або переклад буде неточним чи застарілим.

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

Міф № 5: на ринку для верстальників немає роботи

Як ми зазначали вище, часто на ресурсах для пошуку роботи шукають 2-в-1: верстальника + Frontend-розробника.

За нашими спостереженнями протягом тижня в лютому на одному з сайтів для пошуку роботи на 60 вакансій Frontend припадало близько 16 вакансій верстальника. Однак це не привід стверджувати, що для верстальників не знайдеться роботи.

По-перше, треба зазначити, що термін «Frontend-розробник» поєднує в собі весь спектр фахівців, що спеціалізуються на різних фронтенд-фреймворках. Це може бути Vue.js, Angular, React тощо. І якщо ви є спеціалістом з Vue.js, а компанія шукає фахівця у проєкт на Angular — це оголошення вам не підійде (або треба швидко починати вчити Angular). Тож, різниця у кількості вакансій для конкретного спеціаліста вже виявляється не такою великою.

По-друге, верстальники також бувають різними — робота з WordPress та з e-mail розсилками дуже сильно відрізняються одна від одної, тут також варто знати специфіку.

Тому можна сказати, що свою нішу має можливість знайти кожен — як Frontend, так і верстальник.

Поради замість висновків

Ми ще багато чого могли б розповісти про верстання, але замість цього дамо головні поради для тих, хто розглядає цю IT-зайнятість як свою майбутню професію:

1. Систематизуйте знання. Ходіть на професійні курси, вчіться у верстальників-практиків. Але не зволікайте з пошуком реальної роботи, навіть якщо ви не впевнені, що знаєте достатньо. Не можна заздалегідь вивчити все. Більшість знань та вмінь приходить саме під час виконання конкретних реальних задач — тільки так ми набуваємо досвід і стаємо справжніми професіоналами.
2. Любіть свою роботу. Верстання — це магія або поезія. Це професія, яка може приносити справжнє задоволення, якщо ви правильно її собі обрали. Не через те, що тут буцімто низький поріг входу, а тому, що ви справді обожнюєте оті всі псевдоелементи, флексбокси, гріди й транзішени. І кайфуєте, коли під вашими руками звичайні літери починають жити — саме так, як начарували ви. Без любові нічого не вийде.