Презентація Артема Пилипця з SEO-конференції Collaborator, що відбулася 20 жовтня 2023 року. Тези доповіді: 1. Оцінка реального вигляду сторінки 2. Користь семантичних тегів 3. Нюанси рендерингу 4. Діагностика проблем контенту Відео доповіді дивіться на Youtube-каналі Collaborator Про спікера: Артем Пилипець — керівник відділу просування компанії SEO7. У SEO понад 10 років. Займається управлінням команди з клієнтського SEO у компанії SEO7. Веде Youtube канал Школа SEO — один з найпопулярніших Youtube каналів з SEO.

1. Що робити, якщо сторінка не
просувається в ТОП?
Пилипець Артем
https://seo7.com.ua/ - Послуги
https://shkola-seo.com/ - Навчання
https://www.facebook.com/artem.pilipec.seo - Питання

2. План
1. Що перевірити перед тим як заглиблюватись.
2. Перевірка яку варто додати в свою роботу — оцінка реального вигляду
сторінки.
3. Неочікувана релевантність
4. Зони сторінки.
5. Рендеринг.
Насправді причин безліч. Це лише мій ТОП.

3. Перед тим як вигадувати перевірте основи
● Перевірити чи співпадає інтент запиту та
сторінки.
● Перевірити сторінку в GSC.
● Кількість зовнішніх посилань.
● Якість посилань.
● Список анкорів.
● Наявність ключових слів на сторінці.
● Перевірити наявність спаму.
https://www.youtube.com/watch?v=YjD9rZfUE2I

4. Оцінка реального вигляду сторінки
Букмарклет для текстового кешу:
javascript:(function() { var url =
'http://webcache.googleusercontent.com/search
?q=cache:%27 +
encodeURIComponent(window.location.href) +
%27&strip=1&vwsrc=0%27; window.open(url,
%27_blank%27);})();

5. Порівняйте свою сторінками зі сторінками з ТОПу

6. Неочікувана релевантність
Інформаційна цінність слів в заголовках (Вага слів):
Ігрові ноутбуки - купити в Києві
(10100k, 29200k, 171000k, 139000k)
Ігрові ноутбуки - найкращі ціни
(10100k, 29200k, 28200k, 54300k)
Замисліться чи не розвиваєте ви релевантність специфічними заголовками.

7. Навігаційні елементи, що індексуються як текст

8. Зони сторінки

9. Зони сторінки

10. Зони сторінки
Позиція та вигляд навігаційних елементів в
HTML документі який бачить GoogleBot.
Використання блоків <nav> для навігаційних
елементів. Та <aside> для елементів
інтерфейсу: фільтрів, сортувань.
Правильність використання тегів main,
section, nav, aside.
Букмарклет для підсвітки елементів
javascript:(function() { function highlightHeaders() { var headers =
document.querySelectorAll('h1, h2, h3, h4, h5, h6'); for (var i = 0; i < headers.length; i++) {
var header = headers[i]; var level = parseInt(header.tagName.charAt(1));
header.style.outline = '2px solid blue'; header.style.backgroundColor = 'lightblue';
header.insertAdjacentHTML('beforebegin', '<span style="background-color: blue; color: white;
padding: 2px;">H' + level + '</span> '); } } function highlightInternalLinks() { var links =
document.querySelectorAll('a[href^="#"]'); for (var i = 0; i < links.length; i++) { var link =
links[i]; link.style.outline = '2px solid green'; } } function highlightExternalLinks() {
var links = document.querySelectorAll('a:not([href^="#"])'); for (var i = 0; i < links.length; i++) {
var link = links[i]; var linkDomain = link.hostname; var currentDomain =
window.location.hostname; if (linkDomain === currentDomain) { link.style.outline =
'2px solid green'; } else { link.style.outline = '2px solid red'; } } }
function highlightSemanticTags() { var semanticTags = document.querySelectorAll('article,
aside, details, figcaption, figure, footer, header, main, mark, nav, section, summary'); for (var i =
0; i < semanticTags.length; i++) { var tag = semanticTags[i]; var tagName =
tag.tagName.toLowerCase(); tag.style.outline = '2px solid yellow';
tag.style.backgroundColor = 'lightyellow'; tag.insertAdjacentHTML('beforebegin', '<span
style="background-color: yellow; color: black; padding: 2px;">' + tagName + '</span> '); } }
function highlightSchemaOrgBlocks() { var schemaOrgBlocks =
document.querySelectorAll('[itemtype*="schema.org"]'); for (var i = 0; i <
schemaOrgBlocks.length; i++) { var block = schemaOrgBlocks[i]; var itemType =
block.getAttribute('itemtype'); block.style.outline = '2px solid purple';
block.style.backgroundColor = 'lavender'; block.insertAdjacentHTML('beforebegin', '<span
style="background-color: purple; color: white; padding: 2px;">itemtype: ' + itemType + '</span> ');
} } highlightHeaders(); highlightInternalLinks(); highlightExternalLinks();
highlightSemanticTags(); highlightSchemaOrgBlocks();})();

11. Серверний Рендеринг для GoogleBot
Що таке SSR https://dou.ua/forums/topic/41585/
В карпоративному секторі все більше
набираються популярність Single Page
Application (SPA) сайти на основі JavaScript
фреймворків таких як React або Angular.
Google рекомендує, щонайменьше:
● Налаштувати генерацію sitemap.xml;
● Налаштувати відображення title та
description в вигляді статичного HTML.

12. Серверний Рендеринг для GoogleBot
Що насправді треба рендерити:
● Title та Description,
● Контент,
● Навігацію,
● Посилання,
● Зображення,
● Заголовки,
● Структуровані дані,
● Таблиці, списки.
Налаштувати регулярні оновлення
зрендерених копій.
Як перевіряти:
GSC
https://search.google.com/search-console/inspect
Зміна User Agent браузера

13. Бонусна перевірка

14. Пошук keyword stuffing за допомогою ШІ

15. Будь яку сторінку можна
виправити,
але інколи не варто)

16. Дякую за увагу!
Пилипець Артем
https://seo7.com.ua/ - Послуги
https://shkola-seo.com/ - Навчання
https://www.facebook.com/artem.pilipec.seo - Питання