Как отказаться от мощных супернаворотов и… выиграть гонку?
Думали ли вы когда-нибудь о том, что, подключая всякие дополнительные функции (для удобства покупателей, конечно!), вы делаете свой сайт менее поворотливым, «задумчивым» и в итоге — вот парадокс — менее удобным? Автоматические слайдеры, раскрывающиеся боковые меню, особые шрифты — вот это всё. А если без них, то, может быть, сайт будет работать быстрее (поисковики это любят), а разные «примочки», пусть и красивые, не так уж и полезны?
Создатель темы дизайна Speed 99 доказал, что его суперскоростная тема позволяет с лёгкостью добиться «зелёных» показателей в Google PageSpeed, не теряя функциональности и стиля.
Главная идея, которая лежит в основе темы Speed 99, — убрать всё лишнее, а то, что осталось, максимально оптимизировать и довести до отточенного минимализма. Так, чтобы посетитель сайта точно понимал, где он находится, где найти нужное и что делать в каждый момент времени. Ничто не отвлекает внимание, всё на своих местах.
Тема построена так, чтобы при загрузке страниц элементы не «дёргались», а сразу были видны со своими окончательными контурами и размерами. Никакой дополнительной подгонки размеров элементов — структура страницы сразу чётко видна, даже если не все фотографии и видеоролики успели загрузиться. У посетителя быстро и естественно возникает ощущение, что сайт — качественный.
Быстрота отображения содержимого проявляется и в использовании SVG-иконок. В отличие от обычных картинок в форматах PNG или GIF, их не нужно загружать в виде отдельных файлов — SVG-иконки жёстко встроены в страницу, и браузер «рисует» их сразу, почти мгновенно.
По этой же причине в стандартных настройках темы Speed 99 нет выбора дополнительных шрифтов — только стандартные, часто используемые Arial, Helvetica, Tahoma, Verdana и т. д., которые почти наверняка установлены на устройстве пользователя, которые не требуют дополнительной загрузки. Если не нужно загружать шрифты, значит, страница загружается быстрее. А тема дизайна Speed 99 — это однозначно про скорость.
Боковое меню навигации, которое часто используется в интернет-магазинах, создатель темы Speed 99 убрал и оставил только верхнее меню. Оно «висит» наверху и видно всегда, куда бы вы ни прокрутили страницу (если не отключить это «прилипание» в настройках). Верхняя часть страницы страницы — гарантированное место, где всегда ищешь взглядом меню для навигации по сайту.
Содержимое главного меню можно регулировать в настройках — выбирать, из каких элементов оно должно состоять и в каком порядке эти элементы должны быть расположены:
- ссылка на главную страницу,
- меню каталога товаров,
- меню информационных страниц,
- меню выбора тегов,
- блок подключения плагинов,
- форма поиска товаров,
- меню выбора категорий «Блога»,
- меню выбора альбомов приложения «Фото»,
- стандартное меню {$wa->apps()}.
В боковой панели используется только форма фильтрации товаров в категории. По умолчанию эта панель видна не сразу, и её нужно раскрывать кнопкой на странице категории.
Но в настройках можно включить, чтобы фильтр был виден всегда сразу — покупателям не придётся искать кнопку и раскрывать боковую панель, а сразу приступать к подбору товаров.
В теме Speed 99 используется современный «воздушный» стиль дизайна страниц: крупные элементы без лишней «декорации» и много пустого пространства, чтобы не отвлекать взгляд посетителя на несущественные детали. Только то, что нужно, и это нужное показано посетителю сайта чётко и понятно. Что ещё на самом деле нужно интернет-магазину, цель которого — продавать?
Несмотря на общую минималистичность, тема Speed 99 не лишена приятных особенностей, которые создадут нужную атмосферу на страницах витрины. Например, для страниц категорий товаров можно настроить красочные обложки в верхней части страницы, которые позволят покупателю быстро окунуться в заданное вами ощущение, связанное с товарами в этой категории. Такую обложку можно настроить и для главной страницы магазина.
Интересно сделаны списки товаров на главной странице. Тут это не привычные уже слайдеры, которые либо крутятся сами, либо позволяют прокручивать себя с помощью разных кнопок или стрелок. В Speed 99 списки оформлены в виде скроллеров — по умолчанию неподвижных блоков, за которые можно в любом месте схватиться курсором и подвинуть как хочешь. Это работает и на компьютере, и на смартфоне.
Такие скроллеры не расходуют ресурсы браузеры, поэтому браузер не тормозит, и у покупателя витрина работает легко и без «задумчивости».
Главная страница витрины интернет-магазина тоже формируется по модульному принципу, как и главное меню. Эту страницу можно составлять из любого набора доступных блоков, расположенных в любом порядке:
- баннеров промоакций,
- списков товаров,
- списков основных категорий товаров,
- текстового приветствия,
- информационных блоков,
- блока «Поделиться»,
- последних фотографий из приложения «Фото».
Страница товара опрятна и функциональна: название товара, «хлебные крошки» для быстрого перехода в вышестоящие категории, видео + фотографии, описание, характеристики, большая кнопка для добавления в корзину. Список характеристик и отзывы о товаре спрятаны на отдельных вкладках.
Когда находишься в каком-то списке товаров, например, на странице категории, можно просматривать фотографии товаров, не открывая страницы товаров и даже не открывая область быстрого просмотра. Достаточно просто поводить курсором по изображению товара, и по мере движения фотографии будут сменяться автоматически.
У кнопки для перехода к корзину необычное, но удобное поведение: когда нажимаешь на неё, то не открывается сразу страница корзины, а выезжает сбоку область предварительного просмотра, где можно увидеть содержимое корзины и при необходимости перейти к оформлению заказа с помощью кнопки.
Можно настроить так, чтобы эта область выезжала автоматически сразу после добавления товара в корзину. Это может быть оправдано, если большинство покупателей в вашем магазине заказывают по 1 товару и желательно сразу же предлагать им перейти к оформлению покупки, чтобы обеспечить как можно более высокую конверсию.
Стандартных настроек дизайна тоже много: можно выбирать цвета для надписей, кнопок, выдвигающихся панелей и главного меню, радиус закругления кнопок, шрифт надписей и тому подобное. Ради точности: всего у темы 775 стандартных настроек + 89 скрытых. Есть где развернуться с экспериментами и тонкой подгонкой!
Тема Speed 99 поддерживает несколько приложений:
- Shop-Script
- Сайт
- Блог
- Фото
- Рассылки
В разных разделах сайта — например, в блоге или фотогалерее — посетители увидят такую же уверенную чёткость линий и ощутят стабильную скорость при навигации по страницам.
Впечатления
Тема дизайна Speed 99 — не для создания эффекта «Ух ты, вот это да!» Она смотрится просто, спокойно и аккуратно. Но, если вы уже посчитали, сколько потенциальных покупок вы потеряли из-за сложного оформления движущихся и всплывающих элементов страниц, то теперь понимаете, что кажущаяся простота темы Speed 99 — это не от недостатка фантазии её автора и не вычурность с целью выделиться среди других. Это то, что быстрее приведёт вас к цели — к быстрым покупкам без лишних сомнений и дополнительных движений.