Основы SEO для технического блога: как попасть в поиск
Если у вас небольшой блог, как этот — про Linux, IoT, администрирование — вы можете думать, что SEO — это что-то для крупных сайтов. Но даже технический блог может получать трафик из поиска, если правильно настроить несколько ключевых вещей.
Расскажу о базовых принципах, которые помогут поисковикам (Google, Яндекс) правильно понять ваш сайт и проиндексировать его без ошибок.
1. Заголовки и мета-теги: что должно быть в
Каждая страница должна иметь уникальные и понятные мета-теги. Вот минимальный набор:
<meta charset="UTF-8">
<title>Заголовок статьи | Название блога</title>
<meta name="description" content="Краткое описание статьи — до 160 символов">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://blog.iotprof.ru/article/123" />
- title — должен быть уникальным и отражать суть статьи.
- description — не дублируйте title, сделайте краткое содержание. Это будет отображаться в поиске.
- canonical — указывает "главную" версию страницы, если есть ЧПУ или параметры в URL.
2. robots.txt: разрешаем и запрещаем
Файл robots.txt говорит поисковикам, какие страницы можно сканировать.
Пример для блога:
User-agent: *
Disallow: /tag/
Disallow: /categories.php
Disallow: /admin
Disallow: /search
Allow: /article/
Allow: /index.php
Sitemap: https://blog.iotprof.ru/sitemap.xml
Зачем это нужно:
- Страницы тегов и категорий — это фильтры, а не контент. Их не нужно индексировать.
- Но поисковик должен уметь переходить по ссылкам с главной и статей.
Sitemapпомогает быстрее находить новые статьи.
3. sitemap.xml — карта сайта
Это файл, в котором перечислены все важные страницы. Создайте sitemap.xml в корне:
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://blog.iotprof.ru/index.php</loc>
<lastmod>2025-04-05</lastmod>
<changefreq>daily</changefreq>
<priority>1.0</priority>
</url>
<url>
<loc>https://blog.iotprof.ru/article.php?id=111</loc>
<lastmod>2025-04-04</lastmod>
<priority>0.8</priority>
</url>
</urlset>
Добавьте ссылку на него в robots.txt.
4. 404 ошибка: не маскируйте отсутствие статьи
Если статья не найдена (например, article.php?id=99999), сервер должен вернуть статус 404 Not Found, а не 200 OK.
Пример на PHP:
if (!$article) {
http_response_code(404);
echo "<h1>Статья не найдена</h1>";
echo "<p><a href='/'>← На главную</a></p>";
exit;
}
Если вы вернёте 200 OK, поисковик подумает, что страница есть, и проиндексирует "пустышку".
5. Как обрабатывать теги и категории
Если на страницах вроде /tag/письмо или /categories.php?id=8 просто список статей — это дубли контента.
Правильные решения:
- Запрещаем индексацию через
robots.txt(как выше), - ИЛИ добавляем на такие страницы метатег:
Так поисковик найдёт статьи, но не будет индексировать служебные страницы.
6. Open Graph — для соцсетей
Чтобы при расшаривании в Telegram, ВКонтакте или других сетях отображался заголовок и описание, добавьте:
<meta property="og:title" content="Заголовок статьи">
<meta property="og:description" content="Краткое описание">
<meta property="og:type" content="article">
<meta property="og:url" content="https://blog.iotprof.ru/article/123">
Заключение
SEO для небольшого блога — это не про тысячи ключевых слов, а про:
- Чистую структуру,
- Правильные HTTP-статусы,
- Уникальные мета-теги,
- И отсутствие дублей.
Настройте robots.txt, sitemap.xml, проверьте 404 и метатеги — и поисковики начнут видеть ваш блог правильно.
Правила SEO-структуры статьи на сайте
Следуйте этим правилам, чтобы поисковики правильно понимали вашу статью.
- Один h1 на страницу — только заголовок статьи. Должен быть первым заголовком в контенте.
- Заголовки идут по порядку: после
h1— толькоh2, внутриh2—h3и т.д. Никаких пропусков уровней. - Не пропускайте уровни. Если используется
h3, перед ним должен бытьh2. - Оборачивайте статью в тег
<article>— это семантически выделяет основной контент. - Разделяйте логические блоки через
<section>, особенно каждыйh2. - Абзацы пишите в
<p>— не оставляйте текст "голым" или вdiv. - Код — в <pre><code>...</code></pre> — так его увидят и боты, и читатели.
- Указывайте дату публикации с помощью
<time datetime="YYYY-MM-DD"></time>. - Используйте
<header>внутри статьи для заголовка и даты. - Футер статьи —
<footer>— для тегов, ссылок, лицензии. Не путать с общим футером сайта. - Не дублируйте
h1— даже если на странице две статьи, у каждой должна быть своя страница с однимh1. - В
<head>обязательно:<title>— уникальный, до 60 символов.<meta name="description">— кратко о статье, до 160 символов.<link rel="canonical" href="...">— указывает "главную" версию URL.
- При ошибке 404 — возвращайте HTTP-статус 404, а не 200 OK. Иначе Google проиндексирует "пустышку".
- Не индексируйте служебные страницы (теги, категории, поиск) — запрещайте их в
robots.txt. - Контент должен быть уникальным. Избегайте автоматических описаний без смысла.
Следуя этим правилам, вы помогаете Google и Яндекс правильно индексировать ваш блог и повышаете шансы попасть в топ по техническим запросам.
Preload и preconnect: как ускорение сайта помогает SEO
Многие думают, что SEO — это только про ключевые слова и мета-теги. Но на самом деле скорость загрузки сайта — один из важнейших факторов ранжирования в Google и Яндекс.
Использование тегов и
напрямую влияет на производительность, а значит — и на позиции в поиске.
1. Что делает preconnect?
Этот тег говорит браузеру: «Начни соединение с внешним доменом заранее».
<link rel="preconnect" href="https://cdn.jsdelivr.net">
<link rel="preconnect" href="https://fonts.googleapis.com">
Он ускоряет:
- DNS-запрос
- TCP-рукопожатие
- SSL/TLS-аутентификацию
Особенно полезно, если вы подключаете скрипты или шрифты с CDN (например, Fancybox, Prism.js, Google Fonts). Экономия — до 300 мс на запрос.
2. Что делает preload?
Говорит браузеру: «Загрузи этот ресурс прямо сейчас, он важный».
<link rel="preload" as="style" href="/assets/dist/css/all.css">
Используйте для:
- Основного CSS-файла
- Ключевых шрифтов
- Важных скриптов (если нужно)
Без preload браузер может задержать загрузку стилей,
из-за чего страница долго рендерится — а это плохо для LCP (Largest Contentful Paint).
3. Как это влияет на SEO?
Google и Яндекс прямо учитывают скорость сайта в ранжировании:
- Core Web Vitals — метрики производительности (LCP, FID, CLS).
- Медленный сайт = хуже позиции, даже при хорошем контенте.
- Быстрая загрузка = меньше отказов, выше вовлечённость = лучше поведенческие сигналы.
preconnect и preload — простые, но мощные инструменты,
которые помогают улучшить эти метрики без изменения кода или дизайна.
4. Когда НЕ стоит использовать?
- preconnect — не добавляйте для десятков доменов. Хватит 1–3 критичных (CDN, шрифты).
- preload — не перегружайте. Только для действительно важных ресурсов. Иначе «съедите» пропускную способность.
Вывод: если ваш блог о Linux, системном администрировании или DevOps — вы и так заботитесь о производительности. Примените ту же логику к сайту: ускорение = лучшее SEO.
Скорость загрузки страницы: почему это критично для SEO и UX
Даже самый полезный контент провалится в поиске, если страница грузится дольше 3 секунд. Google и Яндекс прямо учитывают скорость как фактор ранжирования. А пользователи — просто закрывают вкладку.
Какие цели по скорости должны быть?
- Идеал: до 1–1.5 секунд — первоначальный рендер (FCP, LCP).
- Хорошо: до 2–3 секунд — приемлемо для большинства пользователей.
- Плохо: больше 3 секунд — рост отказов, падение позиций.
Проверяйте через: Google PageSpeed Insights, Web.Vision (Яндекс).
1. Оптимизация изображений — главный виновник тормозов
Не загружайте картинки "как есть" с камеры или скриншота. 1 МБ на изображение — это катастрофа для мобильных.
- Формат: используйте
.webpвместо.jpgили.png— на 30–50% меньше размер. - Сжатие: сжимайте JPEG с качеством 70–80% — разница незаметна, выигрыш — огромный.
- Размер: не грузите 2000px картинку, если она отображается в 400px. Масштабируйте заранее.
- Lazy loading: включайте отложенную загрузку:
<img src="image.jpg" loading="lazy" alt="описание">
2. Скрипты и стили — не перегружайте страницу
Каждый внешний скрипт — это задержка. Особенно если он в и блокирует рендер.
- Не встраивайте всё подряд: аналитика, виджеты, чаты — всё замедляет сайт.
- Откладывайте не критичные скрипты: используйте
asyncилиdefer:<script src="script.js" defer> - Убирайте неиспользуемый JS/CSS: минимизируйте, объединяйте, удаляйте балласт.
- Используйте CDN: например, jsDelivr — быстрый, бесплатный, кэшируется.
3. Кэширование — ваш лучший друг
Настройте браузерный кэш для статики:
Cache-Control: public, max-age=31536000
Это касается:
- CSS и JS файлов
- Изображений
- Шрифтов
Пользователь второй раз загружает сайт почти мгновенно.
4. Минимизация и сжатие (Gzip/Brotli)
- Minify: удаляйте пробелы, комментарии из CSS/JS.
- Gzip или Brotli: включите на сервере (Nginx/Apache) — сжимает HTML/CSS/JS в 3–5 раз.
5. Что проверить, если сайт медленный?
- Общий вес страницы (должен быть до 1.5 МБ, лучше — до 800 КБ).
- Количество HTTP-запросов (цель — до 30–40 на страницу).
- Размер изображений (никаких 1 МБ .jpg).
- Критический рендеринг: CSS/JS не должны блокировать отображение.
- Используется ли кэширование и CDN.
Вывод: скорость — это не роскошь, а необходимость. Если вы настраиваете сервера, пишете скрипты и оптимизируете системы — примените ту же логику к своему блогу. Быстрый сайт = больше трафика из поиска, меньше отказов, выше доверие.
Внешние ссылки: один хороший источник лучше тысячи "гвоздей"
До сих пор есть мнение, что "чем больше ссылок — тем лучше". Это устаревший и опасный миф. Современные поисковики (Google, Яндекс) давно научились отличать качественные ссылки от искусственного накрутчика.
Почему "гвоздосбор" не работает
Под "гвоздями" подразумеваются:
- Массовая закупка ссылок на биржах (x1000.ru, Sape и др.)
- Автоматические комментарии в блогах
- Ссылки с сайтов-дупликатов, казино, статей-холиваров
- Текст вроде: "Читайте тут → <a href='...'>как настроить Zabbix</a>"
Такие ссылки:
- Не передают вес — Яндекс и Google их игнорируют или считают "нулевыми".
- Могут навредить — при массовой закупке возможны подозрения в накрутке.
- Не влияют на поведенческие факторы — на них никто не кликает, они "мертвые".
Что такое хорошая ссылка?
Одна качественная ссылка стоит тысячи "гвоздей". Вот признаки настоящего ценного упоминания:
- Релевантный сайт — тематически близкий (например, IT-блог, DevOps-ресурс, open-source проект).
- Натуральное размещение — вас упомянули, потому что материал полезен, а не за деньги.
- Контекстная ссылка — в тексте, по смыслу: "Мне помогла статья <a href='https://blog.iotprof.ru/...'>про настройку Zabbix на FreeBSD</a>".
- Трафик и доверие — сайт живой, его читают, он в индексе, нет спама.
Пример: одна ссылка vs 1000 гвоздей
| Параметр | 1 хорошая ссылка | 1000 "гвоздей" |
|---|---|---|
| Передача веса | ✅ Да, высокая | ❌ Нет / минимальна |
| Доверие поисковика | ✅ Увеличивает | ❌ Может снизить |
| Реальный трафик | ✅ Есть (люди кликают) | ❌ Нет |
| Риск санкций | ✅ Нулевой | ❌ Высокий (особенно при массовой закупке) |
Что делать, если вы — автор технического блога?
- Пишите так, чтобы на вас хотели сослаться — глубокие, рабочие гайды с реальным опытом.
- Участвуйте в сообществах — Reddit, Хабр, Telegram-каналы, форумы. Полезный комментарий с ссылкой = натуральная ссылка.
- Не покупайте ссылки массово. Если очень надо — одна-две с тематических ресурсов, но лучше вообще без этого.
- Следите за ссылочной массой через Яндекс.Вебмастер и Google Search Console.
- Отказывайтесь от токсичных ссылок (если накручивали раньше) через инструменты вебмастеров.
Вывод: ссылки — это как репутация. Её нельзя купить за копейки. Но если вы настоящий эксперт, который решает реальные задачи — на вас начнут ссылаться сами. И тогда поисковики это заметят — не по количеству, а по качеству.
Удачи в продвижении!
Комментарии
Пока нет комментариев. Будьте первым!