SEO на Astro: как вывести сайт на Astro в топ Google и попасть в цитаты ИИ

Короткий тест

Подходит ли вам SEO и с чего начать?

Вопрос 1 из 425%

Ищут ли люди в Google то, что вы продаёте?

Да, думаю, ищутНет, это новое или очень нишевоеНе знаю

SEO на Astro означает превратить этот чистый HTML в страницы, которые ранжируются. Руководство Google по основам SEO для JavaScript объясняет, что сайты на JavaScript обрабатываются в три этапа (сканирование, рендеринг, индексирование), и утверждает, что серверный рендеринг или предварительный рендеринг по-прежнему отличная идея, ведь не все боты умеют выполнять JavaScript. Astro по умолчанию стартует именно с этой позиции. Это руководство разбирает всё остальное, настройку за настройкой, и каждое поведение мы сверили с официальной документацией Astro. К слову, сайт sorank.com, который вы сейчас читаете, работает на Astro.

Хорош ли Astro для SEO?

Да, с технической стороны. Astro рендерит компоненты в HTML во время сборки и убирает JavaScript, который фреймворки вроде React или Vue обычно отправляют в браузер. Так вы избегаете классических проблем из нашего руководства по SEO для JavaScript: пустых HTML-оболочек, контента, который появляется только после рендеринга, ссылок, не являющихся настоящими тегами-якорями. Нет и ловушек маршрутизации одностраничного приложения: каждый маршрут Astro это настоящий URL со своим HTML-файлом.

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

Статический или серверный рендеринг: какой режим лучше для SEO?

Документация Astro о рендеринге по запросу однозначна: по умолчанию страницы, маршруты и эндпоинты API заранее рендерятся при сборке как статические страницы. Для SEO статический вывод это самый надёжный вариант по умолчанию: каждый URL представляет собой готовый HTML-файл, отдаваемый через CDN, быстрый и одинаковый для любого посетителя и любого бота.

Рендеринг по запросу (на сервере) требует адаптера для вашего хостинга (например, Node, Netlify, Vercel или Cloudflare). Затем вы исключаете отдельный маршрут из предварительного рендеринга через export const prerender = false или переводите весь проект на output: 'server' и возвращаете статические страницы по одной. Оба режима выдают полный HTML, так что Google видит одно и то же. Различия в другом:

• Скорость: статический файл отдаётся мгновенно; страница, рендерящаяся на сервере, зависит от времени его ответа, а оно влияет на Largest Contentful Paint.
• Актуальность: серверный рендеринг подходит для страниц, которые постоянно меняются (остатки, цены, результаты поиска), где пересборка сайта была бы слишком медленной.
• Инструменты: некоторые интеграции, например карта сайта, не видят динамические серверные маршруты (см. ниже).

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

Как настроить мета-теги и канонические URL в Astro?

Создайте один SEO-компонент (его часто называют BaseHead или Seo) и подключите его в head каждого шаблона. Он принимает заголовок, описание, необязательное изображение и необязательный флаг noindex и выводит:

1. тег title, уникальный для каждой страницы, с основным ключевым словом ближе к началу;
2. мета-описание, написанное вручную для каждой страницы (это ваш сниппет в выдаче);
3. тег canonical как абсолютный URL, собранный из Astro.url.pathname и значения site в конфигурации;
4. теги Open Graph и соцсетей (заголовок, описание, изображение, URL) для превью ссылок;
5. мета-тег robots, если страница должна остаться вне индекса.

Сначала задайте опцию site в astro.config.mjs: от неё зависят canonical, карта сайта и теги соцсетей. Затем выберите правило trailingSlash ('always' или 'never') и придерживайтесь его, чтобы /blog/post и /blog/post/ никогда не конкурировали как две версии одной страницы. Убирайте параметры запроса из canonical, чтобы метки отслеживания не порождали дубли.

Как сгенерировать карту сайта и robots.txt в Astro?

Используйте официальную интеграцию, описанную на странице @astrojs/sitemap. Команда npx astro add sitemap устанавливает её и добавляет в конфигурацию. Интеграция требует опцию site и при сборке записывает файл sitemap-index.xml, который ссылается на пронумерованные файлы (sitemap-0.xml и следующие на больших сайтах). Каждый файл по умолчанию вмещает до 45 000 записей, это значение задаёт опция entryLimit. Если формат для вас новый, наша статья глоссария о XML-карте сайта объясняет, что Google с ней делает.

Для SEO важны три настройки:

• filter: функция, получающая URL каждой страницы; возвращайте false для страниц благодарности, внутреннего поиска, черновиков и всего с noindex, чтобы в карте оставались только индексируемые адреса.
• i18n: сопоставляет языковые папки с кодами языков и добавляет к каждой записи альтернативы hreflang.
• customPages: добавляет URL, которые интеграция не может найти сама.

Для robots.txt на большинстве сайтов достаточно статического файла в папке public. Если его содержимое различается на тестовом и боевом окружении, лучше генерировать его из эндпоинта (src/pages/robots.txt.ts). В обоих случаях добавьте строку Sitemap со ссылкой на sitemap-index.xml и перед запуском проверьте результат валидатором robots.txt. Тем же приёмом создаётся файл llms.txt; наше руководство о том, как установить файл llms.txt, описывает его содержимое.

