header-page
matrix-post

Мапа сайту тз веб-дизайнеру

👈 Голосуй за post!
Зміст: мапа сайту це стаття 7 з 10-ти

  1. Створення sitemap xml
  2. Мапа сайту приклад
  3. Створення HTML Sitemap
  4. Авто generator sitemap

Створення sitemap xml

Мапа сайту це sitemap, він дає роботам можливість швидше обходити сайт та індексувати вміст. Адже давайте відповімо собі самі нам за технічним завданням чи планом працювати легше. Ось так і справа. Мапа сайту у своєму роді ТЗ для робота з обходу сторінок сайту. Йому не потрібно бігати по всій сторінці, шукаючи нові посилання, ви йому самі надаєте їх список. Ви шкодуєте його роботу він прихильно ставиться до вашого сайту. Це звичайно все перебільшено, ну а тепер більше технічних термінів.

ТЗ на створення Сайтмеп

Опис проекту: Сайт-магазин має великий обсяг контенту, включаючи сторінки категорій, товарів, акцій, статей, а також інформаційні сторінки про доставку, кредит, гарантії та інші. Сайт багатомовний, тому потрібно реалізувати всіма мовами включаючи авто генерацію при додаванні нової мовної версії.

У разі появи нової сторінки сайту як категорії, товару, ін автоматично додавати її у відповідний розділ мапи сайту як у XML так і на сторінку HTML версії.

  • en
  • de
  • ua
  • xxxx

Sitemap має бути розміщений за адресою /sitemap_index.xml на сервері сайту. В robot.txt необхідно внести запис.

Мапа сайту це список веб сторінок

User-Agent: *
Sitemap: httрs://mysite.com/sitemap_index.xml

Файл індексу Sitemap

Сама мапа сайту може мати як просту структуру, так і містити додатковий файл індексу. Надалі ми розглянемо структуру sitemap з використанням файлу індексу Sitemap розбитого на мовні версії як приклад https://marketing.i3.com.ua/sitemap_index.xml . Це нам необхідно для того, щоб відстежити пошукову ефективність кожного файлу Sitemap у Search Console (довідка google).
Ось як приклад: <lastmod>2023-02-13T10:41:28+00:00</lastmod>

<?xml version=”1.0″ encoding=”UTF-8″?>

<sitemapindex xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9 ” >

<sitemap>

<loc>https://your-site.com/sitemap-en.xml</loc>

<lastmod>2023-02-13T10:41:28+00:00</lastmod>

</sitemap>

<sitemap>

<loc>https://your-site.com/sitemap-ua.xml</loc>

<lastmod>2023-02-13T10:41:28+00:00</lastmod>

</sitemap>

<sitemap>

<loc>https://your-site.com/sitemap-XXXX.xml</loc>

<lastmod>2023-02-13T10:41:28+00:00</lastmod>

</sitemap>

</sitemapindex>

Внутрішні сайтмап

Мапа сайту Вимога

XML-файл Sitemap відповідає стандартам протоколуhttp://www.sitemaps.org/schemas/sitemap/0.9

Не більше не більше 50 000 URL, розмір в стиснутому вигляді не повинен перевищувати 50 МБ. У разі перевищення ліміту розбийте його ще на кілька частин. Файлі повинні мати кодування UTF-8

Використовувати<lastmod> якщо воно є гарантовано точним (наприклад, якщо його точність перевіряється порівнянням з останньою зміненою версією сторінки).

Кожна сторінка має містити такі інформаційні елементи:

<loc>: URL сторінки з htttS
<lastmod>: Дата останньої зміни сторінки (у форматі YYYY-MM-DD) Будь ласка, забезпечте коректну генерацію дати останньої зміни

Сторінки, що потрапляють в sitemap, повинні мати rel=”canonical”

Мапа сайту може не містити тегів <priority> та <changefreq> значення цього тегу ігнорується Google згідно статті вимоги до сайту

Зміст sitemap

Головні сторінки з мов:

  • https://your-site.com/en/
  • https://your-site.com/ua/
  • https://your-site.com/xxxx/

Сторінки категорій

  • shopping
  • chairs
  • tables
  • sofas

Технічні сторінки

  • about-us
  • articles
  • contact-us
  • promo
  • services
  • vacancy

Статті

  • articles1
  • articles2
  • articles/xxxx

Акції

  • promo1
  • promo2
  • promoxxx

Товари

  • shopping1
  • shopping2
  • shoppingxxx

Мапа сайту має бути додана у файл robots.txt. Нині там не робітник

Мапа сайту приклад

Приклад для https://your-site.com/sitemap-ua.xml
<?xml version=”1.0″ encoding=”UTF-8″?>

<urlset xmlns=”http://www.sitemaps.org/schemas/sitemap/0.9″>
<!– Головна сторінка –>

<url>
<loc>https://your-site.com/ua/</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
</url>

<!– Сторінки категорій –>

