Как мы сделали AI Content Graph для SEO и внутренней перелинковки

Когда на сайте появляются десятки статей, инструментов, сравнений и категорий, контролировать внутреннюю перелинковку вручную становится неудобно. Можно, конечно, открыть 50 вкладок и делать вид, что это стратегия, а не цифровое самоистязание.

Мы решили создать интерактивный граф контента, который показывает все страницы сайта и связи между ними. Это позволяет мгновенно увидеть тематические кластеры, изолированные страницы и точки роста для SEO.

Основой решения стал open-source проект code-review-graph, который мы адаптировали под структуру сайта на Astro.

Почему нам понадобился граф контента

На сайте Tech Zone Machine уже есть:

статьи в /articles/;
карточки инструментов в /tools/;
сравнения в /comparisons/;
категории в /categories/.

Каждая страница должна ссылаться на другие материалы. Это улучшает навигацию и помогает поисковым системам лучше понимать структуру сайта.

Проблема в том, что после роста проекта становится сложно ответить на простые вопросы:

Какие страницы не имеют внутренних ссылок?
Какие статьи образуют сильные тематические кластеры?
На какие материалы ссылаются чаще всего?
Где есть пробелы в перелинковке?
Какие темы стоит расширить?

Граф контента даёт ответы на эти вопросы за несколько секунд.

Open-Source проект, который стал основой

За основу мы взяли проект:

https://github.com/tirth8205/code-review-graph

Это отличный open-source инструмент, созданный для визуализации структуры кода и связей между файлами.

Автор проекта проделал серьёзную работу и заложил качественный фундамент. Вместо того чтобы изобретать колесо, мы использовали уже готовое решение и адаптировали его под задачи контентного SEO.

Именно так и должен работать open source: один человек создаёт сильную основу, другие расширяют её под свои задачи.

Почему мы выбрали именно этот проект

Нам понравилось, что проект уже умел:

строить интерактивный граф;
отображать узлы и связи;
поддерживать масштабирование;
работать с большими структурами;
обеспечивать плавную навигацию.

То есть ядро было готово. Нам оставалось заменить источник данных и интегрировать визуализацию в Astro-проект.

Как GPT и Codex ускорили разработку

В проекте использовалась связка:

ChatGPT для архитектуры и проектирования.
Codex для изменения реального кода проекта.
GitHub для хранения и версионирования.
Astro для генерации сайта.

Роль ChatGPT

ChatGPT использовался для:

проектирования структуры;
написания технических заданий;
SEO-логики;
UX-решений;
генерации промтов для Codex.

Роль Codex

Codex работал напрямую с проектом и:

анализировал существующий код;
создавал новые компоненты;
изменял маршруты;
подключал стили;
интегрировал граф в сайт.

Почему эта связка эффективна

GPT выступает как архитектор.

Codex выступает как исполнитель.

Такой подход резко ускоряет разработку и снижает количество ошибок.

Как мы адаптировали граф под Astro

Исходный проект был рассчитан на другую структуру данных. Мы переделали его для работы с контентными коллекциями Astro.

Что было сделано

Считаны данные из коллекций:
- articles
- tools
- comparisons
- categories
Построены узлы:

{
"id": "openai-chatgpt",
"name": "ChatGPT",
"type": "tool",
"url": "/tools/openai-chatgpt/"
}

Построены связи на основе внутренних ссылок.
Добавлены фильтры по типам контента.
Добавлен поиск.
Реализованы переходы по клику.
Граф встроен в дизайн сайта.

Как экономить токены при работе с Codex

Одна из самых полезных практик при работе с Codex — давать узкие и точные задачи.

Правильный подход

Указывать конкретный файл.
Чётко описывать цель.
Запрещать изменять layout и другие части проекта.
Просить менять только нужные компоненты.
Проверять результат после каждого шага.

Пример хорошего промта

Роль: Senior Frontend Engineer (Astro)

ЗАДАЧА:
Добавить интерактивное содержание во все статьи.

РАБОТАТЬ ТОЛЬКО С:
- src/components/TableOfContents.astro
- src/layouts/ArticleLayout.astro

НЕ МЕНЯТЬ:
- sidebar
- header
- global layout

Такой подход сокращает расход токенов и уменьшает вероятность побочных изменений.

Что умеет граф контента

После адаптации граф получил следующие возможности.

Визуализация всех страниц

Каждая статья, инструмент, сравнение и категория отображаются как отдельный узел.

Подсветка связей

При наведении показываются связанные материалы.

Поиск

Можно мгновенно найти нужную страницу.

Фильтрация

Отдельное отображение:

статей;
инструментов;
сравнений;
категорий.

Переход по клику

Клик по узлу открывает соответствующую страницу.

Масштабирование и навигация

Поддерживаются zoom, drag, reset view и fullscreen.

Практическая польза для SEO

Граф контента помогает решить реальные SEO-задачи.

Поиск orphan pages

Страницы без внутренних ссылок обнаруживаются сразу.

Анализ тематических кластеров

Видно, какие темы хорошо связаны, а какие требуют усиления.

Планирование нового контента

Если инструмент связан с несколькими материалами, но не имеет отдельного сравнения или гайда, это сигнал для создания новой страницы.

Оптимизация crawl depth

Чем лучше связаны материалы, тем проще поисковым роботам обходить сайт.

Как использовать граф в работе

Практический сценарий:

Открываете граф.
Находите статью.
Смотрите связанные материалы.
Проверяете слабые связи.
Добавляете внутренние ссылки.
Перестраиваете граф.

Этот цикл позволяет системно улучшать SEO.

Подробное руководство для новичков

Мы подготовили отдельную инструкцию:

AI Content Graph User Guide

В ней подробно разобраны:

интерфейс;
поиск;
фильтры;
навигация;
SEO-сценарии использования.

Связанные материалы

Для более глубокого понимания темы рекомендуем:

Инструменты:

FAQ

Что такое content graph?

Это интерактивная карта сайта, показывающая страницы и связи между ними.

Помогает ли граф SEO?

Да. Он позволяет улучшать внутреннюю перелинковку и находить слабые места в структуре сайта.

Можно ли использовать граф с Astro?

Да. Именно так реализовано решение на нашем сайте.

Нужен ли граф небольшому сайту?

Даже при 20–30 страницах он уже даёт заметную пользу.

Можно ли адаптировать решение под другой стек?

Да. Подход подходит для Next.js, Nuxt, Hugo и других генераторов сайтов.

Вывод

Создание графа контента стало одним из самых полезных улучшений сайта.

Использование open-source проекта code-review-graph, архитектурных возможностей ChatGPT и прямого доступа Codex к проекту позволило быстро получить мощный SEO-инструмент.

Граф помогает:

видеть структуру сайта;
находить изолированные страницы;
усиливать перелинковку;
планировать новые материалы;
улучшать SEO.

Если вы развиваете контентный сайт, такой инструмент даёт реальную практическую пользу и быстро окупает затраченное время.