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

Когда дело доходит до выбора интерфейсной стратегии, в спор вступают две противоположные школы:

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

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

Респонсив-дизайн: позволяет ли он достичь удобства использования на мобильных устройствах

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

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

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

Более того, некоторые из комментаторов моей колонки «Мобильный сайт против полного» уверены: даже если размеры организации позволяют окупить разные дизайны для настольных и мобильных компьютеров, наиболее эффективным решением всё равно является респонсив-дизайн (responsive web-design) – в ином случае расходы будут слишком велики.

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

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

Большинство виденных мною примеров респонсив-дизайна очень примитивны и не обеспечивают достаточной адаптации к интерфейсу настольного или мобильного устройства. Недостаточно просто модифицировать макет, перемещая элементы по экрану, увеличивая их или уменьшая. Это работает только в случае адаптации десктоп-дизайна для мониторов 19 или 24 дюйма или мобильного дизайна — для iPhone или Kindle Fire.

Различия между мобильным и десктоп-дизайном выходят за пределы элементов макета.

• Самое важное то, что различным должен быть контент: для малых экранов необходимы более короткие и простые тексты, поскольку ограничения контекста снижают возможности восприятия информации.
  • Да, можно читать романы на Kindle или иных планшетах, но это применимо, главным образом, к простым произведениям с линейным повествованием, за которым легко следить. Чтение бизнес-ориентированного контента или научной литературы требует более высоких уровней когнитивного процесса, которых трудно достичь на малых экранах.
  • Помимо текста, другие виды контента также должны проектироваться для конкретной платформы. Например, малые изображения должны обрезаться и форматироваться иначе, чем большие, для подчеркивания важных деталей. Недостаточно просто масштабировать изображение, чтобы заполнить доступное пространство экрана.
  • Информационная архитектура меняется, чтобы на мобильных устройствах вторичный контент мигрировал на внутренние страницы.
  • Методики взаимодействия меняются в силу различий между вводом с помощью мыши и тач-интерфейсом.
  • Набор функций на мобильных устройствах сокращается, упрощая навигацию и интерфейс на малых экранах.

При достаточном объеме программирования все эти различия могут быть реализованы в рамках респонсив-дизайна. Можно даже сказать, что если дизайн не охватывает все различия между платформами, он недостаточно «отзывчивый». Однако, как только все эти различия будут учтены, мы вернемся к п.1: два разных дизайна.

Когда следует оптимизировать дизайн для платформы

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

Видоизменение единственного дизайна для нескольких платформ оправдано в двух случаях:

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

И напротив, следует создавать несколько дизайнов, оптимизированных под каждую платформу, в следующих двух случаях:

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

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

Автор статьи — Якоб Нильсен, президент  Nielsen Norman Group, «король юзабилити» (Internet Magazine), один из ведущих специалистов по пользовательским интерфейсам. Оригинал статьи. Перевод с сокращениями.