Вебдизайн правопис: разом, без зайвого дефіса

Дефіс у слові «веб-дизайн» тримався в українських студіях, вакансіях і дипломах майже два десятиліття — як звичка з англійського web design і з російської кальки. Від 30 травня 2019 року ця риска офіційно зайва: чинна редакція «Українського правопису» віднесла частку веб- до іншомовних компонентів на кшталт авто- чи авіа- і наказала писати такі слова разом. Правильна форма — вебдизайн, одним суцільним словом, без пробілу і без дефіса.

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

Помилка тут не косметична. Рекрутер читає резюме за 20–30 секунд, викладач перевіряє курсову за формулюваннями, клієнт порівнює комерційну пропозицію з мовою власного бренду. Злите написання сигналізує, що людина стежить за нормою; дефіс 2000-х років сигналізує протилежне, навіть коли макети в Figma бездоганні.

Норма 2019 року: частка «веб-» стала префіксоїдом

22 травня 2019 року Кабінет Міністрів України схвалив нову редакцію правопису постановою № 437, а 30 травня документ набрав чинності. Друковане офіційне видання вийшло наприкінці того ж року у видавництві «Наукова думка» — саме воно, а не ранній PDF на сайті міністерства, є еталоном у спірних дрібницях. Підготувала текст Українська національна комісія з питань правопису; це не «рекомендація блогерів», а державний стандарт орфографії. У розділі про складні слова з іншомовними компонентами частку веб- поставили в один ряд з авто-, авіа-, аудіо-, кібер-, смарт- і десятками подібних.

Лінгвісти називають такі частини префіксоїдами: вони вже не самостійні слова в українській мові, а регулярні «приставки» з чужої лексики. Англійське web у значенні «павутина Всесвітньої мережі» в українському слововжитку самостійно майже не живе — ми не кажемо «відкрий веб», як кажемо «відкрий сайт». Тому правопис і прибрав дефіс: немає двох повноцінних слів, які треба клеїти рискою. Офіційні приклади в тексті норми — вебсторінка, вебадреса, вебдизайнер. Від них логічно, без жодного стрибка, утворюється й вебдизайн.

Правильна форма за чинним правописом — вебдизайн: разом, без дефіса і без пробілу, за тією ж моделлю, що автосалон чи кібербезпека.

Чому тоді око досі чіпляється за риску? У 1990-х і 2000-х інтернет-лексика входила в українську хаотично: через російські форуми, через англійські підручники, через автоматичний переклад Photoshop. Правопис 1993 року просто не встиг описати ці слова, тож кожна редакція вигадувала собі дефіс «на око». Звичка виявилася чіпкішою за постанову уряду: її досі підживлюють застарілі словникові картки і шаблони вакансій, скопійовані з 2016 року. Норма тим часом не змінювалася — і станом на 2026 рік лишається тією самою.

За моїм досвідом редактури студійних текстів протягом кількох років, дефіс зникає не після лекції, а після того, як його один раз вичистять у шаблоні комерційної пропозиції, у футері сайту і в полі «посада» на DOU. Далі рука вже сама пише разом. Правопис тут працює як сітка в інтерфейсі: спочатку дратує, потім стає невидимим каркасом, без якого верстка «їде».

Чому вебдизайн разом, а інтернет-магазин — через дефіс

Найчастіша плутанина в брифах звучить так: «якщо вебсайт разом, то чому інтернет-магазин з рискою? Це ж майже синоніми». Ні, не синоніми, і правило тут інше. Інтернет — повноцінний іменник, який вільно живе окремо: «інтернет зник», «через інтернет», «швидкість інтернету». Коли два самостійні іменники складають назву предмета, правопис ставить дефіс: інтернет-магазин, інтернет-банкінг, інтернет-видання, інтернет-послуга. Відмінюється лише друга частина: немає «інтернету-магазину», є «інтернет-магазину».

