Адаптация сайта под экраны разных размеров – суровая необходимость, но увлекаясь мобильными разработками, владельцы интернет-магазинов и других ресурсов часто забывают о счастливых обладателях больших мониторов. Как рационально использовать свободное пространство и не оттолкнуть пользователей, расскажем в статье.
Масштабирование контента
Один из самых распространенных способ адаптации показа страниц на больших мониторах – увеличение размера иллюстраций. Однако при таком подходе следует действовать осторожно. Во-первых, фотографии должны быть превосходными: нет смысла увеличивать некачественное изображение. Во-вторых, масштабирование одних картинок может привести к некорректному показу других – например, сопутствующие товары почти пропадут из поля зрения при неаккуратном увеличении размера слайдов.
Целесообразность масштабирования иллюстраций для больших экранов определяется спецификой и количеством товара. Продукцию, которую хочется рассмотреть в подробностях, действительно стоит показать во всей красе. А для магазинов с широким и разнообразным ассортиментом, возможно, полезными будут другие способы адаптации.
Текстовый контент также требует бережного подхода. Простое изменение шрифта и интервалов не всегда дает нужный эффект: плохо масштабированная статья становится нечитабельной или выглядит неумело сверстанной.
Дополнительная информация
Хорошим решением проблемы адаптации текстового контента может стать сохранение удобного для просмотра масштаба и заполнение пустых полей дополнительными материалами – комментариями, фотографиями, справочными материалами и цитатами. Так же можно предложить анонсы и аннотации статей схожей тематики.
Интернет-магазины могут заполнить свободное пространство экрана блоками, обычно располагаемыми на отдельных страницах или в футере («подвале»). Например, пользователям, выбирающим товары, можно показывать список отправленных в «корзину» позиций – это способ упростить навигацию и напомнить о необходимости завершить покупку. Компаниям, предложения которых не относятся к категории «эмоциональных покупок», стоит продублировать контактную информацию и форму «обратной связи», поместив такой блок на карточке товара или в каталоге.
Еще одно решение – «липкий» фильтр для поиска товара по категориям. Постоянно видя указанные позиции, посетитель может корректировать заданные параметры, не прокручивая страницу.
Интересной представляется идея добавления на карточку товара «липкого» блока с основной информацией. Это актуально для магазинов, представляющих длинные описания каждой позиции, с техническими характеристиками и отзывами.
Композиция изображений и блоков
Заполнить свободное пространство можно, скомпоновав контент так, чтобы он заполнил весь экран. Обычно для этого используют колонки или «плитку». Это хороший способ показать на большом экране максимально возможное количество товара или контента, но и здесь нужна умеренность. Перенасыщение страницы яркими изображениями вряд ли придется по вкусу кому бы то ни было и не вызовет желания искать что-то полезное.
Подбирая оптимальное количество и соотношение блоков или иллюстраций, следует руководствоваться не только эстетическими соображениями, но и здравым смыслом. Все-таки тематическое структурирование контента важно для владельцев больших мониторов так же, как и для остальных пользователей. А магазин, предлагающий на одной странице не связанные между собой товары (пусть они и присутствуют на том же сайте), не производит хорошего впечатления.
Один из способов соблюдения баланса информативности и юзабилити – добавление приятного фона, который заполнит свободные поля, «вписав» их в общее дизайнерское решение сайта. При этом блоки могут располагаться в любом удобном порядке, а расстояние между ними можно увеличивать в соответствии с размером экрана.
Что бы вы ни выбрали…
В первую очередь, стоит проверить, нужна ли вашему сайту адаптация под показ на больших мониторах. Причем, отслеживать следует и частоту посещений с десктопных устройств, и показатели конверсии таких пользователей.
Далее нужно выбрать, каким способом будет адаптирован сайт. Важно понимать: суть такой работы в том, чтобы обеспечить владельцам больших мониторов комфортное взаимодействие с сайтом. Контент для десктопных версий должен отличаться только масштабом и расположением на странице, а содержание изменять не следует.
И, наконец, не стоит забывать о тестировании. Однозначно успешного решения, подходящего абсолютно всем, не существует. Изучите опыт конкурентов и сайтов с похожей структурой, поэкспериментируйте и найдите оптимальный вариант адаптации, который порадует ваших посетителей и, конечно же, повысит конверсию.
