Оформление заголовков

Заголовок и следующий за ним контент, будь то текст или картинка должны быть сближены относительно других объектов на странице. Назовём это правилом близости заголовка к объекту. Чаще всего это касается оформления заголовков h2 и h3.

Пример из жизни:


Хорошо (Яндекс):


Плохо (половина сайтов в Интернете):



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


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

Мой контраргумент: "Если написать, например слово "агенство" именно так, как в кавычках, то все поймут суть слова, но часть читателей заметят в нём ошибку. Прошу обратить внимание, ошибку заметит образованная часть читателей. По мне так, с заголовками похожая ситуация. 
А теперь для примера стили на нашем сайте:

Заголовок H1

Текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца

Заголовок H2

Текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца

Заголовок H3

Текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца

Заголовок H4

Текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца текст абзаца

В том, что так получается отчасти виноваты новомодные шаблоны (например, самый популярный PORTO
http://preview.oklerthemes.com/?theme=Porto), которые на самом деле в мелочах оказываются безвкусны.

Чтение правильно оформленного текста доставляет ещё и эстетическое удовольствие.
Давайте делать для людей.


29.10.2015, 940 просмотров.