Частка веб- самостійним іменником в українській не стала. Вона позначає «той, що стосується World Wide Web», тобто конкретного шару мережі з HTML, браузерами й гіперпосиланнями. Інтернет ширший: туди входять і пошта, і FTP, і старі телеконференції, яких «веб» ніколи не описував. Тому вебсайт — це сторінка саме у вебі, а інтернет-сайт — ширша, трохи канцелярська назва з дефісом. У живій мові студії перший варіант точніший і коротший, другий лишається для документів, де треба підкреслити «будь-який ресурс у мережі», а не обов’язково HTML-сторінку.

Ця пара — найкращий тренажер для ока дизайнера. Побачили «веб» перед звичайним словом — пишете разом. Побачили «інтернет» перед іншим іменником — ставите дефіс. Побачили «онлайн» перед іменником — теж дефіс, але з іншої причини, про неї нижче. Три різні механізми, три різні риски, і жоден не копіюється з англійської «через дефіс, бо так у Figma-спільноті». Мова має власну граматику, навіть коли кнопка підписана Get started.

У нашій практиці ми стикалися з таким випадком, коли в одному тендері на лендінг банк вимагав «вебдизайн інтернет-банкінгу». Копірайтер автоматично поставив дефіси скрізь і отримав «веб-дизайн інтернет банкінгу» — дві помилки в чотирьох словах. Після правки фраза стала і грамотною, і точнішою: вебдизайн як дисципліна, інтернет-банкінг як продукт. Клієнт навіть не відзначив орфографію окремо, проте текст перестав виглядати перекладеним «на коліні».

Словничок студії: разом, через дефіс, окремо

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

На другій полиці — дефісні складення, де обидві частини тягнуть власне значення. Інтернет-магазин, інтернет-проєкт, піар-кампанія, бізнес-логіка, преміум-тариф у значенні «клас + іменник», онлайн-курс, офлайн-зустріч, UI-дизайн, UX-дослідження, веб-API. Тут риска — не прикраса, а роздільник двох понять. На третій полиці — окреме написання: адаптивний дизайн, графічний дизайн, посадкова сторінка, користувацький інтерфейс, пошукова оптимізація. Прикметник + іменник дефіса не хочуть, хоч би як рука тягнулася до «адаптивний-дизайн» за аналогією з англійським adaptive-design у тегах.

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

Джерело таблиці: офіційне видання «Український правопис» (видавництво «Наукова думка», 2019) та постанова Кабінету Міністрів України № 437 від 22 травня 2019 року. Після таблиці варто тримати ще одну звичку: не змішувати в одному документі «вебсайт» і «веб-сайт», навіть якщо друга форма «так історично склалося в старому логотипі». Узгодженість у тексті — той самий принцип, що й єдина сітка відступів у макеті.

Відмінюємо без паніки: вебдизайну, вебдизайнера, на вебсайті

Написати слово разом — лише половина роботи. Друга половина — не зламати відмінок у фразі «досвід у вебдизайні» чи «макети для вебсайту». Вебдизайн — іменник чоловічого роду другої відміни, неістота, абстрактна назва галузі. У родовому відмінку він має закінчення -у: немає досвіду вебдизайна, є досвід вебдизайну. Так само «школа вебдизайну», «тренди вебдизайну», «історія вебдизайну». У місцевому — «у вебдизайні», в орудному — «вебдизайном».

Вебдизайнер — істота, тож відмінки інші, і знахідний збігається з родовим: шукаємо вебдизайнера, дякуємо вебдизайнерові або вебдизайнеру, говоримо з вебдизайнером. Жіноча форма вебдизайнерка уже звична в українських вакансіях і цілком нормативна; відмінюється як «дизайнерка». Не варто вигадувати «вебдизайнерша» — це розмовний суфікс, який у професійному тексті звучить так само незграбно, як кнопка «тицьни сюди» на банківському лендінгу.

Вебсайт у родовому найчастіше має форму вебсайту: розробка вебсайту, редизайн вебсайту, структура вебсайту. Паралель вебсайта трапляється за аналогією до конкретних предметів, проте в професійній прозі перемагає -у, як у словах «процесу», «інтерфейсу», «сервісу». Множина проста: вебсайти, вебсайтів, вебсайтам, на вебсайтах. Кличний «вебсайте» існує граматично, але в житті його майже не кличуть — на відміну від «колего».

