10 полезных советов по улучшению читаемости сайта

10 полезных советов по улучшению читаемости сайта

02012-09-1632801Денис Абдуллин

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

Правильная высота строк

Одной из наиболее частых ошибок является неправильная высота строк. Она должна соответствовать размеру шрифта.Как правило, нужно прибавить 7px к размеру шрифта при настройке высоты (для размеров от 12 до 15 пикселей).

Code
body {
  font-size:12px;
  line-height:19px; /* 12px + 7px */
}

Правильные промежутки между заголовками

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

Не используйте слишком много разных шрифтов

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

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

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

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

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

Контрастность

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

Черный текст на белом фоне

Подчеркивание для ссылок

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

Создайте библиотеку стилей

Вам следует сделать единый вариант стилей. Используйте классы. Если, например, у вас есть на странице сообщение об ошибке, то с помощью стилей задайте необходимые цвета для нее.

Используйте иерархию в статье

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

Не бойтесь белого пространства

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

Используйте правильные символы

Ярким примером является использование двойной кавычки одного вида. Лучше использовать вариант с разным видом кавычки (отдельный вид для открытия кавычек, и отдельны вид для закрытия).


Создать сайт в uKit Нужен классный сайт для бизнеса?
Воспользуйтесь сервисом uKit. Никакого кода!
Артем Бойко 2013-09-28 в 13:00 / МатериалСпам
По моему тахома более читаемый...
0
Чтобы оставить комментарий или отзыв под этой публикацией, войдите или зарегистрируйтесь.