Размер шрифта пусть выбирают сами пользователи - Текст и контент - Webmascon

| WEBMASCON - журнал для веб-мастеров обновление |12.09.2003

| Текст и контент

Начало
Темы
Архив
Daily
Персоналии
Форумы
Отзывы
О сайте

все статьи на тему Текст и контент

# Размер шрифта пусть выбирают сами пользователи

Let Users Control Font Size (August 19, 2002)
© Copyright Якоб Нильсен © перевод, Александр Качанов распечатать

Вкратце: Мелкий текст тиранизирует пользователей чрезвычайно замедляя выполнение поставленной перед ним задачи. У броузера Internet Explorer 4 был прекрасный дизайн, который позволял пользователям менять размеры шрифтов на странице. Давайте будем бороться за то, чтобы эта хорошая дизайнерская находка вернулась к пользователям в следующем поколении броузеров.

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

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

### Управление шрифтами

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

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

Разумеется у некоторых веб-броузеров есть функция, позволяющая пользователям создавать свой собственный список стилей. Это конечно хорошо. Для опытных пользователей. Но 99% пользователей просто хотят увеличить размер текста на странице, если его трудно читать. Броузер iCab, выпускаемый только для Macintosh, дает пользователям эту возможность. Так давайте же сделаем Internet Explorer таким же дружественным по отношению к пользователям.

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

- Большинство дизайнеров - молодые люди. У них прекрасное зрение. Мелкий текст им не в тягость, в отличие от тех, кто перешагнул порог 40 лет. Дизайнеры также как правило работают на дорогих высококачественных мониторах, которые не утомляют глаз.
- При создании веб-сайтов дизайнеры не читают информацию на странице. Они просто бросают на нее взгляд мельком, чтобы убедиться, что текст лег в страницу правильно. Иногда большая часть дизайнов сдается с текстом "lorem ipsum" вместо реального текста, который на странице будет.

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

Господин Гейтс, пожалуйста, верните нам эту хорошую дизайнерскую находку, которая была в IE4 для Macintosh-а.

### Как упростить управление шрифтом

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

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

Для тех же опытных пользователей, которые все-таки разобрались с настройками и вернули отсутствующую кнопку на панель инструментов, сама процедура изменения текста в IE6 будет занимать несколько этапов:

1. Переместить курсор к кнопке. Так как кнопки на панели IE достаточно велики, этот этап выполняется весьма быстро (согласно закону Фиттса - Fitts's Law)
2. Нажать кнопку.
3. На экране появится выпадающее меню, в котором перечислены пять вариантов размеров текста. Надо просмотреть этот список и отметить про себя, какой размер сейчас активен.
4. Определить, какой новый размер необходим. Как правило, это следующий размер (меньше или больше) рядом с текущим размером.
5. Все ещё удерживая кнопку мышки, необходимо переместить курсор к тому пункту меню, который соответствует выбранному размеру.
6. Отпустить кнопку мышки.

Сравните этот неуклюжий шестиэтапный процесс с тем, как меняется размер текста с помощью тех двух кнопок "крупнее" и "мельче":

1. Нажать нужную кнопку.

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

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

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

### Как улучшить броузеры будущего

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

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

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

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

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

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

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

### Советы по улучшению читаемости веб-сайта

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

- Не используйте абсолютные размеры шрифтов в своих списках стилей. Задавайте размеры шрифта в относительных величинах. Как правило это делается с помощью процентов: например, 120% для большого текста и 90% для мелкого.
- Размер шрифта по умолчанию должен быть разумно большим (как минимум 10 точек), чтобы лишь немногим пользователям приходилось менять его размер.
- Если целевая аудитория вашего сайта - пожилые люди, делайте размер шрифта еще большим (как минимум12 точек).
- Если возможно, не используйте графический текст. Это связано с тем, что с помощью стилей можно поменять размер простого текста, а на размер графических изображений они не влияют. Если вам все-таки приходится использовать текст "отлитый" в графике, постарайтесь использовать достаточно большой размер шрифта (как минимум 12 точек), а также выбирайте высококонтрастные цвета.
- Подумайте над тем, чтобы добавить к интерфейсу кнопку, загружающую альтернативный список стилей, в котором заданы очень большие размеры шрифта. Это особенно касается сайтов, чьи посетители - пожилые люди, или люди со слабым зрением. Лишь немногие пользователи знают о скрытой функции изменения размера шрифта в броузере, потому добавление такой кнопки облегчит им эту задачу. Однако, добавление каждой новой функции все равно что-то отнимает от каждой страницы, я не рекомендую применять данный совет на сайтах с широкой аудиторией.
- Увеличьте по максимуму контраст между текстом и фоном (и не пользуйтесь, пожалуйста, фоновыми изображениями, рябящими в глазах). Несмотря на то, что уже давно известно, насколько низкоконтрастный текст затрудняет читаемость сайта, Web кишит результатами таких изысков.

Якоб Нильсен

Ссылки по теме
Эта статья на английском языке Другие статьи Нильсена на его сайте |англ.. Переводы статей Нильсена на этом сайте назад к списку статей

Самые популярные статьи Нильсена
- 10 главных ошибок веб-дизайна 2002 года
- Flash на 99% неприемлем
- Размер шрифта пусть выбирают сами пользователи
- Чем ссылка глубже - тем она лучше
- Берегите почтовый ящик вашего пользователя
- Как читают web-пользователи?

  все статьи Нильсена »

Рекомендую
Якоб Нильсен Веб-дизайн. Книга Якоба Нильсена на http://www.ozon.ru/?context=detail&id=126954&partner=webmascon на http://www.books.ru/shop/books/7107?partner=webmascon

Рекомендую

Якоб Нильсен
Дизайн Web-страниц.
Анализ удобства
и простоты использования
50 узлов
на http://www.ozon.ru/?context=detail&id=1150834&partner=webmascon
на http://www.books.ru/shop/books/29243?partner=webmascon

Начало | Темы | Архив | Daily | Персоналии | Форумы | Отзывы | О сайте

|  | Автор и администратор ресурса - Александр Качанов Webmascon Project открыт в 1999 году
© 1999-2002, переводы, Александр Качанов © 1999-2002, Webmascon © дизайн | matepuana.com |  |