Після таблиці тримайте ще одну дрібницю: не відмінюйте англійські вставки всередині українського речення. «Досвід у Figma» лишається «у Figma», а не «у Фігмі», якщо бренд ви свідомо тримаєте латиницею. Якщо ж пишете українською транскрипцією — тоді вже «у Фігмі», «через фігму», послідовно в усьому документі. Змішувати «відкрий Figma-файл у фігмі» — це як керувати сіткою то в 8 px, то в 7.

UI-дизайн, UX-дизайн і веб-API: коли риска таки потрібна

Правопис, який прибрав дефіс у вебдизайні, одразу повернув його в іншому місці: коли іншомовний компонент стикається з власною назвою або абревіатурою. Офіційний приклад — веб-API. Літери API не стають українським словом, вони лишаються скороченням, і риска тут працює як місток між двома письмовими системами. За тією ж логікою пишемо UI-дизайн, UX-дизайн, UX-дослідження, UI-kit, HTML-верстка, CSS-анімація, CRM-система. Злите «UIдизайн» не читається, окреме «UI дизайн» розвалюється на два шматки без зв’язку.

Слеш у «UI/UX-дизайн» — окрема історія, уже не орфографічна, а типографічна. У вакансіях він означає «обидва напрями в одній ролі», і це прийнятний компроміс, якщо далі йде дефіс перед українським словом: UI/UX-дизайнер. Гірший варіант — «UI/UX дизайн» без риски: око не розуміє, до чого приклеєне слово «дизайн». Ще гірший — «ui ux дизайнер» малими літерами без дефісів, ніби це три теги з Dribbble, а не назва посади. У портфоліо я б ставив «UI/UX-дизайнер» або розшифровував: «дизайнер інтерфейсів і користувацького досвіду».

Українські відповідники ніхто не скасовував, і в текстах для широкої аудиторії вони часто чесніші. UI — це інтерфейс користувача, UX — користувацький досвід, іноді «дизайн взаємодії». «Вебдоступність» можна замінити на «доступність вебсайту», «юзабіліті» — на «зручність користування», «лендінг» — на «посадкову сторінку». У внутрішньому сленгу студії англіцизми живуть, і хай живуть; у клієнтському договорі й на головній сторінці сайту державної установи вони вже виглядають як шрифт Comic Sans у річному звіті.

Не плутайте дефіс орфографічний із дефісом у назві файлу. web-design-final-v3.fig може лишатися латиницею зі рисками — це ідентифікатор, не українське слово. Інша справа заголовок слайда в презентації для замовника: там уже «Концепція вебдизайну», а не «Web-design concept v3». Два світи, два правила, і межа між ними проходить там, де текст читає людина, а не компілятор.

Онлайн, офлайн, лендінг і інші сусіди з портфоліо

Слово онлайн правопис 2019 року прямо не розписав, і це породило цілий жанр суперечок у фейсбук-групах філологів. Консенсус мовознавців, зокрема Олександра Авраменка, простий і зручний для студії. Окремо слово пишемо разом, бо ні «он», ні «лайн» в українській самостійно не живуть: «ми зараз онлайн», «перейти в онлайн». З наступним іменником з’являється дефіс: онлайн-курс, онлайн-трансляція, онлайн-магазин, онлайн-брифінг. Якщо «онлайн» стоїть після іменника, риска не потрібна: трансляція онлайн, режим онлайн, заняття онлайн.

Дзеркально працює офлайн: офлайн-зустріч, офлайн-воркшоп, але «зустріч офлайн». Писати «он-лайн» із внутрішнім дефісом — уже архаїка нульових, той самий жест, що «Інтернет» з великої літери посеред речення. Імейл в офіційному виданні «Наукової думки» в родовому відмінку має форму імейлу; «е-мейл» і «е-mail» у суцільному українському тексті виглядають як незведені стилі абзацу. «Електронна пошта» лишається найнейтральнішим варіантом для договорів.

Лендінг, вайрфрейм, мудборд, хендоф — це вже не правопис префіксоїдів, а питання, чи беремо англіцизм взагалі. Лендінг (від landing page) у професійній прозі прижився; літературний відповідник — посадкова сторінка. Вайрфрейм спокійно замінюється на «каркас» або «схематичний макет». Проєкт за правописом 2019-го пишемо через є, не через е: «проєкт вебсайту», «проєктна документація». Оця літера — лакмус: людина, яка пише «проект» у 2026 році, швидше за все, автоматично поставить і дефіс у «веб-дизайн».

Браузер у правописі має цікаву вилку. Поруч із звичним браузер як варіант згадують бравзер (і навіть веббравзер) — за правилом передавання іноземного w через в. У щоденній студійній мові перемагає «браузер» і «веббраузер»; «вебпереглядач» звучить кальковано-правильно, як «світлина» замість «фото», і пасує радше підручнику, ніж чату в Slack. Обидва злиті варіанти з веб нормативні. Окреме «веб браузер» — ні.

Ютуб, фейсбук, фігма: велика літера в назвах сервісів

Дизайнер постійно згадує сервіси, і тут правопис дав три сценарії, а не один. Без родового слова назви сайтів і мереж пишемо з малої: ютуб, фейсбук, гугл, твіттер. «Шукай на ютубі», «виклала кейс у фейсбуку». З родовим словом — велика літера і лапки: мережа «Фейсбук», енциклопедія «Вікіпедія», пошуковик «Гугл». Як назву юридичної особи — з великої, без лапок: «санкції проти Яндекса», «позов до Мета». Три кнопки, три стани, як у нормального інтерфейсу.

Офіційне видання «Наукової думки» для родового відмінка сервісів закріпило закінчення -у: ютубу, фейсбуку, імейлу. Ранній текст на сайті міністерства давав -а (ютуба, фейсбука), і ця розбіжність досі блукає в блогах. Орієнтир — друкована книжка правопису, не скріншот 2019 року з Facebook. Наголос у «фейсбук» словник офіційного видання подає на обох складах як допустимі варіанти, тож війни за «фейсбýк» versus «фéйсбук» можна не вести на дізайн-критиці.

Бренди інструментів — Figma, Adobe, Notion, Webflow — у портфоліо найчастіше лишають латиницею. Це чесно щодо торговельної марки і зручно для пошуку. Якщо вже транскрибуєте, тримайте одну систему: Фігма, едоб, ноушен. «Фігма» з великої як назва програми, «фігма-файл» із дефісом як розмовне складення за моделлю «API + слово». У реченні «макет зроблено в Figma» латиниця не вимагає лапок. У реченні «курс «Figma для початківців»» лапки вже маркують назву курсу, а не програми.

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

Де помилка б’є по репутації: резюме, вакансія, бриф

У макеті кернінг у 10 pt ніхто крім дизайнера не помітить. У тексті вакансії дефіс у «веб-дизайнер» помітить кожен, хто вчив новий правопис у школі або готувався до НМТ. Молодша аудиторія вже пише разом «з коробки»; старша частина ринку — ні. Тому оголошення «Шукаємо веб-дизайнера на веб-сайт інтернет магазину» читається як колаж із трьох епох орфографії. Рекрутинг у креативі — це теж інтерфейс. Ламаний інтерфейс відсіює тих, кого ви якраз хотіли найняти.

Резюме грішить іншою хворобою: сумішшю латиниці, кирилиці й капслоку. «WEB DESIGNER / Веб-Дизайнер / UI UX» в одному рядку виглядає не як мультилингвальність, а як незведені стилі. Оберіть одну головну мову документа. Українською це: «Вебдизайнер, UI/UX-дизайнер». Англійською окремий файл: «Web designer». Не зшивайте їх через слеш у шапці, наче це два кольори в одному логотипі без гайдлайну. У блоці навичок пишіть «вебдизайн, прототипування, адаптивна верстка», а не «web-дизайн, прототипирование».

