Есть ли какие-либо исследования относительно того, как шрифт-вес влияет на читаемость?

Есть ли какие-либо исследования относительно того, как шрифт-вес влияет на читаемость?

Очевидно, что есть какое-то отношение, но я изо всех сил пытаюсь принять решение, основанное на каких-либо фактах.

Я создал jsFiddle, который демонстрирует мою проблему , или вы можете посмотреть снимок экрана ниже.

Top имеет размер шрифта 100. Внизу 400.

Я лично предпочитаю название с помощью font-weight:100;, поскольку он более гладкий, современный и т. д., но я беспокоюсь, что другие могут не быть в состоянии прочитать его очень хорошо, когда на этой странице есть много этих оберток. Кроме того, мне кажется, что «текст содержания» под заголовком тяжелее и отводит глаз от названия.

11 голосов | спросил user41353 26 FebruaryEurope/MoscowbWed, 26 Feb 2014 07:43:28 +0400000000amWed, 26 Feb 2014 07:43:28 +040014 2014, 07:43:28

2 ответа


21

Я чувствую, что здесь у вас очень разные вопросы.

Чтобы ответить на свой первый вопрос:

  

- некоторые исследования в отношении того, как шрифт-вес влияет на читаемость?

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

Исследования показали, что читаемость имеет тенденцию к увеличению при использовании «нормального» или «обычного» веса шрифта (т. е. 400). Причиной этого является то, что когда слова и предложения могут быстро читать, глаза читателя фактически замедляют их нормальную мигающую скорость, что позволяет пользователю не уставать читать в течение длительных периодов времени. Тем не менее, когда более легкие или более тяжелые веса используются в больших блоках текста, читатели, как правило, моргают больше, потому что им приходится больше сосредоточиться на чтении. Вес более легкого типа вводит больше отрицательного пространства, а вес более тяжелого типа вводит больше положительного пространства. Оба требуют, чтобы читатели больше концентрировались.

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

Источники:


Чтобы ответить на второй вопрос:

  

Итак, вот скрипка, над которой я работаю над http://jsfiddle.net/T7b6E/

     

Я лично предпочитаю название со шрифтом: 100 (более гладкий, современный и т. д.)

Первое, что нужно помнить, состоит в том, что просто использование font-weight: 100; в HTML фактически не создает более легкий шрифт . Вес должен быть в шрифте. Большинство стандартных шрифтов там входят в 2 веса (4 стиля): Regular, Italic, Bold и Bold Italic. В HTML font-weight: 400 и font-weight: 700. Если шрифт, который вы пытаетесь применить к другому шрифту, не имеет такого веса, браузер попытается приблизиться к тому, что он мог бы мог выглядеть. И это может быть неправильно. И в зависимости от операционных систем и даже браузеров это может выглядеть совсем по-другому.

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

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

ответил Hynes 26 FebruaryEurope/MoscowbWed, 26 Feb 2014 08:21:19 +0400000000amWed, 26 Feb 2014 08:21:19 +040014 2014, 08:21:19
2

Ответ Хайнса велик, я просто хочу что-то добавить.

Доступность

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

В правиле указано:

  

1.4.3 Контрастность (минимум): визуальное представление текста и изображений текста имеет коэффициент контрастности не менее 4,5: 1, за исключением следующего: (Уровень AA)

     
  • Большой текст: крупноформатный текст и изображения крупноформатного текста имеют коэффициент контрастности не менее 3: 1;
  •   
  • Случайные: текст или изображения текста, которые являются частью неактивного компонента пользовательского интерфейса, которые являются чистым украшением, которые не видны никому, или которые являются частью изображения, содержащего значительный другой визуальный контент, не имеют требования к контрасту .
  •   
  • Логотипы: текст, являющийся частью логотипа или торговой марки, не имеет минимальных требований к контрастности.
  •   

(акцент мой)

Крупноформатный шрифт определяется шрифтом шрифта размером 18pt или 14pt жирным шрифтом .

Это означает, что шрифт 14pt, выделенный полужирным шрифтом, имеет, по существу, такую ​​же читаемость, как обычный шрифт 18pt. В той же ссылке W3 говорит:

  

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

ответил DasBeasto 11 Jpm1000000pmMon, 11 Jan 2016 19:10:21 +030016 2016, 19:10:21

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132