Как писать статьи: оптимизация и оформление

Здравствуйте, читатели блога Webvim. Не знаете как правильно писать статьи для сайтов и блогов в интернете? Не беда! Сегодня я расскажу про правила оформления текста, которые использую сам. SEO оптимизация позволяет поисковым системам лучше понимать содержание статьи и повышает шанс занять высокие позиции в выдаче. Без правильной разметки действие других факторов ранжирования будет сведено к минимуму. Итак, разделим их на две части: логическую и визуальную. Логическая — передает смысл, визуальная — делает текст удобным для читателя.

Заголовки

Html разметка текста и заголовкаЗаголовки служат для разделения статьи на смысловые блоки как для читателя, так и в качестве seo оптимизации для поисковиков.  Это теги h1 — h6. Я использую только h1, h2 и h3, дробить текст больше — не было необходимости.

  • h1 — основное название статьи;
  • Не более 1 тега h1 на страницу;
  • Для подзаголовков используем h2 и h3;
  • Соблюдаем иерархию (внутри h3 не может появиться h2 и т. д.);
  • В конце заголовка точку не ставим;
  • После каждого заголовка идут минимум 2 абзаца.

Рекомендую использовать в заголовках ключевики, по которым продвигаем статью, естественно, в разумных пределах.

Не забываем про визуальное оформление заголовков в статье. Читатель, глянув на текст, должен сразу их заметить:

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

Списки

Если мы перечисляем 3 и более предметов — рекомендую использовать списки. Они бывают нумерованные (ol) и ненумерованные (ul). Намного чаще использую вторые.

Как писать статьи для продвижения сайта

Согласитесь, вариант со списком выглядит лучше.

Еще одна частая ошибка блогеров — использование вместо списка обычных абзацев с символами тире или минуса. Визуально это еще можно переварить, но для SEO — это полный ноль!

Если кратко, то:

  • Не пишем тире и минус для маркеров, маркеры появятся автоматически;
  • В конце каждого пункта в списке ставим точку с запятой, кроме последнего — там точка;
  • Делаем отступ от самого списка (ul) не меньше, чем у абзацев.

Ссылки

Правила оформления ссылок в тексте еще проще: сделайте так, чтобы читатель понял что это ссылка. Как ссылки выглядят у меня:

  • Выделена цветом отличным от цвета текста (пример ссылки);
  • Ссылка реагирует на наведение (меняет цвет, появляется/исчезает подчеркивание);
  • Не использую подчеркивание для других элементов.

Последний пункт напрямую к ссылкам не относится, но крайне важен! Еще с тех времен, когда все ссылки имели подчеркивание, у пользователей в подсознании заложено, что клик по любому элементу с подчеркиванием перенесет нас на другую страницу, т. е. это активный элемент. Сейчас часто встречаю сайты, на которых подчеркнуты заголовки — убирайте! Этим вы вводите своего читателя в заблуждение, да и визуально это утяжеляет текст.

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

Абзацы

Вроде что может быть проще абзацев, но, судя по тем сайтам, что я редактирую на работе — это частая ошибка. Порой текст вообще не разбивают на абзацы. Еще чаще отступ между двумя абзацами делают с помощью пустой строки.

Как делать отступ между абзацами неправильноКратко:

  • Разбиваем весь текст на абзацы;
  • Делаем отступ между ними с помощью стилей css.

Картинки

 Что делаем с картинками:

  • Оптимизируем их для web;
  • Добавляем описание к картинке alt и title — это привлечет посетителей с поиска по картинкам;
  • Задаем отступ картинке, чтобы она не соприкасалась с текстом. 

Длинный текст без картинок выглядит монотонно, не заставляйте посетителя засыпать за чтением.

Эти простые правила применимы как к автономным блогам, так и к сервисам Livejournal, Blogger и подобным.

P. S. Если я забыл про какой-то элемент — напишите мне об этом, я добавлю. Удачи вам!