<url>
<loc>https://your-site.com/ua/shopping/</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
</url>

<!– Технічні сторінки –>

<url>
<loc>https://your-site.com/ua/guarantee/</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
</url>

<!– Сторінки статей –>

<url>
<loc>https://your-site.com/ua/articles1</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
<image:image>
<image:loc>https://your-site.com/upload/1.jpg</image:loc>
</image:image>
</url>

<url>
<loc>https://your-site.com/ua/articlesххх/</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
<image:image>
<image:loc>https://your-site.com/upload/xxx.jpg</image:loc>
</image:image>
</url>
<url>

<!– Акції –>

<url>
<loc>https://your-site.com/ua/ua/promo1/</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
<image:image>
<image:loc>https://your-site.com/upload/1.jpg</image:loc>
</image:image>
</url>

<url>
<loc>https://your-site.com/ua/ua/promoxxx/</loc>
<lastmod>2023-02-13T10:41:28+00:00</lastmod>
<image:image>
<image:loc>https://your-site.com/upload/xxx.jpg</image:loc>
</image:image>
</url>

<!– Сторінки товарів –>

<!– Товар 1 –>

<url>
<loc>https://your-site.com/ua/shopping1/</loc>
<lastmod>2023-08-01T10:00:00+00:00</lastmod>
<image:image>
<image:loc>https://your-site.com/upload/1.jpg</image:loc>
<image:caption>Товар1</image:caption>
</image:image>
</url>

<!– Товар 2 –>

<url>
<loc>https://your-site.com/ua/ua/shopping2/</loc>
<lastmod>2023-08-15T12:00:00+00:00</lastmod>
<image:image>
<image:loc>https://your-site.com/upload/2.jpg</image:loc>
<image:caption>Товар2</image:caption>
</image:image>
</url>

</urlset>

Створення HTML Sitemap

HTML Sitemap – це візуально адаптована версія мапи сайту, на якій користувач може побачити всі сторінки відповідно до структури сайту. У разі необхідно врахувати наступну структуру з версткой сторінка.

Структура та дизайн HTML версії сайту

Дизайн необхідно виконати у шаблоні сторінки категорії. Сторінка повинна:

  • по-перше бути адаптована до мобільної версії,
  • по-друге мати мета теги title и description, заголовок H1.
  • по-третє мати url /sitemap/

Посилання на HTML версію мапи сайти обов’язково винести у футер відповідних мовних версій. Візуально дизайн сторінки можна взяти з OLX.https://www.olx.ua/sitemap/

Sitemap-html

Сама структура ідентична xml sitemap, в анкорах заголовки з відповідних сторінок
Головна

Категорії:
Текст 1 (текст брати з H1 відповідного посилання)
Текст XXX

Статті:
Назва 1 (текст назви брати з H1 відповідного посилання)
Назва XXX

Акції:
Акція 1 (текст акції брати з H1 відповідної сторінки)
Акція XXX

Товари:
Назва 1 (текст назви товару брати із H1 товару)
Назва XXX

Різне:
Технічні сторінки

Приклад написання:
<a class=”link” href=”https://your-site.com/ua/ua/shopping/” title=”Каталог продукції KULIK SYSTEM”>

<span>Каталог продукції KULIK SYSTEM</span>

Перевірка мапи сайту

Після створення мапи сайту необхідно перевірити його за чек аркушем:

  • Перевірити на валідність за допомогою Google Search Console
  • Звірити кількість сторінок в Ahrefs з Google Search Console
  • Перевірити кількість сторінок, ввівши в пошуковий запит site: your-site.com
  • В інструменті Ahrefs не повинно бути помилок пов’язаних посилання 404 в мапі сайту
  • Наявність дублікатів
  • Перевіритися в правильності написання <lastmod>. Google Search Console може спричинити відсутність.

У результаті кількість сторінок у мапі сайту не повинна бути меншою від того, що видасть пошуковик шт.

Авто generator sitemap

Мапа сайту важливий момент у цьому просуванні, тому її наявність дуже важлива на вашому сайті. Як можна зрозуміти з анотації generator sitemap дуже полегшує завдання. Але як і багато інструментів у цьому просуванні він має свою ціну. Наприклад деякі сервіси пропонують згенерувати вам до 500 сторінок безкоштовно, але потім потрібно підписатися на платний пакет. Звичайно багато cms мають масу вбудованих плагінів або модулів для автоматичного створення сайту, але що робити самописним сайтам?

Відповідь проста пишіть самі, генеруйте на платних сервісах. Ну а тим, хто перебуває на wordpress або opencart, можна позаздрити, адже мапа сайту генерується автоматично, при кожному створенні сторінки або зміні на них.

Як зробити Sitemap wordpress?

Будемо лаконічні: ставте yast seo плагін, налаштуйте як написано в інструкції та мапа сайту з усіма категоріями та товарами готова.

Sitemap wordpress