Юзабилити в текстах

Россия+7 (495) 960-65-87
Шрифт:
4 4221

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

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

  1. Шрифт. Существует два типа шрифтов: с засечками (serif) и без засечек (sans serif). Всем, кто хоть немного имел дело с созданием сайтов, известно, что в интернете используется шрифт без засечек, шрифты класса serif подходят только для печатной продукции. Это объясняется тем, что с экрана читать сложнее и характер восприятия не позволяет применять «цепляющие глаз» засечки. Еще незабвенный Якоб Нильсен писал: «Если сомневаетесь, используйте Verdana». На данный момент шрифты Verdana, Arial и Tahoma применяются чаще всего, в западном сегменте можно встретить шрифт Georgia с засечками.

На сайте лучше использовать один-два шрифта в разных начертаниях (полужирный, курсив). Большее их количество выглядит неприятно, заставляя пользователя постоянно перестраиваться на новое начертание. Размещение на сайте текста в стандартном «вордовском» шрифте Times New Roman выглядит убого и напоминает самодельные бесплатные сайты на «народе». Говоря о нашем примере, посмотрите на страницу:

Неудачный шрифт

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

Вопрос шрифта решен

  1. Размер и цвет шрифта. Размер шрифта должен быть в пределах от 10 до 14 пикселей, крупный шрифт раздражает, мелкий просто нечитабелен. Для большинства идеально подходит шрифт 10-12, для людей в возрасте нужен 14. С этим все понятно, кто не убежден, попробуйте прочитать текст на Txf.ru или, например, на Velopiter.spb.ru. В том, что касается цвета шрифта, важно учитывать не столько сам цвет, сколько его контраст с фоном.

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

Попробуйте прочесть написанное синим

  1. Интерлиньяж. Это расстояние между строками. В веб-тексте интерлиньяж должен быть в полтора раза больше, чем в печатных изданиях, это облегчает просмотр и чтение текста. Сюда же можно отнести вопрос о разделении абзацев двойным интервалом — это облегчает поиск. Кроме того, не забывайте, что пользователь ленив по своей природе, поэтому, увидев огромный «слепой» текст, он, скорее всего, продолжит поиски на другом сайте. Попробуйте прочитать текст здесь. Такое читать, может, и нетрудно, но как-то тоскливо.
  1. Абзацы. Тут нет каких-то жестких ограничений по размеру и количеству, но всегда хочется сделать текст не просто информативным, но и красивым. Чтобы, например, на скриншоте смотрелся ровными прямоугольниками и не кучей битого кирпича. Поэтому желательно делать абзацы примерно одинакового размера, по 450-600 символов. Слишком большие абзацы плохо воспринимаются из-за той же ленивой природы пользователя, слишком короткие выглядят «грязно».

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

  1. Подзаголовки. Тексты длиннее 1,5-2 тысяч знаков нужно делить на подзаголовки. Дело в том, что пользователь не читает тексты в прямом смысле слова, а просто просматривает в поисках нужной информации. Подзаголовки экономят время и позволяют быстрее найти то, что нужно. Конечно, всегда можно воспользоваться поиском по странице с помощью Ctrl-F, но далеко не все «юзеры» настолько продвинуты, чтобы знать такие тонкости.
  1. Шрифтовые выделения. В арсенале копирайтера есть три вида выделения основных мыслей текста: полужирное написание, курсив и ПРОПИСНЫЕ БУКВЫ. Полужирное выделение используется для обозначения главного слова абзаца, его тематики, курсив традиционно обозначает главную мысль автора, а прописные буквы используются для резюмирования и привлечения внимания. Не рекомендуется использовать прописные буквы слишком часто — это на языке шрифта обозначает крик и наводит на мысли о вменяемости автора. Попробуйте прочесть этот фрагмент:

