Реализация корректной верстки сайта по дизайну клиента
Быстродействие, многофункциональность и мультиязычность сегодня являются показателем хорошего и дорогого сайта. Такие продукты лучше воспринимаются поисковыми роботами и посетителями — будь-то сайт-визитка, промо-сайт или интернет-магазин.
В последнее время, занимая львиную долю общего сетевого контента среди миллионов крупнейших сайтов, платформа WordPress уверенно набирает вес в своём сегменте на рынке и становится наиболее предпочитаемой CMS в реализации качественных продуктов.
Именно поэтому, когда к нам обратился новый клиент со своим макетом дизайна и попросил осуществить его корректную верстку, мы и предложили ему реализацию на платформе WordPress.
О клиенте
Swiss Organic Partners стоит у истоков создания торговой марки Alpinols — органических медицинских и косметических продуктов из каннабиноидов. Вся продукция Alpinols на 100% сделана в Швейцарии с использованием экстрактов конопли из сертифицированного органического сырья. В частности, отличительной особенностью КБД является то, что он не бывает психоактивным по своей природе и не имеет побочных эффектов. Еще одним преимуществом каннабидиола можно смело назвать его лечебные свойства и косметический эффект.
Компания стремится сделать акцент на своем фармацевтическом ноу-хау и инновационных подходах в производстве продукции, предназначенной для онкологии, заболеваний центральной нервной системы и косметологии.
Задача
У клиента уже был готов уникальный дизайн в бело-зелёных тонах, который идеально подходил для своих целей — рассказать потенциальным клиентам об экологичности и безопасности их продукции
Нашей задачей было качественно сверстать имеющийся дизайн, реализовать мультиязычность, интегрировать оплату картой и реализовать такую механику, при которой возможно делать заказ как с регистрацией, так и без нее. Помимо этого следовало обеспечить функциональность и быстродействие ответа сайта.
Реализация проекта
Реализация на WordPress
Как уже было упомянуто выше, сайт выполнен в натуральной цветовой гамме, которая наиболее близка к ощущению экологичности и природному происхождению продуктов Alpinols. Нам предстояло осуществить верстку, которая бы логически вписывалась в общую концепцию клиента.
Платформа WordPress позволяет реализовать дизайн любой сложности.
WordPress — это самая популярная система управления контентом (Content Management System) в мире. Эта CMS лежит в основе более 35% всех сайтов в интернете, и это число постоянно растёт. WordPress использует PHP и MySQL, они поддерживаются практически всеми хостинг-провайдерами. Однако специальные тарифные планы хостинга для WordPress могут значительно улучшить показатели скорости, производительности и надёжности любого сайта.
Итак, на выходе у нас получился продукт с главной страницей, которая логично проводит клиента от общей информации о компании до конечных продуктов, которые компания реализует как оптом, так и в розницу. Вверху на главной странице размещено ознакомительное видео, демонстрирующее основную деятельность компании: бережное выращивание и ответственный сбор сырья, из которого впоследствии и производится вся продукция компании.
Помимо этого был использован модуль WooCommerce, идеально подходящий для создания интернет-магазинов, использующих такие элементы, как категории товаров, карточки товаров, корзину.
Блоки
Сайт был поделен на следующие логические блоки:
- Информация о продукции Alpinols для оптовой и розничной продажи;
- Информация об Alpinols;
- Информация о производстве экстракта конопли для производства собственного продукта;
- Медицинская информация про лекарственный каннабис;
- Блок «О нас»;
- Блок «Для клиента»;
- Блок «Контакты».
Благодаря такому делению клиент сможет легко ориентироваться на сайте и не терять времени в поисках информации.
Техническая реализация
Мультиязычность
Мультиязычный сайт — это веб-ресурс, адаптированный для пользователей из разных стран. Наличие качественно переведенных версий сайта говорит о высоком уровне и целеустремленности компании, её заботе о пользователях, а также позволяет рассказать о своих преимуществах, технологиях, товарах и услугах более широкой аудитории.
В нашем случае, помимо немецкого, сайт был реализован на следующих языках: английский, французский, итальянский, испанский.
Данная функция была внедрена при помощи плагина переключения языков Polylang.
Polylang — это инструмент с открытым исходным кодом, позволяющий быстро создавать многоязычные веб-сайты на WordPress. Его отличие от плагинов с некорректным автоматическим переводом заключается в том, что он позволяет загружать свой собственный корректный перевод на нужный язык. Как показывает наша практика, это привлекает более широкий круг потенциальных клиентов на сайт благодаря тому, что языки переключаются между собой просто и быстро, и при этом весь текст остается корректным и читабельным на любом языке.
Интегрированная оплата картой при оформлении заказа
Данная интеграция была реализована при помощи системы Saferpay.
Saferpay — швейцарская платежная система, предоставляющая услуги в области интернет-процессинга и обеспечивающая прием платежей по банковским картам Visa, MasterCard и Diners Club International. Платежный сервис поддерживает технологию 3-D Secure.
Основным преимуществом для клиента является возможность расплачиваться в местной валюте благодаря динамической конвертации валют и отсутствие проблем с PCI, так как данные карты не сохраняются в магазине.
Также для большего удобства клиентов была реализована механика оформления заказа с регистрацией и без регистрации на сайте.
Разработка блока отзывов
Для разработки данного блока был использован плагин Strong Testimonials.
Благодаря Strong Testimonials можно легко организовать произвольную связь с посетителями, которые смогут легко поделится своими впечатлениями о товаре и услугах интернет-магазина.
Из особенностей можно выделить:
- создание любых полей — инструмент напоминает конструктор;
- понятный интерфейс;
- легкая интеграция шорткодами в странички блога;
- создание виджетов;
- быстрое обновление инструмента.
Быстродействие
Традиционно сайты, а особенно интернет-магазины, сделанные на платформе WordPress с модулем WooCommerce, сталкиваются с проблемой скорости загрузки. Так как часто это связано именно с подходом в разработке продукта, мы сумели добиться быстродействия веб-ресурса при помощи правильной верстки и оптимального использования всех доступных инструментов.
В нашем случае мы смогли добиться того, чтобы на десктопных устройствах сайт находился в зелёной зоне, а на мобильных устройствах обеспечивал жёлтую зону быстродействия.
Результаты
После завершения работ с версткой сайта по дизайну заказчика мы получили следующий результат:
- интуитивно понятную логику сайта;
- быстродействие и рациональность организации всех блоков;
- клиенты получили возможность оплачивать свой заказ картой;
- осуществлена возможность оформлять заказ без регистрации на сайте;
- мультиязычность значительно расширила клиентскую базу «Swiss Organic Partners».
Компания Webnauts помогает в осуществлении проектов по любому дизайну. Наши специалисты помогут сверстать, улучшить и оптимизировать сайт по желанию заказчика.
Комментарии