Дизайн Ян Австрейх
7 503

Меньше текста, больше интерактива: сделать дизайн сайта интересным для подростков

Конспект исследования Алиты Джойс и Якоба Нильсена.

В закладки
Аудио

Авторы провели юзабилити-тестирование сайтов среди аудитории возрастом от 13 до 17 лет и опровергли несколько популярных стереотипов:

  • для подростков главное — получить визуальное удовлетворение от графики и контента;
  • подростки технически подкованы;
  • подростки готовы делиться информацией о себе на любых платформах.

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

Всего опросили 100 пользователей, количество мальчиков и девочек было равным.

Исследование проходило в три этапа: в первом участвовало 38 подростков (2004 год), во втором 46 (2013 год), в последнем 16 (2019 год). В сумме эти этапы охватили 15 лет жизни.

В работе авторы использовали три метода.

  • Юзабилити-тестирование. Встречались с каждым участником теста отдельно и просили выполнить задания на устройстве. Участник должен был озвучивать свои мысли по поводу интерфейса. Джойс и Нильсен знали интересы каждого подростка и моделировали ситуации использования, которые могли случиться в обычной жизни.
  • Полевое исследование. Наблюдали за подростками, когда те пользовались интернетом дома и в школе.
    Перед участниками не стояло определённой задачи, они пользовались сайтом как обычно.
  • Интервью и фокус-группы. Участников попросили привести в пример истории с подробным описанием того, как и когда они пользовались интернетом, какие сайты нашли интересными и полезными для себя. Также подростков спрашивали, как сделать сайты более привлекательными. Интервью проводились до и после юзабилити-тестирования, а также во время собраний фокус-групп.

Исследование проводилось в США, Великобритании и Австралии, в больших и маленьких городах, в богатых пригородах и неблагополучных городских районах. Юношей и девушек тестировали на 210 сайтах и 30 приложениях разной направленности:

  • образовательные сайты (Ноттингемский университет, Central Bucks High School West, BBC Bitesize, Quizlet);
  • туризм, искусство и развлечения (Visit London, TripAdvisor, ExploreChicago.com);
  • здравоохранение (Австралийский фонд по борьбе с алкогольной и наркозависимостью, TeensHealth, Национальный институт по вопросам злоупотребления наркотиками);
  • информационная справочная система (Nature, Food Network, Scientific American);
  • новости (Buzzfeed, CNN, Weather.com, Daily Mail, The New York Times);
  • развлечение и игры (Stack AR, YouTube, Playlist.com, Geometry Wars);
  • электронная коммерция (Adidas, H&M, ASOS, Jabra);
  • корпоративные сайты (McCormick, Unilever, Pepsi-Cola, Procter & Gamble, Samsung, Morton Salt);
  • государственное управление (Gov.UK, Правительство Австралии, автомобильный департамент Пенсильвании, Белый дом, NASA);
  • некоммерческие организации (Rotary International, Charity: Water, Всемирная продовольственная программа, Национальная федерация дикой природы).

В материале акцент сделан на том, что авторы протестировали не только сайты, ориентированные на подростков, но и другие наиболее распространённые платформы.

Опрошенные выделили несколько причин пользования интернетом:

  • домашнее задание для школы;

  • хобби или другие особые интересы (включая обучение новым навыкам или поиск развлечений);

  • развлечения (музыка, видео и игры);

  • новости (спорт, текущие события и развлечения);

  • изучение новых тем;
  • общение с друзьями;

  • покупки.

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

За 15 лет подростки стали лучше ориентироваться в навигации и быстрее искать информацию

Самый старший участник третьего исследования родился в 2001 году, а самый младший — в 2005-м. У всех участников этого исследования с детства был доступ к компьютерам.

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

Джойс и Нильсен заметили, что многие вредные пользовательские привычки подростков из последнего исследования совпадают с привычками участников исследования 2004 года. Из этого они сделали вывод: повышение производительности частично связано с улучшением дизайна сайтов.

Но им всё ещё трудно потреблять сложный контент

Подростки не так хороши в использовании интернета, как некоторые думают. Хотя они чувствуют себя более уверенно, чем взрослые, подростки часто бывают слишком нетерпеливы. Они также менее осторожны, чем взрослые, и делают поспешные выводы. Это приводит к меньшему числу успешно выполненных задач.

Где подростки уступают взрослым:

  • медленная техника чтения;
  • простые стратегии исследований;
  • уровень терпения ниже, чем у взрослых.

Чтобы сделать сайт удобным для подростков, нужно учитывать все три фактора.

Авторы встречали эти качества во всех исследованиях с подростками на протяжении 15 лет. Это значит, что они, вероятно, будут встречаться и в будущем, хотя привычки и предпочтения могут измениться.

