Лучшие шрифты для улучшения опыта чтения


13

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

http://iura.cl/cc/44

Как видите, я удалил все, что на данный момент использую Telex webfont. У меня также есть опция для ночного чтения, которая должна уменьшить блики:

http://iura.cl/cc/44?estilo=nocturno

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


2
«Какой шрифт вы рекомендуете» - это просто слишком широкий вопрос, чтобы мы могли на него ответить. Также обратите внимание, что, хотя шрифт, безусловно, является основной частью того, насколько «читабельным» является что-то, существует также множество других переменных (ширина столбца, межстрочный интервал, цвет, подсказка, расположение и т. Д.)
DA01

@ DA01 может быть, есть руководство, которое вы могли бы порекомендовать?
Дан


1
Вопрос мне подходит - это не «Какой шрифт вы рекомендуете», а «Как выбрать шрифт с высокой читаемостью для веб-сайта » - куча критериев.
user56reinstatemonica8

Ответы:


10

На самом деле есть несколько довольно простых принципов, если ваш критерий номер один - это шрифт с высокой читабельностью для веб-сайта .

  1. Подумайте о мейнстриме. Благодаря этому @font-faceвы можете выбирать из тысяч и тысяч шрифтов, но менее популярные или более новые шрифты часто имеют проблемы с рендерингом между браузерами и операционными системами, иногда даже если они происходят из уважаемых основ. Если читаемость является вашим приоритетом, и вы не хотите проводить массовые кросс-браузерные кросс-тестовые тесты ОС, вы, возможно, захотите играть безопасно и использовать надежный, проверенный и протестированный шрифт. Старые веб-безопасные шрифты любят Verdanaи Georgiaявляются безопасными ставками, поскольку они так широко используются, что они будут протестированы даже в более редких настройках браузера / ОС. Кроме того, знакомство помогает читабельности.
  2. Высокая х-высота и широкая. Вы не знаете, каково качество или плотность пикселей экрана вашего считывателя, поэтому, если вы отдаете предпочтение удобству чтения, убедитесь, что важные отличительные черты букв очень ясны. Шрифты, разработанные для удобочитаемости в Интернете, например, Verdanaи Georgiaиспользуют как можно больше своих пикселей для высоты х, где находятся ключевые детали буквы, и используют минимальные пиксели на восходящих или спускающихся элементах, где достаточно одного или двух пикселей, чтобы легко Скажите bот oили p.
  3. Не слишком легкий Светлый тип отлично смотрится на экранах с печатью или с высокой плотностью пикселей - но есть веская причина, почему он редко использовался на экранах до ios7 и был спорным даже тогда: если зритель не просматривает в оптимальных условиях, как высококачественный экран в устойчивом внутреннее освещение, это рискует читаемостью. Перейти на шрифт с хорошим твердым обычным весом - я упоминал Verdanaи Georgia?

Есть множество шрифтов, которые соответствуют этим критериям, кроме Verdanaи Georgia, конечно, и эти два иногда считаются немного скучными, потому что вплоть до 2009 года или около того, когда @fontface стал широко использоваться, они были популярными шрифтами для большей части Интернета ,

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


Edit: Когда webtype продавцы и foundaries действительно идут в проблему тестирования для хорошей читаемости, они , вероятно , кричать об этом в своем маркетинге. Например, веб-сериал «Чтение края» (хет- крис для Криса Бертона, который упомянул об этом здесь ). Тем не менее, делать тесты широко.


1
Я не дизайнер, и у меня есть проблемы с глазами. Мне нравится читать некоторые законодательные тексты, но я думаю, что бразильский сайт иногда причиняет боль, поэтому я принял ваше предложение (Verdana) и вставил плагин « Стильный» , высотой 1,5 строки, размером шрифта 16 пикселей и черным цветом. Мне сейчас очень удобно.
Фабио Монтефусколо

5

Хорошо, я собираюсь пойти дальше и высказать свои мысли по этому поводу. Не существует окончательного «лучшего шрифта», и не может быть, потому что выбор шрифта зависит от многих различных аспектов. Что может быть, так это «лучший способ выбора шрифта».

Итак, нужно учитывать, что нужно выбрать лучший шрифт для вашего проекта;

