H1 – главный заголовок шаблона, который используется один раз, желательно вверху страницы

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

H2 – второй по важности заголовок (подзаголовок)

Вы можете использовать подзаголовок как заголовок части текста. В отличии от H1, H2-H6 можно использовать более одного раза на странице.

H3 – подзаголовок абзаца

Часть текста с подзаголовком H2 может быть разбита на абзацы, каждый из которых имеет подзаголовок H3. Он так же может повторятся на странице более одного раза.

H4-H6 – подзаголовки, разбивающие текст с подзаголовком H3 на более мелкие тексты с подзаголовками

Важно, чтобы подзаголовки имели правильную структуру вложенности. Блок текста с подзаголовком H2 разбивается на блоки с подзаголовками H3, которые, в свою очередь, можно разбить на текст с подзаголовками H4 и так далее.

Вот так выглядит подзаголовок H5
Вот так выглядит подзаголовок H6

Цитата – это отдельно оформленный текст с собственной стилистикой, который вы можете оформить в редакторе стилей системы управления сайтом.

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

Жирным стоит выделить те части текста, на которые вы хотите обратить особое внимание посетителя.

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

Используйте надстрочные и подстрочные знаки для корректного отображения определенных обозначений, например писать 10 М2 некорректно, нужно использовать 10 м2 для корректного отображения единицы измерения (квадратных метров).

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

Списки позволят красиво и удобно подать блоки информации с перечисляемым контентом, например:

  1. Элемент списка №1;
  2. Элемент списка №2;
  3. Элемент списка №3 и так далее.

Или так:

  • Элемент списка №1;
  • Элемент списка №2;
  • Элемент списка №3 и так далее.

Увеличенные отступы

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

Выравнивание текста по левому краю

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

Выравнивание текста по центру

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

Выравнивание текста по правому краю

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

Выравнивание текста по ширине

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

Таблицы

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

Придерживайтесь корректной структуры таблицы, а именно:

  1. Первая строчка (или первые несколько строчек) – это заголовок таблицы.
  2. Все остальные строки – это тело таблицы с основной информацией.
  3. Нижняя строка (одна или несколько) – это низ таблицы.

Пример

Заголовок таблицы Данные №1 Данные №2
Данные в строке №1 Дополнительно №1 2000 4500
Данные в строке №2 Дополнительно №2 2400 7500
Данные в строке №3 Дополнительно №3 6400 19500
Нижняя строчка таблицы с дополнительными данными

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

Абзацы и перенос строк

При вводе текста в редакторе вы можете создать новый абзац, нажав на клавиатуре клавишу Enter или сделать перенос строки в рамках абзаца с помощью сочетание клавиш Shift+Enter. Разница в том, что отступ при переносе строки внутри абзаца между новой строкой текста и той, что над ней, будет небольшим (равным отступу между строками), а в новом абзаце отступ обычно больше. Кроме этого, некоторые функции и стили применяются к абзацу целиком, например левый или правый увеличенный отступы, или превращение текста в заголовок или список. Если вы используете перенос строки, а не абзац, то стиль применится как к новой строке текста, так и к предыдущей.

Использование изображений

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

up