Бриф і договір — третя міна. Юристи люблять кальки, дизайнери люблять сленг, і посередині народжується «об’єкт веб-дизайну інтернет сайту Замовника». Вичитка тут — частина послуги, не дрібниця. Замініть на «об’єкт: вебдизайн і верстка вебсайту Замовника». Коротше, чистіше, без трьох орфографічних дірок. Якщо клієнт у своєму брендбуці досі тримає «Веб-Сайт» як торговельне написання, зафіксуйте це як виняток для логотипа, а не як правило для всіх текстів проєкту.

Навчальні роботи й дипломи перевіряють прискіпливіше за лендінг кав’ярні. Викладач, який ставить «незадовільно» за «проект» через е, так само вправі зняти бал за «веб-дизайн». Для НМТ і університетських курсів орієнтир один: чинна редакція 2019 року. Вікіпедія українською вже кілька років веде статтю під назвою «Вебдизайн» і послідовно вживає вебсайт, вебсторінка, веброзробка, вебпрограміст — зручний живий зразок, не ідеальний у всьому, але чесний щодо злитого написання.

Словники відстають, вакансії ще ні — як не зірватися

Відкриваєте slovnyk.ua чи «Горох» на запит «веб-дизайн» — і бачите дефіс у шапці відмінювання. Рука слабшає: «ну от, словник же». Багато картотек досі тягнуть леми з корпусів 2000-х і не переписали заголовок статті. Це не нова норма, це інерція бази. Надійніше звірятися з текстом правопису і з академічними роз’ясненнями, де прямо стоять вебсторінка, вебадреса, вебдизайнер. Якщо словник суперечить правопису — перемагає правопис. Словник підтягнеться, як підтягується застарілий UI-kit після редизайну.

Автоперевірка в Google Docs, Microsoft Word і навіть деякі українські розширення теж можуть підкреслити «вебдизайн» як помилку. Це не вирок, це словник перевірки, зібраний учора. Додайте слово до власного словника раз — і червона хвиля зникне. Гірше, коли перевірка мовчки ковтає «веб-дизайн» як правильне: тоді помилка маскується під «так захотів редактор». Тому на критичних текстах я тримаю короткий власний гайдлайн студії на одну сторінку, а не покладаюся на хвилясте підкреслення.

Медіа теж розколоті. Одні редакції вже в 2024–2025 роках пояснювали «вебсайт разом, інтернет-магазин через дефіс» на перших шпальтах. Інші досі виносять у заголовок «веб-дизайн» і навіть не через принциповість, а через старий шаблон CMS. Читати пресу як оракул орфографії не варто. Читати пресу як дзеркало звички — варто: ви бачите, наскільки ринок ще не переїхав, і можете виїхати раніше. У дизайні рання норма — це конкурентна перевага, не педантизм.

Є ще політичний шар, тонкий, але живий. Після 2022 року українська в інтерфейсах і в робочих чатах стала питанням гідності, а не лише «локалізації для UA». Писати за чинним правописом у цій атмосфері — елементарна гігієна продукту. Це не пафос. Це той самий жест, що контраст 4.5:1 у тексті: ніхто не аплодує, доки його немає, і всі помічають, коли він зникає.

Питання, які мені ставлять на курсах і в чатах

Вебдизайн чи веб-дизайн — як правильно в 2026 році? Правильно разом: вебдизайн. Дефісна форма — спадщина старих словників і сусідніх мов, вона більше не відповідає чинній редакції правопису. У заголовку вакансії, у дипломі й на візитівці ставте злитий варіант.

Чому тоді «інтернет-магазин» пишеться через дефіс? Бо інтернет — самостійний іменник, а веб у складі цих слів — ні. Два повноцінні іменники клеїмо рискою; префіксоїд із другим коренем пишемо разом. Це різні правила, а не виняток «для інтернету».

Як писати UI UX у назві посади? Найчистіше — UI/UX-дизайнер або окремо UI-дизайнер і UX-дизайнер. Абревіатура вимагає дефіса перед українським словом. Варіант без риски «UI UX дизайнер» виглядає як набір тегів, а не як назва фаху.

