Заголовки и шрифты

Зачем нужно как-то выделять заголовки на web-странице? Просто выделение жирным шрифтом недостаточно для робота - он не поймет, что это. То ли что-то важное выделили, то ли это заголовок.

Для заголовков используются тэги h1, h2, h3 и h4. На странице должен быть только один тэг h1, остальных тэгов может быть много.

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

ЗАГОЛОВОК h1 (обычно название страницы)
тест для посетителя

   ЗАГОЛОВОК h2 (важная первая часть страницы)
   текст для посетителя

      ЗАГОЛОВОК h3 (выделения названия какого-то абзаца)
      текст для посетителя

          ЗАГОЛОВОК h4 (какое важное уточнение)
          текст для посетителя

   ЗАГОЛОВОК h2 (важная вторая часть страницы)
   текст для посетителя

      ЗАГОЛОВОК h3 (выделения названия какого-то абзаца)
      текст для посетителя

          ЗАГОЛОВОК h4 (какое важное уточнение)
          текст для посетителя

Шрифты.

Все шрифты разделяются на две большие группы:
- шрифты без засечек (для заголовков статей) - пример Arial
- шрифты с насечками (для текста статей) - пример - New Times

Сравните

Вариант 1 Вариант 2

Название статьи

Текст статьи для посетителя сайта. Внимательно смотрим за края букв.		 Название статьи

Текст статьи для посетителя сайта. Внимательно смотрим за края букв.

Вариант 1 читается лучше (удобнее, комфортнее). Почему?

Название статьи - шрифт Arial без засечек. В тексте используется New Times, где на краях букв сделаны засечки. Они нужны, что бы глаз лучше цеплялся за мелкие детали. И слово "цеплялся" - это не фигура речи, это так есть на самом деле.

Вот так крупно



Глаза человека не смотрят постоянно в одну точку, они постоянно сканируют, что находится перед человеком. Фактически, зрачок непрерывно совершаем мелкие движения, за которые отвечает саккадирующий центр.

Саккады (от старинного французского слова, переводимого как «хлопок паруса») — быстрые, строго согласованные движения глаз, происходящие одновременно и в одном направлении. Саккады играют существенную роль в целенаправленном поведении, зрительном восприятии, исследовании окружающего мира и в полной мере развиты только у приматов. Специалисты нередко применяют термин «микросаккады» к быстрым движениям глаз, амплитуда которых не превышает 1 угл. град. А быстрые движения глаз амплитудой более 1 градуса называет «макросаккадами».

Содержимое раздела "Юзабилити"

  • Форма обратной связи (56278)

    Рассмотрим самый простой вариант формы обратной связи. Как сделать форму обратной связи на HTML? Вот такую?Работу формы можно посмотреть на сайте www.titovsergei.ruЧестный ответ - никак, HTML - это язык разметки (т.е. можно сделать только "скелет" формы), а нам нужны действия с данными. Как минимум нужна связка HTML+PHP. Причем данная связка будет работать только...

  • Юзабилити (2670)

  • Якорь html (1407)

    Три основных вопроса:1. Что это?2. Зачем мне это нужно?3. Как это работает?1. Итак - что это?Якорем называется закладка с уникальным именем на определенном месте веб-страницы, предназначенная для создания перехода к ней по ссылке. Якоря удобно применять в документах большого объема, чтобы можно было быстро переходить к нужному разделу. Ссылка с якорем содержит символ #, после которого идёт идентификатор.Переход пользователя по ссылке на якорь приводит...

  • Раздел "контакты" (1386)

    Мы хотим получить от пользователя обратную связь.Можно использовать:1. Форму обратной связи на сайте2. Номер телефона для связи3. Адрес электронной почтыНадо исходить из того, что бы пользователю было как можно проще. В этом отношении идеальный вариант - форма обратной связи. Нужно только написать и нажать кнопку "Отправить". Для варианта телефон...

  • Хлебные крошки (972)

  • Глубина просмотра (843)

    Что такое глубина просмотра, зачем она нужна и где ее можно посмотреть?Глубина просмотра сайта - один из основных параметров сайта, который сильно влияет на его продвижение. Количество просмотренных страниц делится на число визитов - получается в среднем, сколько страниц просмотрел один...

  • Заголовки и шрифты (782)

    Зачем нужно как-то выделять заголовки на web-странице? Просто выделение жирным шрифтом недостаточно для робота - он не поймет, что это. То ли что-то важное выделили, то ли это заголовок.Для заголовков используются тэги h1, h2, h3 и h4. На странице должен быть только один тэг h1, остальных тэгов...