5 способов улучшить читабельность сайта

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

 

1. Правильно используйте типографику

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

Типографика является очень важным аспектом дизайна веб сайта. Особенно сейчас, когда все больше и больше людей начинают использовать свойство @font-face в CSS и сервисы, подобные Typekit, которые позволяют применять несовместимые с веб шрифты на их сайтах.

Основная тиблица типографики

Даже самый лучший шрифт не поможет, если вы не будете использовать основные рекомендации. Используйте стандартную типографическую шкалу, вместо того, чтобы создавать свою собственную.  Если вы работаете с пикселями, то шкала выглядит как набор размеров шрифта: 12, 14, 16, 18, 21, 24, 36, 48, 60, 72. Она позволит легко задать иерархию типографики. Всегда используйте размеры шрифта из стандартной шкалы.

 

2. Эффективно используйте свободное пространство

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

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

 

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

Сетка для страницы

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

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

 

4. Эффективно используйте контраст цветов

Контраст цветов

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

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

Для определения уровня контраста между элементами дизайна, фоном и текстом можно использовать дополнительные инструменты, например, ‘Colour Contrast Check‘.

 

5. Пишите короче и используйте указатели

Примеры текста

Как уже отмечалось в данной статье, пользователи не читают, а сканируют материалы на странице. Делайте ваши материалы как можно короче и удаляйте все лишнее (если, конечно, вы не пишите онлайн роман). Разбивайте все на параграфы и списки. Используйте указатели для списков (лучше всего в виде стрелочек или точек).

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

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: spyrestudios.com/5-tips-for-improving-readability-on-your-website/
Перевел: Сергей Фастунов
Урок создан: 3 Февраля 2011
Просмотров: 48106
Правила перепечатки


5 последних уроков рубрики "Юзабилити"

  • Мифы о почтовом маркетинге

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

  • Когда пользователи оставляют поле поиска пустым...

    Думаю, вы как и я уделяете кучу времени, пытаясь усовершенствовать каждую деталь вашего сайта: от превосходного отображения на различных устройствах, до создания занимательных страницы 404! В то же время, вы когда-то задумывались, что произойдёт, если пользователь оставит поле поиска пустым, а затем нажмёт Enter?

  • Разумная достаточность: что это означает при заполнении форм?

    Термин “разумная достаточность” относится к склонности человека использовать минимальные ресурсы для успешного завершения работы. Это явление, которое осуществляется на подсознательном уровне: чаще всего мы даже не задумываемся о том, что сейчас нам необходимо использовать самый минимум усилий для выполнения определённой задачи.

  • Семёрка дизайнерских тенденций, формирующих будущее UX

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

  • Три устаревших UX подхода и их альтернативы

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

^ Наверх ^