Итак чтобы пользователь понял, что же на странице главное, на что обратить внимание в первую очередь, что почитать потом, он должен видеть визуальные знаки, которые бы давали это понять. Язык HTML, как язык разметки, дал нам эти знаки изначально. Структура любого документа выглядит так:
Главный Заголовок – это самое важное на странице, самый главные слова, фраза и соответствующее оформление, тег h1 ! У вас нет на странице тега h1 ? значит на вашей странице нет важной информации.
Вступительный текст - более подробное разъяснение заголовка, какая то другая инфорамация, чуть менее важная, чем заголовок – выделите для него тег h2.
Абзац – Далее по ситуации можно использовать теги h3, h4, если есть части текста, которые менее значимы, чем то что в h1 и h2. Например начало абзаца.
Параграф – следующая структурная составляющая. Оформляется тегом p, отступы никакие после параграфа не нужны, они формируются автоматически.
Оформление текста внутри параграфа, выделить жирным шрифтом, курсивом используем тег span и соответствующее правило CSS.
Пример. Сайт Консультант- плюс. Из всех способов выделить текст применены - выделение цветом, цвет везде один, из-за этого все сливается в одно пятно,
жирное начертание, размер шрифта, все…
Pic 1. Обзор федерального законодательства.
Pic 2. Переходим к статье.
Спрашивается зачем писать огромными буквами Аналитический обзор, если я именно его и шел посмотреть по ссылке ! Вверху есть меню, которе правда почти не видно, и там можно заметить, что мы смотрим документ “Аналитический обзор недели” и после просмотра можем вернуться обратно.
Pic 3. Слабое меню.
А вот как должно все это выглядеть, если следовать элементарным правилам разметки документов.
Pic 4. Правильное оформление.
Так и хочется сказать. Господа наймите хорошего дизайнера или специалиста по юзабилити и привидете в порядок свой сайт.
Ведь его читают люди !
Related posts:
- Дизайн, тренды, все на одной странице.
- Веб-дизайн: книга Стива Круга или “не заставляйте меня думать!”
- На вашем сайте можно заблудится как в трех соснах ? Протестируйте его на удобство навигации
- 3 эссе – фиксированные блоки, оригинальный дизайн блога, новое лицо у подвала сайта
- Горизонтальное меню, плюсы и минусы, варианты использования