Мультимедиа: как будет отображаться шрифт, бумага, холст, онлайн, портативное устройство и т. Д. Вы хотите убедиться, что выбираете шрифт, соответствующий носителю, на котором он будет отображаться, например, блок Times New Roman Это может быть хорошо для печатного документа, но на экране (особенно на маленьком экране) блок Times New Roman может быть довольно трудным для чтения. Вы также хотите узнать, что доступно вам, если вы ограничены веб-шрифтами, здесь вам могут помочь такие ресурсы, как шрифты Google . (Из Википедии: «Веб-безопасные шрифты» Веб-безопасные шрифты - это шрифты, которые, вероятно, присутствуют в широком спектре компьютерных систем и используются авторами веб-контента для повышения вероятности того, что контент отображается в выбранном ими шрифте. Если посетитель веб-сайта у сайта нет указанного шрифта, его браузер пытается выбрать аналогичную альтернативу на основе указанных автором запасных шрифтов и родовых семейств или использует подстановку шрифтов, определенную в операционной системе посетителя. ")

Аудитория. Подумайте, кто это будет читать. Маленькому ребенку может быть лучше без шрифта на основе засечек или отдельной истории «а», а не двойной истории «а» . Однако, если бы это было, скажем, приглашение на свадьбу, то шрифты, такие как Edwardian Script, - это то, что очень популярно в этом контексте, потому что давайте посмотрим правде в глаза, чем больше засечек, тем декоративнее они лучше - по мнению некоторых невест;), хотя даже это декоративный материал используется в основном для заголовков, а не для всего контента. Как мудрый ол

Контраст / Цвет: Опять же, это то, что нужно учитывать с точки зрения вашего проекта. Конечно, вы не хотите слепить людей из-за ужасно высокого контраста или давать им морщины от косоглазия от чего-то, что имеет ужасно низкий контраст - эта часть очевидна. Но в зависимости от вашей цветовой схемы вы можете поиграть с настройками яркости и контрастности. Вы заметите , что GD.SE, например , не совсем черный и полностью белый (как спросил и ответил здесь ) - он имеет более низкую контрастность , чем, следовательно , это довольно просто посмотреть на этом сайте в течение очень длительного периода времени по сравнению чтобы смотреть на что-то с гораздо более высоким контрастом - ваши глаза устали бы!

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

Сколько: В зависимости от ваших медиа, аудитории и контента вы можете выбрать несколько шрифтов. Из этого я предлагаю быть осторожным. Вы наверняка не хотите путать содержание. Суть шрифта в том, чтобы что-то сообщить, то, что вы ищете, - это способ сделать это наиболее эффективно. Слишком много шрифтов может сбивать с толку, хотя один шрифт иногда может быть скучным. Как правило, смешивание с точки зрения жирного шрифта / курсива и размера, возможно, с двумя шрифтами, - это то, что имеет место. Сопряжение шрифтов обсуждается немного больше здесь .

Вот некоторые из аспектов, которые вам следует сузить, если вы идете с чистого листа, но, несмотря на то, что многое нужно учитывать, когда дело доходит до этого, это не так уж плохо. Ценность выбора правильного шрифта / шрифтов на ранней стадии проекта не имеет никакого сравнения! Здесь больше о факторах, которые следует учитывать при выборе шрифта здесь.

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

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

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

Надеюсь, я помог и не слишком много путешествовал, я немного увлечен правильным шрифтом :) Удачи в вашем проекте.


2

Я считаю, что шрифты с засечками, как правило, легче для глаз при длительном чтении. Для лучшего восприятия я думаю, что шрифт с засечками, такой как Adobe Garamond, работает хорошо. Это не так "бла", как Times. В засечках есть несколько интересных кривых, которые помогают сделать его немного более «чистым» в том, что касается шрифтов с засечками.

введите описание изображения здесь

Вот статья на эту тему, с которой я склонен согласиться:

Serif vs. Sans: финальная битва


1
Не существует убедительных доказательств того, что лица с засечками более или менее читабельны, чем лица без засечек. Единственное исключение будет на экране, где дисплеи с более низким разрешением могут затруднить рендеринг деталей с засечками.
DA01

1
Гарамонд может быть красивым, но его низкое отношение экс-к-Эм ухудшит разборчивость, если он будет использоваться в качестве основного шрифта. Шрифты с засечками с более щедрыми экс-высотами включают Грузию, Битстрим Хартия и Харис SIL.
Гэвин Р. Путланд

@ GavinR.Putland Не могли бы вы рассказать о соотношении ex / em? Это может ухудшить читаемость, только если межстрочный интервал слишком мал = неверен. Рекомендуется интервал не менее 140%.
Михаил V

@ DA01 Я заметил тенденцию, когда люди упоминают некоторые аргументы «доказательств». Как эксперт, я могу сказать, что Garamond-подобные шрифты наиболее читабельны, и то же самое скажут вам другие эксперты по типографии. Разве это не «доказательство» для вас?
Михаил V

@MikhailV это не доказательство. Это мнение. Какие доказательства там (которые минимальны) имеют тенденцию склоняться к тому, что «самые читаемые лица - это лица, которые человек наиболее хорошо читает»
DA01

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.