Чи можна в резюме лишити англійське web design? У англомовному файлі — так, це нормальна англійська, два слова без дефіса. В українському файлі латиниця в шапці допустима як дубль, але основна назва фаху має бути українською: вебдизайнер. Не мішайте «web-дизайнер» через дефіс і дві абетки.

Словник підкреслює «вебсайт» як помилку. Кому вірити? Правопису. Багато електронних словників ще не оновили заголовки статей. Додайте слово до власного словника перевірки і звіряйтеся з офіційним виданням «Наукової думки» 2019 року, а не з хвилястим підкресленням у Docs.

Вебдизайнерка — це нормально? Так. Жіночі назви професій в українській нормативні й усе частіше стоять у вакансіях. Відмінюйте як звичайний іменник на -ка: вебдизайнерки, вебдизайнерці, з вебдизайнеркою.

Поради з майстерні редактора

• Заведіть у студії односторінковий глосарій із п’ятьма стовпцями: термін, правильно, неправильно, приклад речення, де вживаємо. Новачок закриває 80 % сумнівів за хвилину, не тегаючи копірайтера в Slack опівночі.
• Вичищайте дефіс не «взагалі», а пакетом: шаблон КП, футер сайту, сторінка «Про нас», поля ATS, банери вакансій, підписи в LinkedIn. Одна пропущена сторінка знову розносить стару форму по інтернету.
• У Figma-макетах українські рядки перевіряйте так само, як контраст: окремим проходом перед хендофом. Кнопка «Замовити веб-дизайн» на герої — це вже не орфографія в документі, це баг інтерфейсу.
• Для клієнтських текстів тримайте запас українських відповідників: посадкова сторінка, зручність користування, користувацький інтерфейс, вебсайт. Англіцизм лишайте там, де без нього втрачається точність для фахової аудиторії.
• Не бійтеся жіночих форм і не вигадуйте жаргонних. Вебдизайнерка, проєктна менеджерка, ілюстраторка — це норма, а не «політика». «Дизайнерша» в комерційній пропозиції — уже тон, який зіпсує навіть ідеальний кернінг.

Поширені помилки, за які потім соромно в портфоліо

Нижче — не абстрактний «топ гріхів», а формулювання, які реально вилазять у брифах, на Дрибблі в підписах і в резюме. Кожна має причину, чому так робити не варто.

• Веб-дизайн через дефіс. Виглядає «як завжди», але суперечить чинній нормі. Рекрутер, який сам писав НМТ, зчитує це як неувагу до деталей — найгірший комплімент для людини, чия робота і є увага до деталей.
• Веб дизайн окремо, з пробілом. Це вже не орфографія складного слова, а розвал на два. У заголовку H1 такий пробіл працює як дірка в сітці: око спотикається, сенс «галузь» розчиняється.
• Веб-Дизайн із двох великих. Англійський Title Case, перенесений на українське слово. У нас заголовки не капітелять кожен корінь. Пишемо «Вебдизайн» на початку речення і «вебдизайн» у середині.
• Web-дизайн через дві абетки. Гібрид «для міжнародності» читається як недороблений переклад. Або повністю англійською, або повністю українською.
• Інтернет магазин без дефіса. Тут риска якраз потрібна. Прибравши її «за аналогією до вебсайту», ви застосували правильне правило не до того слова.
• Он-лайн із внутрішнім дефісом і онлайнкурс разом. Перше застаріло, друге зліпило два різні слова. Тримайте: онлайн; онлайн-курс; курс онлайн.
• Проект через е. Правопис 2019-го дав проєкт. У парі з «веб-дизайн» це видає текст, який ніхто не вичитував після 2018 року.
• Юзабіліті-тест без потреби в тексті для бабусі з аптеки. Англіцизм не помилка в фаховому звіті, але в інтерфейсі державної послуги він ставить бар’єр. Там краще «перевірка зручності».