Как работать с hreflang и многоязычными сайтами в Astro?

Встроенная маршрутизация i18n в Astro решает задачу URL. В конфигурации вы объявляете defaultLocale и список locales и выбираете, получает ли префикс язык по умолчанию (prefixDefaultLocale). Вспомогательные функции вроде getRelativeLocaleUrl строят локализованные ссылки, а Astro.currentLocale сообщает каждой странице её язык.

Руководство по маршрутизации не касается тегов hreflang в head, поэтому заложите их написание в SEO-компонент: для каждой страницы по одной ссылке alternate на языковую версию плюс x-default, всё в виде абсолютных URL, и каждая версия должна перечислять все остальные (обратные ссылки). Генерация из того же списка языков, что и маршрутизация, защищает от самой частой ошибки: альтернативы, указывающей на несуществующую страницу. Чтобы проверить логику на нескольких адресах, наш генератор hreflang выдаёт полный набор тегов для страницы. Затем включите опцию i18n в карте сайта как второй сигнал.

Как изображения и острова влияют на скорость и Core Web Vitals?

Скорость это область, где Astro выигрывает больше всего, и это видно по Core Web Vitals. Руководство Astro по изображениям описывает компонент Image из astro:assets: он оптимизирует локальные изображения, конвертирует их формат, добавляет ленивую загрузку и асинхронное декодирование и определяет размеры изображения, чтобы избежать Cumulative Layout Shift. Атрибут alt в нём обязателен, что закрепляет базовое правило SEO для изображений. Компонент Picture идёт дальше и отдаёт AVIF или WebP с запасным форматом.

Две привычки завершают картину. Храните изображения, которые нужно оптимизировать, в src (файлы из public отдаются как есть, без обработки). И не ставьте ленивую загрузку главному изображению вверху страницы: загружайте его сразу, чтобы оно не задерживало Largest Contentful Paint.

Архитектура островов держит JavaScript под контролем. Компонент остаётся статическим HTML, пока вы не добавите клиентскую директиву: client:load гидрирует его сразу, client:idle, когда браузер свободен, client:visible, только когда он попадает в зону видимости. Оставить client:load лишь для того, что должно реагировать мгновенно (меню, корзина), это самый простой способ защитить Interaction to Next Paint. Серверные острова (server:defer) подгружают персонализированный блок после закешированной страницы, не замедляя основной контент.

Как добавить структурированные данные на сайт на Astro?

В Astro нет функции для schema, и это даёт вам полный контроль. Соберите JavaScript-объект для каждого типа страниц (Article, Product, Organization, BreadcrumbList, FAQPage) и выведите его в теге script с типом application/ld+json, используя директиву set:html и JSON.stringify, чтобы JSON не экранировался. Заполняйте его теми же данными frontmatter или коллекции, что и видимую страницу: тогда разметка всегда совпадает с тем, что видят пользователи, а этого требуют правила Google о разметке schema.

Чтобы набросать JSON для нового типа страниц, наш бесплатный генератор schema даст корректный стартовый блок, который вы превратите в шаблон. После каждого изменения шаблона проверяйте выборку собранных страниц в инструменте проверки расширенных результатов Google.

Как настроить редиректы при переезде на Astro?

Переезд с WordPress или Next.js самый рискованный момент для сайта на Astro. Сохраните каждый URL с трафиком или обратными ссылками, а остальные по одному свяжите с ближайшим аналогом постоянными редиректами, как описано в нашем руководстве по SEO-редиректам.

Конфигурация Astro принимает объект redirects, сопоставляющий старые пути с новыми. С адаптером они становятся настоящими HTTP-редиректами. При чисто статической сборке Astro вместо этого записывает HTML-страницу с meta refresh: Google по ней переходит, но считает её более слабым сигналом, чем серверный 301. Для статического сайта объявляйте редиректы в формате вашего хостинга (файл _redirects на Netlify или Cloudflare Pages, файл vercel.json на Vercel), чтобы краулеры получали настоящий 301.

Как Astro помогает SEO и GEO?

Чтобы вас цитировали ChatGPT, Perplexity или Gemini, сначала нужно быть читаемым. Многие краулеры ИИ забирают сырой HTML, не выполняя JavaScript, поэтому сайт, который отдаёт весь текст уже в первом ответе, как Astro по умолчанию, снимает барьер, который всё ещё есть у сайтов с клиентским рендерингом. Чёткие подзаголовки, абзацы, начинающиеся с ответа, структурированные данные и файл llms.txt затем делают каждую страницу удобнее для цитирования.

После запуска измеряйте, а не гадайте. Дашборд GEO и SEO в Sorank объединяет данные Search Console и визиты из ИИ-ассистентов, чтобы вы видели, удерживает ли новый сайт позиции.

Техническое качество окупается, только когда есть контент для ранжирования. Генератор статей для блога от Sorank пишет и публикует статьи, оптимизированные для Google и ИИ-ассистентов, и подключается через webhook к сайту на собственном движке, например к проекту на Astro.

Astro по умолчанию даёт быстрый сканируемый HTML; позиции по-прежнему зависят от тегов head, карты сайта, hreflang, структурированных данных и редиректов, которые добавляете вы. Сначала настройте общий SEO-компонент и карту сайта, а перед запуском пройдитесь по таблице выше.