Як додати блог на ваш сайт: варіанти, SEO і налаштування

Щоб додати блог на сайт, виберіть, як писатимете дописи: файли Markdown у проєкті, якщо пишете ви або розробник; базу даних з адміністративним редактором, якщо писатимуть люди без технічних знань; або CMS, якщо потрібен повноцінний інструмент редагування. Потім розмістіть блог на /blog на вашому основному домені зі сторінкою списку, окремою сторінкою для кожного допису і RSS-стрічкою. Щоб пошукові системи бачили блог, переконайтеся, що кожен допис віддається як справжній HTML з власним заголовком, описом і зображенням для поширення, і що він є у вашій карті сайту. Конструктор застосунків на основі ШІ може створити будь-який із цих варіантів за промптом; вибір переважно залежить від того, хто писатиме.

Оберіть, як писатимуться дописи

Це найважливіше рішення. Технологія випливає з нього.

Корисне правило: якщо вам зручно писати у звичайному текстовому файлі, Markdown — найпростіший і найшвидший для показу. Якщо слова «commit» і «redeploy» відштовхнуть вас або вашу команду від публікації, оберіть редактор.

Підпапка чи піддомен?

• Підпапка (example.com/blog): один сайт, один дизайн, одна аналітика, а дописи розташовані на тому самому домені, що й сторінки, які ви хочете вивести в пошуку. Найпростіше для більшості бізнесів.
• Піддомен (blog.example.com): потрібен, якщо блог працює на іншій платформі, яку неможливо віддавати під основним сайтом.

Якщо ви все одно вбудовуєте блог у свій сайт, використовуйте підпапку.

Що потрібно блогу

• Сторінка зі списком дописів із заголовками, датами, короткими анотаціями та пагінацією.
• Сторінка допису зі зручною шириною для читання (приблизно 60–80 символів у рядку), чіткими заголовками і нормальною обробкою зображень.
• Чисті URL: /blog/how-to-choose-a-caterer, а не /blog?id=17.
• Заголовок і мета-опис для кожного допису, а також теги Open Graph, щоб поширені посилання показували належний попередній перегляд.
• Записи в карті сайту для кожного допису і RSS-стрічка для читачів та інструментів розсилок.
• Автор і дата, а також дата «оновлено», коли ви переглядаєте допис.
• Категорії або теги, коли дописів стане достатньо, щоб вони були потрібні.
• Чернетки, щоб недописані дописи залишалися приватними.

SEO: зробіть дописи справжніми сторінками

Багато сайтів, створених сучасними інструментами, є односторінковими застосунками: браузер завантажує JavaScript, який потім малює сторінку. Для застосунків це працює, але блог живе завдяки пошуку та попереднім переглядам посилань, а сторінки, які малює лише браузер, важче прочитати деяким пошуковим роботам і попереднім переглядам у соцмережах. Для блогу просіть, щоб дописи були попередньо відрендерені (перетворені на HTML під час збірки сайту) або відрендерені на сервері, щоб кожна URL-адреса допису одразу повертала повний вміст, заголовок і опис.

Наш посібник SEO для сайтів, створених з ШІ докладніше розглядає заголовки, карти сайту і структуровані дані.

Приклади промптів

Блог на Markdown:

Додай блог на /blog. Кожен допис — це файл Markdown у content/blog з назвою, описом, датою і необов'язковим обкладинковим зображенням угорі. Створи сторінку списку (спочатку найновіші, по 10 на сторінку) і сторінку для кожного допису за адресою /blog/[slug]. Попередньо відрендеруй усі сторінки блогу в статичний HTML, щоб кожна мала власний заголовок, мета-опис і теги Open Graph. Додай дописи до sitemap.xml і створи RSS-стрічку за адресою /blog/rss.xml.

Блог з редактором:

Додай блог, у якому дописи зберігаються в базі даних: назва, slug, анотація, текст (Markdown), обкладинкове зображення, статус (чернетка або опублікований), дата публікації. Додай зону адміністрування під паролем, щоб створювати, редагувати, переглядати і публікувати дописи, з можливістю завантажувати зображення для обкладинки і вбудовані зображення. На /blog відображаються лише опубліковані дописи. Рендери сторінку кожного допису на сервері з власним заголовком і мета-описом.

Полірування:

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

Крок за кроком

1. Вирішіть, хто пише, і оберіть Markdown, базу даних + редактор або CMS.
2. Оберіть структуру URL: /blog і /blog/post-slug.
3. Створіть сторінки списку і дописів з основами верстки, описаними вище.
4. Додайте метадані для кожного допису: заголовок, опис, зображення для поширення, дати.
5. Зробіть дописи доступними для індексації: попередньо рендерьте або рендерьте на сервері, а потім перевірте, переглянувши вихідний код сторінки допису — текст статті має бути там.
6. Додайте карту сайту і RSS-стрічку.
7. Працюйте з зображеннями: стисніть їх, задайте розміри, додайте alt-текст. Для редактора зберігайте завантаження у файловому сховищі (див. як додати завантаження файлів до застосунку).
8. Напишіть два-три дописи до запуску, щоб блог не виглядав порожнім.
9. Опублікуйте, а потім надішліть карту сайту в Google Search Console.

Типові помилки

• Вибір налаштування, яким ніхто не скористається. Блог на Markdown для команди, яка не працюватиме з файлами, залишиться порожнім.
• Дописи, які відтворює лише браузер. Під час поширення показується порожній попередній перегляд, а пошукові системи бачать менше.
• Однаковий заголовок і опис на кожному дописі. Кожен допис потребує власних.
• Зміна slug після публікації. Це ламає посилання; якщо без цього не обійтися, додайте перенаправлення.
• Великі нестиснені зображення. Вони сповільнюють кожен допис.
• Відсутні чернетки. Недописані дописи випадково потрапляють у публікацію.
• Писати про себе замість запитань ваших клієнтів. Корисні відповіді приносять відвідувачів; оголошення рідко.

Чек-ліст

• Спосіб написання відповідає тому, хто справді писатиме
• Блог розташований на /blog на вашому основному домені
• Чисті, стабільні URL для кожного допису
• Унікальний заголовок, опис і зображення для поширення для кожного допису
• HTML допису містить повну статтю (перевірте вихідний код сторінки)
• Карта сайту і RSS-стрічка містять усі опубліковані дописи
• Чернетки залишаються приватними
• Зображення стиснені, з alt-текстом
• Кілька дописів написано до запуску

Додавання блогу в Mythex

У Mythex можна додати будь-який із цих типів блогу прямо з чату. Для блогу з редактором дописи зберігаються в базі даних проєкту, а зображення — у файловому сховищі; обидва Mythex вмикає, коли застосунку це потрібно. У документації Mythex зазначено, що нові застосунки за замовчуванням часто є односторінковими застосунками Vite, з гіршим SEO, ніж рендеринг на сервері чи статичний HTML, тож для блогу просіть попередньо відрендерені або статичні сторінки дописів чи налаштування Next.js. Див. SEO для опублікованого застосунку і публікуйте знову після змін.

Якщо ви починаєте з нуля, див. як створити веб-сайт з ШІ і як створити сайт для малого бізнесу.

Запитання