16 px – это оптимальный размер шрифта для веб-страниц.
На первый взгляд это утверждение может показаться странным и даже провокационным. Основной шрифт у большинства веб-страниц не превышает 12 пикселей и многие веб-дизайнеры убеждены в том, что это – оптимальный размер для шрифта. Эта статья призвана убедить вас в обратном.
Специалист в области юзабилити сайтов Оливер Рейхенштейн утверждает, что 16 пикселей – это стандарт для нормального отображения шрифта в браузере. При этом шрифт не будет выглядеть гигантским (чего опасаются многие дизайнеры), потому что 16 пикселей – это много только на первый взгляд, а на практике это самый удобный размер шрифта для сайта, в чем уже убедились многие разработчики.
Более того, 16 px – это минимальный размер шрифта для современного сайта, и если вы не поддерживаете этот формат, то лишь напрасно тратите деньги ваших клиентов. Ниже приведены аргументы в пользу актуальности именно такого размера для шрифта.
Доход сайта и привлечение читателей
В большинстве случаев сайт создается с целью заработка, и чем больше у вас будет посетителей, тем большим будет вероятный доход. Если ваш сайт – продающий, то тем важнее для вас привлечь потенциального клиента среди аудитории сети Интернет. Каждый из читателей вашего сайта – это ценный бизнес-актив, который в конце-концов окупит ваши затраты на создание сайта.
Именно поэтому каждый элемент вашего сайта должен быть направлен на достижение конечной цели. Текстового контента это правило касается в первую очередь. Ведь текст на сайте – это основное средство влияние на читателя.
Если в текстах вашего сайта не будет четко указано, каких действий вы ожидаете от пользователя, то он не станет вашим клиентом. А для того чтобы текст эффективно воздействовал на пользователя он должен быть, как минимум, прочитан.
Итак, все ваши действия должны быть направлены на то, чтобы повысить легкость чтения контента для ваших читателей.
4 факта о чтении, которые должен знать веб-дизайнер
1) После двадцати лет качество зрения у людей снижается, в сорок лет к сетчатке глаза проходит только 50% света, а к шестидесяти годам – всего 20%.
2) У 9% американцев есть проблемы со зрением, а в России эти показатели еще ниже. Многим россиянам зрение не могут полностью исправить даже контактные линзы.
3) Скорость чтения зависит от расстояния до источника: чем выше расстояние, тем разборчивее воспринимаются символы и выше понимание прочитанного. Главный фактор, определяющий оптимальное расстояние, – это именно размер шрифта. Крупные шрифты на билбордах различают практически все люди, чего не скажешь о 12-пиксельном шрифте большинства веб-сайтов.
4) Учитывайте, что большинство пользователей компьютера находятся на расстоянии 50-60 сантиметров от устройства, это позволяет не напрягать глаза слишком сильно. Но печатные источники мы воспринимаем на более близком расстоянии, ведь журнал, который мы читаем, находится на расстоянии меньшем, чем расстояние вытянутой руки, всего несколько десятков сантиметров. Основываясь на этих расчетах, видно, что шрифт в 16 пикселей на экране воспринимается как 10-пиксельный шрифт в книге.
16px текст на 24' мониторе и 12pt текст в книге
16px текст на 15,4' мониторе и 12pt текст в книге
Плохие шрифты снижают посещаемость сайта
Плохой шрифт на веб-сайте является самой распространенной проблемой пользователей (по результатам опроса за 2005 год этот пункт набрал большинство голосов). На данный момент ситуация не улучшилась – показывает выборка дизайнов SiteInspire. Средний размер шрифта для основного текста у них составляет те самые 12 пикселей, которые стали стандартом среди веб-дизайнеров, вопреки требованиям пользователей, большинство из которых жалуется на маленький размер шрифта. Из всех этих дизайнов нет ни одного (!) со шрифтом больше 14 пикселей, а у некоторых размер шрифта еще меньше – 10 px.
Популярные источники готовых дизайнов для сайта ElegantThemes и ThemeForest предлагают веб-разработчикам шаблоны, с размером шрифта не превышающим 12-13 пикселей.
Какое количество ваших читателей имеют 100% качество зрения и не страдают от чрезмерного напряжения глаз во время работы с компьютером? Неужели все ваши читатели моложе 20 и не испытывают проблем с различением миниатюрных шрифтов?
Скорее всего, это не так: каждый из десяти ваших читателей будет просто не в состоянии различить 10-пиксельный шрифт, но размер в 16 пикселей будет для них оптимальным. В противном случае даже людям с отличным зрением придется ближе придвинуться к монитору, чтобы разобрать мелкий шрифт, а это сильно понижает удобство пользования сайтом. Поза сидящего перед компьютером должна быть максимально естественна и удобна, вы же не хотите, чтобы ваш читатель чувствовал себя неуютно и неловко?
Не напрягайте читателя лишний раз, иначе до него не дойдет смысл прочитанного (если он даже прочитает ваш текст, а не покинет сайт сразу).
Не отпугивайте посетителей неудобными шрифтами, ведь чем больше у вас посетителей – тем выше доход принесет сайт в конечном итоге.
Не заставляйте пользователя думать!
Многие дизайнеры считают, что «проблемы утопающих – дело рук самих утопающих», и если у пользователя возникают проблемы с чтением шрифта на сайте, то он должен обратиться к функции приближения, которая позволяет увеличить текст. Но с точки зрения пользователя, легче поискать необходимую информацию на другом сайте, чем настраивать под себя неудобный интерфейс веб-ресурса. А многие пользователи даже не знают о существовании такой функцией, и, сталкиваясь с текстом, который невозможно прочитать, не долго думая нажимают кнопку «Назад».
Не тратьте деньги ваших клиентов понапрасну, создавая заведомо нерентабельный сайт. То, что кажется красивым вам, не всегда удобно для пользователя. Думайте о том, что интересует пользователя, и вы достигнете цели, какой бы она ни была.
Дизайн печатных изданий отличается от дизайна веб-ресурсов – это очевидно. И если крупные шрифты в полиграфии выльются в дополнительные затраты на каждый миллиметр использованной бумаги, то стоимость создания интернет-издания не зависит от размера шрифта, который вы используете, так что нет смысла ограничиваться компромиссными решениями.
16 px – это удобно
Если вы все-таки не воспринимаете крупный шрифт как приемлемый для сайта с эстетической точки зрения, то подумайте о том, что нет ничего более гибкого, чем вкус дизайнера. В основном, наши предпочтения основаны на том, что мы уже видели раньше. И если вы впечатлились веб-дизайном, выполненным с использованием 10-пиксельного шрифта, это ни в коей степени не отрицает того, что дизайн с 16-пиксельным шрифтом будет привлекательным.
Подумайте, а вдруг именно ваш дизайн станет новым стандартом? Сделать свой сайт более удобным для восприятия – это отличный способ преодолеть конкуренцию и сформировать обширную аудиторию пользователей.
Да, надо будет подумать об этом. Дело в том, что я никогда не задумывалась о размере шрифта на своих сайтах. Всегда считала, что этот фактор не имеет особого значения, главное, чтобы контент был хорошим. А ведь и вправду сейчас у многих людей есть проблемы со зрением, однако одни близоруки, а другие дальнозорки и поди знай как лучше сделать ; )
У самой несколько сайтов, делаю даже на заказ. До прочтения действительно не задумывалась о размере шрифта — брала примерно 14-18, а оказалось что существует даже «идеальный» шрифт для глаз. Действительно мелкий шрифт раздражает и приходится приближать, а крупный нарушает гармоничность всего сайта, а как раз 16 это и есть золотая середина.
«11px должно быть достаточно для каждого»
— Павел Дуров
В итоге, неудобно читать Вконтакте.
Вконтакте в версии для чтения, между прочим, именно в 16px
скриншот — https://yadi.sk/d/iLENro95UYMRr