Важность проектирования для лучшей читаемости

Важность проектирования для читаемости

Текст не является второстепенным в процессе проектирования. Его нужно рассматривать в первую очередь.

Читаемость  не должна создавать проблем, когда дело доходит до любого дизайн-проекта. Если текст не может быть прочитан, то почему вы не проектируете его в первую очередь? Хороший дизайн обеспечивает понятное, доступное содержание, удобную читаемость. Сегодня мы будем обсуждать, как проектировать дизайн, так чтобы ваши проекты было легко читать.

Что такое читаемость?

Мы много говорим о читаемости, когда речь заходит о дизайне. Но читаемость, и легко читаемый, разборчивый текст, это не совсем одно и то же. 

Читаемость —  это легкость, с которой текст может быть прочитан. Постижение смысла, быстрое прочтение и понимание написанного является ключевым фактором с точки зрения читаемости.  Читаемый текст легко можно рассмотреть даже издалека.

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

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

Длина строки

normal-text large-text

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

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

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

Что в цифровых проектах, измеряется в пикселях?

Ваш документ 600 пикселей в ширину, текст будет 18-19 пунктов (600/16 = 37.5 / 2 = 18,75). 

Что касается текста, оптимальное количество составляет от 50 до 60 символов в строке. Этот диапазон может быть расширен до определенной степени в зависимости от стиля сайта и используемого устройства. Для большинства проектов оптимальный диапазон для настольных устройств составляет от 45 до 75 символов в строке. Оптимальный диапазон для мобильных устройств составляет от 35 до 50 символов в строке.

Пространство и Контраст

contrast2

текстовый контраст

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

В каких случаях длина строки и расстояние между строками крайне важно? Рекомендуется, чтобы расстояние между строками текста (межстрочное) составляло не менее 130-150 процентов от размера шрифта.  Что оставляет много места для каждой строки в больших блоках текста для чтения. Как и в случае длины строки, слишком много или слишком мало пространства между строками, может сделать текст сложным для понимания.

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

Черный и белый.

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

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

Переносы слов и перерывы

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

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

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

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

центровка

alignment

выравнивание текста

Если текст находится в центре, слева, или на правой стороне документа или экрана – это имеет важное значение и может в значительной степени влиять на читаемость. Выравнивание текста по левому краю удобно для чтения, так как мы читаем слева направо. Мы знаем, где каждая строка заканчивается и где начинается следующая.

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

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

Инструменты читаемости

The Readability Test Tool: Введите URL (или блок текста напрямую) и получите математически вычисленный показатель читаемости. Вы получаете быстрые и понятные результаты по уровню чтения, оценкам по ряду показателей читаемости, а также общий анализ. Инструмент также включает в себя отличный «bookmarklet».

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

Juicy Studio Readability Test: Узнайте больше о различных тестах и наборах инструкций для читаемости и постарайтесь понять, каким образом каждое из этих средств может относиться к вашим проектам.

Information Architects “The 100% Easy-2-Read Standard:” Статься «100% Easy-2-Read Стандарт» была написана в 2006 году и включает в себя различные перечни видов читаемости. Хотя, это в первую очередь относится к веб-дизайну, многие из советов являются актуальными и по сегодняшний день.

30.05.2016


Предыдущий пост

Следующий пост