Попробуйте прочесть этот фрагмент

  1. Выделение ссылок. Основной инструмент, который пользователь применяет в своей повседневной интернет-жизни, — это поисковая система, где ссылки выделены синим цветом с подчеркиванием, а пройденные ссылки — фиолетовым. Следовательно, это закрепленное знание стоит использовать и на своем сайте: синие ссылки, фиолетовые «пройденные». Бывает так, что существующий дизайн сайта не позволяет делать синие ссылки. Если Вы хотите отличаться от общепринятых норм, то помните одно простое правило: ссылки должны быть выделены другим цветом, использованные ссылки должны отличаться по цвету от активных, текст ссылки нужно подчеркивать.

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

Вместо заключения

Уже довольно давно Якоб Нильсен сформулировал одно простое правило, которое работает в отношении всех сайтов: «Пользователь проводит больше времени на других сайтах, чем на Вашем». Это означает, что нужно крайне внимательно подходить к использованию любых нестандартных приемов в оформлении текста, графики и навигации. Пользователь интернета владеет базовыми знаниями и навыками (подчеркнутое есть ссылка, жирным выделено главное слово, крупный текст важнее мелкого), которые нужно не ломать, а использовать в своих интересах.

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


Читайте нас в Telegram - digital_bar

Есть о чем рассказать? Тогда присылайте свои материалы Даше Калинской


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
E-mail:
ОК
Вы подписаны на комментарии
Ошибка. Пожалуйста, попробуйте ещё раз.
Отправить отзыв
  • Journalistka
    14
    комментариев
    0
    читателей
    Journalistka
    больше года назад
    А способов выделения много, для ПС чаще используется полужирное написание. Что мешает написать так:

    Электронный коллайдер: цены ниже!

    По правилам юзабилити в начале заголовка и в начале текста нужно размещать ключевое слово и выделять его жирным. Тут нет противоречия оптимизации.
    -
    0
    +
    Ответить
  • Юлия Вронская
    0
    комментариев
    0
    читателей
    Юлия Вронская
    больше года назад
    Главное, чтобы предпочтение более высокой посещаемости потом не обернулось высоким показателем отказа. Если посетитель пришел на сайт еще не значит, что он быстро не уйдет, "не справившись с управлением")))
    -
    0
    +
    Ответить
  • Journalistka
    14
    комментариев
    0
    читателей
    Journalistka
    больше года назад
    Это да. В идеале - пишется текст в соответствии с юзабилити и оптимизацией. А вот потом в течение месяца производится донастройка статьи под людей.
    Считается, что для обычных пользователей надо писать, как для 12-летних.

    Я против, ибо происки Антанты)))
    -
    0
    +
    Ответить
  • Кирилл Партала
    1
    комментарий
    0
    читателей
    Кирилл Партала
    больше года назад
    Описанные советы по юзабилити расходятся с оптимизацией контента под поисковые системы.
    По правилам юзабилити мы должны выделять и показывать пользователям продающие тексты:
    СКИДКИ до 50%!
    2 товара по цене 1
    Оформить заказ!

    А при оптимизации контента под поисковые системы приходится выделять:
    Электронный колайдер
    ЦЕНЫ на колайдер
    Колайдер купить!
    Заказать Колайдер Москва

    На данный момент большинство компаний отдают ...
    Описанные советы по юзабилити расходятся с оптимизацией контента под поисковые системы.
    По правилам юзабилити мы должны выделять и показывать пользователям продающие тексты:
    СКИДКИ до 50%!
    2 товара по цене 1
    Оформить заказ!

    А при оптимизации контента под поисковые системы приходится выделять:
    Электронный колайдер
    ЦЕНЫ на колайдер
    Колайдер купить!
    Заказать Колайдер Москва

    На данный момент большинство компаний отдают предпочтение оптимизированному под поисковые системы контенту и более высокой посещаемости.
    -
    0
    +
    Ответить