Из всех типов подростки успешнее всего пользовались сайтами электронной коммерции со стандартным дизайном и небольшим количеством текста. Труднее всего оказалось использовать сайты с большим объёмом контента и плохой навигацией: государственные, некоммерческие, образовательные.

Адаптируйте текст для подростков

Ничто не отпугивает молодую аудиторию так, как загромождённый текстом экран. Подростки могут быстро заскучать, читая его, или отвлечься на что-то другое. Лёгкие сайты всегда предпочтительнее страниц с большим количеством текста.

Правильно писать текст и располагать его на странице критически важно, если вы имеете дело с подростками.

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

Подростков в исследовании часто напрягал объём контента. Несколько участников выделяли текст, когда читали страницу, чтобы сосредоточить внимание на одной области.

Иногда мне трудно читать чёрный текст на белом фоне. Выделение текста помогает мне лучше видеть его.

16-летний участник

Я потеряла ход мысли, поэтому я выделила текст, чтобы лучше сосредоточиться на нём.

15-летняя участница
Несколько участников выделяли текст на странице, чтобы лучше сосредоточиться. На скриншоте видно, как участница выделила термин «bluegrass», потому что задумалась, какой же это стиль музыки

Чтобы помочь подросткам сосредоточиться, нужно использовать понятные им слова. Пишите короткими предложениями и абзацами. Выделяйте ключевые моменты.

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

В статье приводится наблюдение: подростки не любят маленький шрифт, как и взрослые.

Джойс и Нильсен пишут: они часто предупреждали UX-дизайнеров, что использование маленького текста неудобно для пожилых людей (и даже для людей в возрасте около 40 лет, чьё зрение только начинает ухудшаться). Они всегда считали, что на сайтах много мелкого шрифта, потому что большинство веб-дизайнеров молоды, у них всё ещё идеальное зрение.

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

На сайте Music вся информация написана совсем крошечным шрифтом. Приходится прищуриваться, чтобы что-то прочесть. Текст должен быть немного больше.

16-летняя участница

Подавайте интересный контент профессионально и просто

Многие участники жаловались на скучный контент. Такой отзыв — смертный приговор, если нужно поддерживать интерес молодой аудитории.

Также сайт не должен быть чересчур интерактивным. Хотя подростки высоко ценят визуальный аспект, они ненавидят загромождённые бесполезными вставками сайты.

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

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

  • онлайн-тесты;
  • формы для предоставления обратной связи или вопросов;
  • онлайн-голосование;
  • игры;
  • возможность обмена фотографиями или «историями»;
  • возможность создания и редактирования контента.

Эти интерактивные функции позволяют подросткам оставить след в интернете и выразить своё мнение, свою личность разными способами.

Тип сайта влияет на ожидания пользователей

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

Скорость — ключевой момент

Пользователи точно не обрадуются медленной загрузке. Убедитесь, что ваш сайт загружается быстро. Медленные, «вялые» сайты расстраивают всех, но больше всего их не любит молодая аудитория, которая ждёт мгновенного удовлетворения своих запросов.

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

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

Ненавижу ждать. Это очень раздражает. В обычной ситуации я бы не стал так долго ждать загрузки страницы. Я бы открыл другой сайт.

17-летний участник

Не говорите с ними свысока

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

Некоторые сайты в исследовании пытались совмещать контент для детей и для подростков, используя формулировку «дети». Это серьёзная ошибка: слово «ребёнок» — ключевая вещь, которая отталкивает подростков.

Подростки отчаянно гордятся своим недавно приобретённым статусом и не хотят видеть детского контента перед глазами — ещё одна причина уменьшить количество мультимедиа и кричащих цветовых схем, которые работают на аудиторию младшего возраста. Авторы статьи рекомендуют создать отдельные разделы для маленьких детей и подростков и назвать их соответственно: «Дети» и «Подростки».

Дайте возможность делиться контентом

Чтобы подростки могли отправить знакомым ссылку на свою публикацию. Как они привыкли делать это в соцсетях. Иначе пользователи будут делать скриншоты — а это не очень удобно.

Сделайте мобильную версию сайта

В последнем исследовании у всех участников были мобильные устройства, а ноутбуки или компьютеры — нет. Поэтому подростки часто просматривают контент, держа телефон в руке.

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

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

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

Они не винят себя в том, что чего-то не поняли или не дождались, они винят UX-дизайнеров в создании сайта с низким уровнем юзабилити.

Различия возрастных групп

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