Ці помилки рідко живуть по одній. Здебільшого вони ходять зграєю: дефіс, «проект», «он-лайн» і капслок у «UI UX». Виправте одну — і рука вже бачить решту, як після того, як вирівняли перший текстовий блок і раптом помітили, що всі відступи «дихають» криво.

Чек-лист перед публікацією тексту про вебдизайн

Пройдіться цим списком перед тим, як віддавати лендінг, вакансію чи кейс. Це швидший аудит, ніж повна вичитка, і він ловить 9 із 10 орфографічних дірок саме в цій темі.

1. Усі слова з часткою веб перед звичайним коренем написані разом: вебдизайн, вебдизайнер, вебсайт, вебсторінка, веброзробка, вебзастосунок.
2. Слова з інтернет + іменник мають дефіс: інтернет-магазин, інтернет-банкінг, інтернет-проєкт.
3. Онлайн і офлайн самі по собі разом; перед іменником — дефіс; після іменника — окремо, без риски.
4. Абревіатури стикуються через дефіс: UI-дизайн, UX-дослідження, веб-API, HTML-верстка.
5. Відмінки на місці: вебдизайну, вебдизайнера, на вебсайті, у веброзробці. Немає «вебдизайна» і «веб дизайнеру».
6. У документі одна система: або «Figma» латиницею скрізь, або «Фігма» скрізь. Назви сервісів без родового слова — з малої, якщо ви їх українізуєте: ютуб, фейсбук.
7. «Проєкт» через є, «інтернет» з малої всередині речення, немає «он-лайн» і «е-мейл».
8. Немає суміші «вебсайт» у першому абзаці і «веб-сайт» у третьому. Узгодженість важливіша за ідеальний виняток.

Якщо хоч один пункт червоний — не публікуйте «потім виправимо». У вебі «потім» означає скріншоти в чужих презентаціях і кеш Google. Виправте зараз, як виправляєте баг з наїздом кнопки на безпечну зону iPhone перед релізом.

Міні-кейс: як дефіс ледь не коштував студії тендер

У нашій практиці ми стикалися з таким випадком, коли продуктова студія з Києва подавалася на редизайн кабінету міської послуги. Комерційну пропозицію збирали вночі з старого шаблону 2017 року. На обкладинці стояло «Концепція веб-дизайну», у змісті — «веб дизайн кабінету», у кошторисі — «web-дизайн, 4 екрани». Три форми одного слова на восьми сторінках. Тендерна комісія формально оцінювала досвід і кошторис, але в письмовому зворотному зв’язку після поразки з’явилася фраза, яку менеджерка потім переказувала з очима в підлогу: «документація справляла враження недбалої».

Ми тоді сіли не з «уроком української», а з тим самим аудитом, що й для UI: знайти всі інстанси компонента і замінити майстер-компонент. Шаблон КП, шаблон договору, підписи в листах, сторінка команди, 12 відкритих вакансій. Після цього нова пропозиція для іншого міста вже мала «вебдизайн кабінету послуги», «4 екрани вебсайту», «UX-дослідження». Тендер виграли. Ніхто в комісії не написав «дякуємо за злите написання». Просто текст перестав виглядати зібраним із трьох чорновиків. Іноді орфографія — це лише охайний автолейаут для слів.

Ключові інсайти

• Чинна норма з 30 травня 2019 року: частка веб- у складних словах пишеться разом, тож правильно — вебдизайн, вебдизайнер, вебсайт, вебсторінка.
• Інтернет як самостійний іменник дає дефіс: інтернет-магазин. Це інше правило, а не суперечність.
• З абревіатурою або власною назвою риска повертається: веб-API, UI-дизайн, UX-дизайнер.
• Онлайн разом; онлайн-курс через дефіс; курс онлайн — окремо. «Он-лайн» уже не живе.
• Словникові картки й автоперевірка часто відстають від правопису. Еталон — офіційне видання «Наукової думки» 2019 року, не червоне підкреслення в Docs.
• У резюме, вакансії й брифі узгодженість важливіша за разовий «правильний» рядок: одна форма на всіх сторінках, як один майстер-компонент кнопки.

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