сервис аналитики звонков и оптимизации
бизнес-процессов
Войти как пользователь
Вы можете войти на сайт, если вы зарегистрированы на одном из этих сервисов:

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

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

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

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

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

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

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

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

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


Есть о чем рассказать? Тогда присылайте свои материалы в редакцию.


Новые 
Новые
Лучшие
Старые
Сообщество
Подписаться 
Подписаться на дискуссию:
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
Как построить качественную ссылочную массу сайта
Айрат Рахимзянов
38
комментариев
0
читателей
Полный профиль
Айрат Рахимзянов - Спасибо Кирилл. Сейчас восстановилась работа сервиса: take.ms/ttXrw
Анализ ссылок: сравнение многофункциональных платформ по размеру их баз
Андрей Ольшевский - Очень неточная статистика, объясню почему. Довольно часто делаю анализ сайтов на качество и объём ссылочной массы. Всегда делаю выгрузку из трех источников – Вебмастера Яндекса, сервиса Мегаиндекс, сервиса Линкпад. Потом с помощи алгоритмов и функции Excel отсеиваются много дублей, битых ссылок, несуществующих урл и тп. Как показала практика, вебмастера Яндекса вполне достаточно, там вся информация и она самая актуальная, в других сервисах куча мусора, а нового, чтоб было найдено и проиндексировано ПС - очень мало. Поэтому мирятся количеством в данном анализе не профессионально.
Как создать интернет-магазин: сколько стоит открытие?
Пришел посмеяться
1
комментарий
0
читателей
Полный профиль
Пришел посмеяться - Я просто посмеюсь :D Даже не хочу ничего особо говорить :D Смех, а не статья.
ТОП-10 автоматизированных сервисов контекстной рекламы
Гость - Действительно, очень плохая статья. А у редактора Блондинки видимо слишком много свободного времени.
Кому и зачем нужен маркетплейс от Яндекса
Дарья Калинская
212
комментария
0
читателей
Полный профиль
Дарья Калинская - Максим, спасибо, рада, что статья оказалась полезной )
Конкурс: угадай победителя рейтинга «Известность бренда SEO-компаний»
Андрей
1
комментарий
0
читателей
Полный профиль
Андрей - Оптимизм Дэмис Кокос Ашманов и Партнеры Раш эдженси
Инструкция по применению: обзор сервиса обратного звонка Callbackhunter
Полина Ковальчук
1
комментарий
0
читателей
Полный профиль
Полина Ковальчук - Возможно, но не советую экономить на этом сервисе, функционал то тоже круче, чем у аналогов. Вы создаете сайт для получения денег и чем качественнее Вы выстроите продвижение, тем больше лидов Вы получите!
Тест: Какой ты интернет-маркетолог?
Петр - Мда уж, есть ряд очень и очень субъективных вопросов, например с картинками и ctr или с несколькими вариантами ответа, когда из 5 пунктов надо выбрать 4, что несерьезно. Поэтому, как минимум, к этому тесту нельзя относиться серьезно. Его надо очень серьезно дотягивать, а не вываливать отсебятину.
SEO-тренды на 2017 год: мнение специалистов
Olga Inventor
1
комментарий
0
читателей
Полный профиль
Olga Inventor - Хорошая статья. То, что SEO - антитренд, уже давно говорят. Нужен комплексный подход.
Чек-лист: SEO для B2B-бизнеса
Антон Зозуля
8
комментариев
0
читателей
Полный профиль
Антон Зозуля - Ваша цель вывести страницу, на которой будет только ваш товар (обычно это фильтр бренд/производитель в нужном каталоге) по СЧ запросам в ТОП. Например, вы продаете "велосипеды Елочка". В каталоге дилера велосипеды, вы выбираете Бренд - "Елочка" и должны получить страницу "велосипеды Елочка". Она должна быть на уникальном урл, иметь уникальные метатеги, лучше, чтобы был SEO-текст. После этого ваша задача получить на нее трафик по запросам: идеально: купить велосипед, цена велосипед хуже: велосипед дешево, китайский велосипед еще хуже (меньше трафика и ниже конверсия, но они есть): велосипед + [регион], велосипед + [фильтр другой]. Тут трудно без прямого влияния на содержимое страницы (метатеги и текст). ПС бренд елочка выдуман. :)
ТОП КОММЕНТАТОРОВ
Комментариев
910
Комментариев
834
Комментариев
554
Комментариев
540
Комментариев
483
Комментариев
373
Комментариев
285
Комментариев
262
Комментариев
212
Комментариев
171
Комментариев
156
Комментариев
137
Комментариев
123
Комментариев
97
Комментариев
97
Комментариев
95
Комментариев
80
Комментариев
71
Комментариев
67
Комментариев
60
Комментариев
55
Комментариев
52
Комментариев
50
Комментариев
45
Комментариев
44

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