}

Актуальная проблема

4 января 2013 г.

Какой выбрать шрифт для блога

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

Одним из таких факторов является шрифт текста.

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

Как сделать шрифты лёгкими и удобными в восприятии и чтении

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




  1. Мелкий  шрифт.  Текст, написанный мелким шрифтом, не воспринимается.  Читать такой  текст не только неудобно, но даже вредно: Легко ли Вам читать, что здесь написано? Или приходится сильно напрягать глаза?
  2. Крупный шрифт.  Текст, написанный крупным шрифтом, не читается.   Такой  текст выглядит стеной и  отталкивает.
  3. Пестрота шрифтов. Текст, написанный разными шрифтами, выглядит, как новогодняя ёлка.  
    Этот текст написан с применением разных шрифтов и их начертаний. Как видите, его довольно неудобно читать.  Было бы лучше, если бы он весь был написан одним шрифтом, правда?
  4. Читать такие тексты трудно из-за  отсутствия цельности:  многообразие шрифтов потребляет  внимание.
  5. Некоторые шрифты неудобно читать
  6. Этот  шрифт  неудобно читать
    Такой  шрифт тоже  неудобно читать

Каков наиболее оптимальный вариант выбора шрифта

Тип шрифта

Выделяют три типа шрифтов

Шрифт с засечками: АБВГДЕ абвгде WWII
Рубленый шрифт: АБВГДЕ абвгде WWII
Моноширинный шрифт: АБВГДЕ абвгде WWII

Шрифты с засечками (такие как:  Georgia,  Times  New Roman  и др.) больше подходят для печатной бумажной  продукции. На бумаге они хорошо читаются вследствие того, что засечки образуют чёткие линии или контуры, которые цепляют глаз.

На экране монитора из-за сложностей пиксельной сетки засечки размываются и "расшатываются", создаётся   рябь  текста. "Дрожащий" текст  читать очень сложно. 

Для чтения с экрана мониторов предпочтение отдаётся рубленым шрифтам без засечек (в Вебе чаще всего используются два шрифта без засечек:  Arial и   Verdana). Тексты с рублеными шрифтами хорошо управляют вниманием. Шрифты без засечек легко  читаются,  их удобно применять практически для любых целей, они  отлично подходят для больших текстовых фрагментов, где важнее всего должна соблюдаться удобочитаемость.

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

Моноширинные шрифты применяются в HTML и CSS  для написания кода, чтобы символы аккуратно выстраивались в строки и столбцы.

Размер шрифта  

Самым оптимальным размером шрифта для основного текста является 11-12px.  Не рекомендуется использовать шрифт  для текста меньше 10px.

Подзаголовки (h1-h3) должны отображаться размером, превосходящим размер шрифта, используемого для обычного текста: 20px,  16px,  14px.

Цвет шрифта

Основное правило, которое должно соблюдаться, гласит: цвет шрифта текста  должен быть контрастен фону страницы.

Этот текст читается легко



А этот текст читается с трудом



Этот текст читается с большим трудом



И этот текст тоже



Читая этот текст, можно сойти с ума



Чёрным по белому - классический вариант


Сколько шрифтов необходимо использовать в блоге

В качестве основного правила рекомендуется использовать как минимум  три различных  шрифтов: шрифт для логотипа (названия), он может быть нестандартным, в частности, в логотипах хорошо смотрятся декоративные шрифты, шрифт для заголовков (к примеру, Arial) и шрифт для основного текста (к примеру, Verdana).

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





Не перегружайте дизайн чрезмерным разнообразием шрифтов.

Комментариев нет:

Отправить комментарий