ПОПУЛЯРНЫЕ ОБСУЖДЕНИЯ НА SEONEWS
Кейс: как продвинуть сайт производителя мебели на заказ в Москве
Art Moderator
2
комментария
0
читателей
Полный профиль
Art Moderator -
Рейтинг «Известность бренда SEO-компаний 2017»: народное голосование
Гость
1
комментарий
0
читателей
Полный профиль
Гость - 1) Ingate 2) Ашманов 3) Кокос 4) Russian Promo 5) Netpeak
«Баден-Баден»: как выйти из-под фильтра
Гость
1
комментарий
0
читателей
Полный профиль
Гость - Здравствуйте! У меня совсем новый сайт (около месяца). Как только добавила страницы - были на 64, 45 и т.д. местах в выдаче яндекса по нч и сч запросам, но через несколько дней улетели за пределы 200. Что это баден - баден или песочница? Текст вроде не спамный, но мне трудно судить. Сайт portretnazakaz.ru
Второе дыхание ссылочного продвижения
Rookee.ru
24
комментария
0
читателей
Полный профиль
Rookee.ru - Еще лучше, когда продвижение осуществляется комплексно :)
32 инструмента в помощь SEO-специалисту
Alex Wise
5
комментариев
0
читателей
Полный профиль
Alex Wise - Данис, я тысячу раз извиняюсь насчёт имени! :( Хотя уверен, что лучше всех вас понимаю по этому поводу, ибо меня всегда называют "Алексеем", хотя я Александр: всё из-за сокращения Alex ;) Жду фидбека по новой версии 3.0!
Исследование: влияние smart-ссылок на продвижение по СЧ-запросам
Анатолий Шевчик
1
комментарий
0
читателей
Полный профиль
Анатолий Шевчик - +1097988
Контекст под SEO. Как поисковая реклама помогает позициям в органической выдаче
Сергей Дембицкий «Sima-Land.ru»
22
комментария
0
читателей
Полный профиль
Сергей Дембицкий «Sima-Land.ru» - Боже мой, неужели SEO-маги вернулись??? Открыть в роботс utm-метки для индексации и наплодить дублей...что? А расчеты в конце статьи про бюджет на SEO и контекст...откуда эти пропорции? Как по мне, SEO-магия вне Хогвартс. Спасибо, развеселили!
Западные специалисты выяснили, как повысить позиции ресурса в выдаче Google
Максим Мирошник
2
комментария
0
читателей
Полный профиль
Максим Мирошник -
Все, что нужно SEO-специалисту. Обзор инструментов
Администратор Сайта
1
комментарий
1
читатель
Полный профиль
Администратор Сайта - Шаришь в seo! Сервис реально хороший
«Прямая линия» с Артуром Латыповым: отвечаем на вопросы
God Koss
1
комментарий
0
читателей
Полный профиль
God Koss - Добрый день! Есть сайты одной компании продвигающиеся в разных странах. .ru .com .net. На российском сайте два языка ru и en, на остальных до 10 языков. Недавно сайт ru по основному брендовому запросу выпал из выдачи Яндекс но после апа вернулся на вторую позицию. На вопрос аффилирования в тех поддержку, получит ответ, что всё в порядке и сайт com не учавствует в выдаче. Но он есть и занимает 1 место. Как быть в данной ситуации? Так же, после возврата в топ 10 по этому запросу зашла еще одна внутренняя страница. Могло ли это случиться из-за каннибализации запроса? Немного изменил description на внутренней, исключил вхождения брендового запроса. Жду апа. Хотел бы услышать ваше мнение. Заранее благодарю!
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
373
Комментариев
321
Комментариев
262
Комментариев
234
Комментариев
171
Комментариев
156
Комментариев
137
Комментариев
121
Комментариев
97
Комментариев
97
Комментариев
95
Комментариев
86
Комментариев
80
Комментариев
67
Комментариев
60
Комментариев
59
Комментариев
57
Комментариев
55
Комментариев
54
Комментариев
53

Отправьте отзыв!
Отправьте отзыв!