6️⃣ SEO-порад для ваших Vibe Coding сайтів

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

За цей час я вже навіть навчився там троха плавати, і вже можу роздавати поради.😎

Але так, як я маю більше експертизи в сеошці ніж в розробці, то й поради будуть саме в цьому напрямку.

Ви дізнаєтесь, на що треба звернути увагу, якщо ви хочете, щоб на ваш новий АІ проект заходили не тільки ви, а ще й хтось з пошуковиків.

1. Використовуйте SSR

АІ(особливо їх браузерні версії, такі як Lovable, Bolt та ін) дуже люблять писати Single Page Applications на чистому React або Vue.

Для швидкості розробки це супер (все літає, блимає, анімується), але для SEO - це постріл у ногу, бо пошуковий бот майже нічого не бачить.

Як пофіксити: одразу в стартовому промпті жорстко задавайте використання Next.js (бажано App Router), Astro або Nuxt. Сторінки мають віддавати пошуковикам готовий, згенерований на сервері HTML (SSR або SSG).

2. Канонікли і структура урлів.

АІ скоріш за все зробить вам сайт, де урли відкриваються і зі слешем і без слешу в кінці.

Наче б то фігня скажете ви, але Гугл з вами не згідний, бо для нього це 2 різних сторінки, які по суті є дублями!

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

Також перевіряйте канонікли у вихідному коді (швидше це зробить розширення для Chrome SEO META in 1 CLICK) і переконайтесь, що вони співпадають з вашим урлом у браузері.

3. URL-структура: одна фіча = одна сторінка.

АІ обожнює ліпити всі фічі на одну сторінку. Як результат - замість нормальних ЧПУ (domain.com/tool), ми отримуємо динамічну підміну контенту взагалі без зміни URL, або ж милиці з параметрами (domain.com/?tool=1)

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

4. Не забувайте про мета теги і Schema.org для сутностей (Entities)

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

Як пофіксити: вказуйте окремим кроком при створенні кожної нової сторінки: «Додай динамічні Title та Description. Згенеруй валідну JSON-LD розмітку для цієї сторінки, базуючись на сутностях проекту (SoftwareApplication, Article або FAQPage )»

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

5. Контролюйте Core Web Vitals і Page Speed

Згенерований код буває важким (особливо, якщо АІшку час від часу не отпіздюлювати в процесі): він може підключити гігантську бібліотеку заради однієї дрібної функції (яку видалить на наступному кроці) або забути про оптимізацію картинок.

Як пофіксити: просіть АІ рефакторити свій же код: "Проаналізуй цей компонент і оптимізуй його для максимального балу в Google PageSpeed Insights. Видали зайві залежності, налаштуй lazy-loading для зображень та оптимізуй шрифти".

6. Не оверінженірьте там, де цього не треба

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

Наприклад, навіщо вам база данних для сайту з 3-х сторінок?

Або якесь тестування перед продом, яке юзають на ентерпрайз рівні.

Як пофіксити: перед початком подумайте і прорісьорчте, які фреймворки і технічні рішення краще використовувати. Можливо достатньо буде html сторінки і статичного хостингу за 3 копійки, замість звʼязки NextJS+Supabase+Netify?

Висновок

За цей рік у світі вайб-кодінгу я зрозумів: АІ - це неймовірно швидкий, прогресуючий, але сліпуватий у плані SEO джун.

Він напише вам швидко непоганий з першого погляду сайт, який може ніколи не бути проіндексований Google, якщо ви не проконтролюєте це

Я використовую ці 6 порад в кожному сайті, який я створюю за допомогою АІ, тож маю надію, що вони будуть корисні й вам💪

💬А з якими складнощами у SEO при АІ розробці стикнулись ви?

Reshtei 📱 | Мій 📱| First Vibe Coding UA🇺🇦