Оптимизация сайта

Верстка статьи на сайте

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

Рассмотрим основные условия для оформления статьи. Это будут индивидуальные рекомендации и прислушиваться к ним или нет — выбор каждого человека.

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

Подзаголовки h2

Сплошной текст без подзаголовков – это журнальный вариант или газетная статья. Это истории, рассказы, книги, что угодно, но только не информационная статья. Почти все ресурсы уделяют этому внимание. Но добавлю, h2 можно задать цветом.

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

Свой пример я приводить не буду, я не уверена, что он правильный, но у меня работает и хорошо.

Нумерованные и маркированные списки

Здесь сложно, потому что не все статьи легко написать со списками (перечнями). Особенно, если автор углубился в повествование темы, то список будет выглядеть в рассказе глуповато. В больших статьях, а это от 5000 символов и более – списки обязательны.

Спросите для чего? Для структурирования информации, так мы подаем ее в интересном виде и она лучше запоминается.

Нумерованному списку можно сразу задать красивый вид, не просто какие-то цифры бледные, а например, цифры в кружках, квадратах. Делается это добавлением кода в файл CSS.

Подзаголовки h3

Они добавляются, если в рамках одного h2 информация делится на несколько частей и каждой части для лучшего понимания дается пояснение.

Наглядно выглядит приблизительно так:

H2 – Ортодонтическое исправление зубов

• 1. Виниры – H3

Делаем описание и раскрываем суть абзаца.

• 2. Люминиры – H3

Также подробно все расписываем, вот у нас получился 1 – h2 и 2 подзаголовка — h3.

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

Фотографии

Ранее добавляли маленькие и незаметные фотки. Они стояли где-то сбоку, как что-то ненужное. Наступила эра широкоформатных фото с качественной обработкой. Если фотография большая и четкая (созданная на профессиональной камере) – красиво. Их нужно оптимизировать по весу без потери качества. Одна фотография не должна превышать 1 Мб, можно меньше.

Сколько фоток добавлять в статью? Смотрите на размер статьи. Если  рассказ из фотографий, то много. Для стандартной статьи я беру 3 фотографии, шириной по полю контента – 840 рх и высотой 600 рх. На каждом сайте поле разное, нужно смотреть, как размещать, чтобы смотрелось красиво.

Выделение главных мыслей

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

Выглядят они, как прямоугольники с различными элементами. Я себе сделала вот такое выделение через код в CSS:

В WordPress существует плагин WP-Note с его помощью можно легко подсвечивать куски текста и это напоминает разноцветный маркер. Такая подсветка выглядит немного примитивно.

Существует и более функциональный аналог — Drop Shadow Boxes. Его легко найти в панели управления сайтом.

Выделения получаются немного примитивными, но в целом, интересными. Лучше с ними, чем без них. Как им пользоваться? Все понятно – выделяем текст, копируем его в буфер – добавляем оформление – цвет фона и рамки и все. Удобно, что сразу можно видеть результат.

Видео по теме

Видео по теме, но необязательно, его добавляют и предпочитают послушать информацию, а не читать статью. Красиво видео смотрится в конце статьи, некрасиво – в середине или в начале. В начале – жесть. Зачем тогда статья, если поставили сразу видео?

Все на странице должно быть на своем месте, гармонично и красиво! Ничего не должно отталкивать или вызывать скуку, важно правильно подавать LSi статьи.

Разбиение текста

Если автор не научился разбивать информацию на 3-4 строки и пробел, нужно обратить на это внимание. Это важно. Часто пишут одно предложение в три строчки и потом следом такое же предложение. Быстро это читается в том случае, если темп быстрый.

Интересное: