Руководство › Часть V. SEO и служебное › 20. Служебные файлы

20. Служебные файлы: SEO, favicon, аналитика

Все восемь страниц разобраны. Осталось то, что живёт вне страниц, но обеспечивает видимость сайта в поиске, превью в соцсетях и сбор статистики. Это robots.txt, sitemap.xml, og-image, favicon, код Яндекс.Метрики в футере и два файла верификации.

Общая карта служебного

Где что лежит

В корне сайта:
  robots.txt                            инструкции для роботов
  sitemap.xml                           карта сайта
  og-image.png                          превью для соцсетей 1200x630
  google64f9bc81608bb3b0.html           верификация Google
  yandex_36c2392a87220a22.html          верификация Яндекса
  favicon.svg                           SVG-фавикон (основной)
  favicon-32.png                        PNG-фавикон 32x32
  apple-touch-icon.png                  иконка для iOS

В partials/head-links.html:
  - ссылки на три фавикона
  - meta theme-color
  - og-теги, twitter-теги
  - подключение style.css и scroll-top.css

В partials/footer.html:
  - код Яндекс.Метрики (счётчик 112503289)

robots.txt

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

robots.txt — полностью

# ============================================================
# ФАЙЛ: robots.txt
# АВТОР: Ефимов Андрей Михайлович
# НАЗНАЧЕНИЕ: Инструкции для поисковых роботов.
# БЕЗ ЭТОГО ФАЙЛА: роботы индексируют всё подряд, включая
#                  служебные файлы (если они есть).
# ============================================================

User-agent: *
Allow: /
Disallow: /partials/
Disallow: /.htaccess

# Карта сайта — помогает роботам быстрее найти все страницы
Sitemap: https://secserpr.ru/sitemap.xml

Строки 1–6: паспорт в комментариях

Тот же приём, что и в .htaccess: комментарии через решётку #. Блок-паспорт — по стандарту проекта.

Строка 8: `User-agent: *`

User-agent — «для кого инструкция».
* — «для всех роботов». Если бы написали User-agent: Yandex, правило касалось бы только Яндекса.

Строка 9: `Allow: /`

Разрешение обходить весь сайт. Символ / — «корень и всё вложенное».

Строки 10–11: `Disallow`

Disallow: /partials/ — папку с SSI-файлами не обходить. Технически робот мог бы открыть /partials/header.html и увидеть там фрагмент разметки. Это не отдельная страница — индексировать её бессмысленно.
Disallow: /.htaccess — конфигурационный файл не обходить. Хотя доступ к нему обычно закрыт на уровне сервера, лишняя страховка не помешает.

Строка 14: `Sitemap`

Указание роботам, где лежит карта сайта. Полный URL, не относительный.

Внимание: robots.txt не защищает от индексации

Disallow — это «не обходи», а не «не индексируй». Если на страницу ведёт внешняя ссылка, робот может её проиндексировать, даже не открывая. Для настоящего запрета индексации нужен <meta name="robots" content="noindex"> на самой странице. Это два разных инструмента.

sitemap.xml

XML-файл со списком всех важных страниц сайта. Поисковики читают его и быстрее узнают о существовании страниц — особенно новых.

sitemap.xml — структура

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">

  <url>
    <loc>https://secserpr.ru/index.html</loc>
    <lastmod>2026-09-11</lastmod>
    <changefreq>monthly</changefreq>
    <priority>1.0</priority>
  </url>

  ... ещё 6 записей ...

</urlset>

Файл содержит семь записей — по числу содержательных страниц. 404.html в карте нет: её индексировать не нужно.

Разбор одной записи

<loc> — полный URL страницы. Обязательно абсолютный.
<lastmod> — дата последнего изменения в формате YYYY-MM-DD.
<changefreq> — как часто страница обновляется. Возможные значения: always, hourly, daily, weekly, monthly, yearly, never.
<priority> — приоритет от 0.0 до 1.0. Это не «важность вообще», а «важность относительно других страниц этого же сайта».

Приоритеты семи страниц

Расстановка приоритетов в проекте

Приоритет  Страница             changefreq   Причина
---------  -------------------  -----------  ---------------------
1.0        index.html           monthly      главная
0.9        services.html        monthly      ключевая коммерческая
0.9        offer.html           monthly      ключевая коммерческая
0.8        about.html           yearly       меняется редко
0.8        projects.html        monthly      кейсы
0.7        contacts.html        yearly       меняется редко
0.3        privacy.html         yearly       юридическая

404.html   —                    —            НЕ в карте

Логика: главная — 1.0, коммерческие страницы — 0.9, информационные — 0.7–0.8, юридическая — 0.3. changefreq у контентных страниц — monthly (обновляются), у юридических и «Обо мне» — yearly.

Приоритет — не гарантия

Поисковики не обязаны следовать <priority> и <changefreq>. Google открыто заявлял, что игнорирует оба параметра. Яндекс — учитывает как «мягкий сигнал». Но их наличие не мешает, а иногда помогает. Главное — <loc>, остальное вторично.

og-image.png