{ "author_name": "Ян Австрейх", "author_type": "self", "tags": [], "comments": 21, "likes": 36, "favorites": 122, "is_advertisement": false, "subsite_label": "design", "id": 64611, "is_wide": false, "is_ugc": true, "date": "Fri, 19 Apr 2019 10:08:44 +0300" }
SMS-чат для клиентов
{ "id": 64611, "author_id": 192524, "diff_limit": 1000, "urls": {"diff":"\/comments\/64611\/get","add":"\/comments\/64611\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/64611"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114, "last_count_and_date": null }

21 комментарий 21 комм.

Популярные

По порядку

Написать комментарий...
5

Мне кажется, что выборка подростков достаточно странная. И маленькая. В выводах озвучены общие психологические особенности подростков, приложенные к поведению на сайте/ в приложении. Было бы, наверное, лучше отталкиваться от особенностей психологии и восприятия подростков.

Ответить
5

Очень странное исследование. Между первым и вторым этапом разница в 9 лет, потом перерыв 6 лет и новое исследование. Сейчас за пару лет много что меняется, а уж между сайтами в 2004 и 2013 году целая эпоха.
И количество участников странно маленькое. Хз, короче, не исследование, а непонятно что.

Ответить
0

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

Ответить
5

вы слегка упрощаете, как мне кажется, ЖЖ умер из за целого набора факторов - стремительную моду на сенсорные устройства (планшеты, смартфоны) более заточенные на потребление визуального контента (лайк, репост, шер - максимум что там удобно, печатать с планшетов тексты так себе удовольствие) + сайт крайне долго не имел моб версию и аппсы под моб ось; сама аудитория сети стремительно молодела - средний возраст юзера ЖЖ это все таки что то к 20 и далее, ну не с 9 лет как щас; сама система не была адаптирована для возрастающих нагрузок и в расцвете своей популярности постоянно ложилась, иногда на пол дня; не было понимания как ее правильно монетизировать - в общем, много из за чего. но в целом да, это была самая полезная соцсеть, в том смысле что она развивала навыки осмысленного изложения собственных мыслей в письменном виде. вот кстати еще одна причина - юзером ЖЖ не могли быть люди, не умеющие читать и писать (в отличии от ютуба) =)

Ответить
5

Сайты с лонгридами живут (они и на vc есть), а жж сдох. Дело не в подростках, а в том что жж не успевал за остальным вебом и даже сейчас нихера нормально не работает

Ответить
1

Скажите это сайтам, типа беон, дайри, тэйсти. Беон до сих пор существует.

Ответить
3

Не осилил, много текста. Из всей статьи запомнил только баннер Playgendary.

Ответить
3

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

Скорость сайт влияет не только на подростков.

Чтобы помочь подросткам сосредоточиться, нужно использовать понятные им слова. Пишите короткими предложениями и абзацами. Выделяйте ключевые моменты.

Применимо к абсолютно любым слоям населения. Достаточно посмотреть на популярность леддинтов.
Ну и далее по тексту, если разбирать, можно провести параллели.

Ответить
–1

Это конечно все хорошо, если мне кто-то объяснит какой смысл подстраиваться под неплатежеспособную аудиторию.

Ответить
4

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

Ребенку и подростку гораздо проще что-то продать, а как он потом выпросит продукт у родителя — дело техники.

Ответить
0

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

Ответить
2

Не вижу принципиальной разницы — лет до 14-17 ребенка полностью обеспечивает родитель, тратит деньги на то что он ест, надевает, на его развлечения. В контексте исследования подростки наверное даже более важны, потому что они сами уже могут выбирать в интернете то, что им купят, или на что он потратит карманные деньги.

Ответить
1

Потреблять тонны контента может тот, у кого много свободного времени. Это обычно 4 группы людей: дети, подростки, старики, безработные/иждивенцы. Сегодня не работать с детьми/тинейджерами - это потенциально терять прибыль. Marvel/Disney сейчас делают просто огромные бабки на супергероях для 7-лених детей.

Ответить
1

Начал писать было ответ, но увидел фразу "Marvel/Disney сейчас делают просто огромные бабки на супергероях для 7-лених детей." и понял, что разговаривать бессмысленно. Желаю счастья в ваших заблуждениях

Ответить
0

Какая драма, надеюсь не обиделся хоть.

Ответить
0

дядя, ты дурак, скажи честно?

Ответить
1

Они часто покупают, например игры или спайсы;)

Ответить
2

Где подростки уступают взрослым:

медленная техника чтения;

простые стратегии исследований;

уровень терпения ниже, чем у взрослых.

Так может стоить привить эти навыки подросткам, а не опускаться до их уровня.

Ответить
0

Кажется, что это будет выглядеть так: вот заметка про что-то, кто сможет осилить много букв и понять смысл - читайте, остальные проходим мимо, мимо, я сказал!

Ответить
0

Образование это право, а не обязанность.

Ответить

Комментарий удален

1

Ты его с утюга что ли просматриваешь? 🤔

Ответить
0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Компания отказалась от email
в пользу общения при помощи мемов
Подписаться на push-уведомления
{ "page_type": "default" }