Картинка 1200×630 пикселей. Это стандартный размер для превью в соцсетях: Facebook, VK, Telegram, WhatsApp. Когда кто-то кидает ссылку на страницу сайта — мессенджер показывает эту картинку.

Как og-image подключается

В partials/head-links.html:

  meta property="og:image"        content="https://secserpr.ru/og-image.png"
  meta property="og:image:width"  content="1200"
  meta property="og:image:height" content="630"

  meta name="twitter:card"        content="summary_large_image"
  meta name="twitter:image"       content="https://secserpr.ru/og-image.png"

Технические детали:

og:image:width и og:image:height — подсказка мессенджеру, чтобы он не грузил картинку заранее, а сразу знал пропорции. Скорость.
twitter:card — тип карточки в Twitter. summary_large_image — «большая картинка сверху». Используется и в Telegram, и в WhatsApp — они читают Twitter Card как запасной источник.
Файл og-image.png лежит в корне сайта. Ссылка в теге — абсолютная: полный URL с доменом. Это требование большинства мессенджеров: относительный путь они не поймут.

Почему og-теги в head-links, а не в страницах

Общие og-теги (тип, имя сайта, картинка, локаль) — одинаковые для всех страниц, поэтому в head-links.html. А og:title, og:description, og:url — уникальные, поэтому в самих страницах. Разделение по «повторяемости»: общее — в partial, частное — в странице.

Favicon — три файла

В head-links.html подключено три варианта фавикона. Не один, а три — потому что разные браузеры и устройства предпочитают разные форматы. Все три файла лежат в корне сайта.

Три фавикона в head-links.html

1. SVG-файл /favicon.svg
   Основной. Современные браузеры.
   Векторный, масштабируется без потерь.

2. PNG 32×32 /favicon-32.png
   Запасной. Браузеры без поддержки SVG.

3. Apple Touch Icon /apple-touch-icon.png
   Для iOS при добавлении сайта на домашний экран.

Плюс — один мета-тег, который не относится к фавикону напрямую, но работает в связке:

theme-color

<meta name="theme-color" content="#33ff33" />

Окрашивает адресную строку мобильного браузера в зелёный бренда. Не обязательный тег, но даёт эффект «единого целого».

Почему три, а не один

Три варианта — не избыточность, а покрытие разных сред. SVG-файл — основной: современные браузеры читают его без проблем, а векторный формат сохраняет чёткость на любом экране. PNG 32×32 — запасной для старых браузеров, которые не понимают SVG. Apple Touch Icon — специфика iOS: свой формат и размер для иконки на домашнем экране. Все три файла лежат в корне, браузер выбирает подходящий.

Внимание: не дублировать SVG-теги

В первой версии проекта head-links.html содержал data-URI — SVG, встроенный прямо в атрибут href как длинная строка с процентами. И рядом — внешний файл /favicon.svg. Оба с одним и тем же rel="icon" type="image/svg+xml". Браузер видел два тега — и брал только последний. Первый (data-URI) висел зря, занимая место в HTML на каждой странице.

Решение: оставить один SVG-тег на внешний файл. Он кэшируется браузером один раз — это быстрее и проще.

Яндекс.Метрика

Код счётчика лежит в partials/footer.html — единственное место. Не в страницах. Это значит: при раскрытии футера на любой странице счётчик подключается автоматически.

footer.html — код Метрики

Yandex.Metrika counter
  (function(m,e,t,r,i,k,a){ ... })(window, document, 'script',
    'https://mc.yandex.ru/metrika/tag.js?id=112503289', 'ym');

  ym(112503289, 'init', {
    ssr:true,
    webvisor:true,
    clickmap:true,
    ecommerce:"dataLayer",
    referrer: document.referrer,
    url: location.href,
    accurateTrackBounce:true,
    trackLinks:true
  });

Номер счётчика

112503289 — идентификатор сайта в Метрике. Встречается в коде трижды: в URL загрузки скрипта, в вызове ym() и в теге noscript. При переносе на другой аккаунт — менять во всех трёх местах.

Разбор параметров init

ssr: true — Server Side Rendering. Метрика учитывает, что страница отрисовывается на сервере (наш SSI). Без этого параметра часть визитов могла бы не засчитаться.
webvisor: true — Вебвизор. Записывает действия пользователя: движения мыши, клики, прокрутку. Можно потом «пересмотреть» визит. Включается осознанно — функция хранит много данных.
clickmap: true — карта кликов. Показывает, по каким элементам чаще всего кликают.
ecommerce: "dataLayer" — интеграция с электронной коммерцией. У нас её нет, но параметр оставлен — на случай, если в будущем появятся цели с передачей данных.
referrer: document.referrer — откуда пришёл пользователь. Заполняется автоматически: если перешёл из поиска — там будет адрес поисковика, если закладка — пусто.
url: location.href — полный URL текущей страницы. Используется Метрикой для разметки визитов по страницам.
accurateTrackBounce: true — точный показатель отказов. По умолчанию Метрика считает отказом визит короче 15 секунд. С этим флагом — считает только последнюю страницу визита. Точнее.
trackLinks: true — отслеживание кликов по внешним ссылкам. Если пользователь кликнет и уйдёт с сайта — Метрика узнает.

Noscript-блок

footer.html — noscript

<noscript>
  <div>
    <img src="https://mc.yandex.ru/watch/112503289"
         style="position:absolute; left:-9999px;" alt="" />
  </div>
</noscript>

Для пользователей с отключённым JavaScript. Тег <noscript> показывает содержимое только тем, у кого JS выключен. Внутри — невидимая картинка (уведена за экран через left:-9999px), при загрузке она «сообщает» Метрике о визите.

Почему счётчик в футере, а не в head

Скрипт Метрики асинхронный (k.async = 1) — он не блокирует загрузку страницы. Можно было бы и в head. Но в футере — единая точка: одна запись обслуживает все восемь страниц. Если счётчик уедет в head, придётся править восемь файлов вместо одного.

Файлы верификации

Два файла в корне сайта. Они подтверждают права на сайт при регистрации в Яндекс.Вебмастере и Google Search Console.

Яндекс.Вебмастер

yandex_36c2392a87220a22.html

<html>
  <head>
    <meta http-equiv="Content-Type"
          content="text/html; charset=UTF-8">
  </head>
  <body>
    Verification: 36c2392a87220a22
  </body>
</html>

Минимальная HTML-страница с одной строкой в body: Verification: 36c2392a87220a22. Яндексу достаточно открыть этот файл по URL и увидеть строку.

Google Search Console

google64f9bc81608bb3b0.html

google-site-verification: google64f9bc81608bb3b0.html

Просто текст, без HTML. Google ожидает увидеть именно эту строку в ответе сервера. Файл можно было бы разместить и как обычный текстовый файл с другим расширением, но .html тоже работает.

Принцип работы

Как проходит верификация

1. Пользователь регистрируется в Вебмастере / Search Console
2. Сервис даёт файл с уникальным кодом
3. Пользователь кладёт файл в корень сайта
4. Сервис открывает URL вида
   https://secserpr.ru/yandex_36c2392a87220a22.html
5. Видит ожидаемую строку -> подтверждение успешно
6. Файл можно оставить — он нужен для повторной проверки

Файл не мешает и не удаляется

После верификации файл обычно оставляют. Стоимость — один лишний файл в корне. Зато при смене хостинга или повторной проверке он уже на месте. Удаляют, только если файлов накопилось много от разных сервисов.

Схема: что где подключено

Служебные файлы и их потребители

Файл                       Кто использует          Где связь
-------------------------  ----------------------  ------------------
robots.txt                 поисковые роботы        корень сайта
sitemap.xml                поисковые роботы        через robots.txt
og-image.png               мессенджеры, соцсети    head-links.html
favicon.svg                браузеры                head-links.html
favicon-32.png             браузеры                head-links.html
apple-touch-icon.png       iOS                     head-links.html
theme-color (meta)         мобильные браузеры      head-links.html
google-verification.html   Google Search Console   корень сайта
yandex-verification.html   Яндекс.Вебмастер        корень сайта
Яндекс.Метрика (скрипт)    сама Метрика            footer.html

Десять элементов — десять разных потребителей. Файлы в корне для роботов и сервисов, три фавикона для браузеров, один скрипт для аналитики.

Итог по всему сайту

Все восемь страниц и служебные элементы разобраны. Что получилось в сумме.

Структура проекта — финальная

Корень сайта:
  8 HTML-страниц (7 в sitemap + 404.html)
  2 CSS-файла (style.css, scroll-top.css)
  2 JS-файла (script.js, scroll-top.js)
  .htaccess (SSI + ErrorDocument)
  robots.txt, sitemap.xml, og-image.png
  2 файла верификации
  3 фавикона (favicon.svg, favicon-32.png, apple-touch-icon.png)
  partials/ (4 SSI-файла)

Итого:
  ~24 файла на сайте
  22 HTML-файла учебника (20 разделов + index + appendix)
  1 manual.css + 3 partials учебника

Итог раздела

robots.txt — инструкции роботам. Разрешает всё, запрещает /partials/ и /.htaccess. Ссылается на sitemap.
sitemap.xml — семь записей с приоритетами от 1.0 до 0.3. 404.html не включена.
og-image.png — 1200×630 для соцсетей. Подключается в head-links.html через og-теги.
Favicon — три файла: SVG (основной), PNG 32×32 (запасной), Apple Touch Icon (для iOS). Плюс мета-тег theme-color.
Яндекс.Метрика — счётчик 112503289 в footer.html. Единая запись на восемь страниц. Параметры: Вебвизор, карта кликов, точный показатель отказов.
Файлы верификации — Google и Яндекс. Простые, остаются в корне после регистрации в сервисах.
Все служебные элементы — вне страниц. Ни одна страница сайта не содержит их напрямую.

Учебник завершён. Все 20 разделов от структуры проекта до SEO разобраны. Остались приложения — чек-лист «Сайт готов» и список «Что в планах».