Интернет-магазин ковров и шкур «Aми Ковры»

О заказчике

Компания Ами Ковры работает с 2001 года и предлагает широкий ассортимент ковров от лучших производителей со всего мира. Компания ориентирована как на розничную торговлю, продажи в интернет-магазине, так и на сотрудничество с оптовыми и корпоративными покупателями. В компании свыше 80 сотрудников, филиалы в городах: Москва, Санкт-Петербург, Оренбург, Уфа, Самара, Екатеринбург, Тюмень.

Выполненные работы

Основные функциональные возможности проекта:

• Главная страница сайта содержит фильтр для быстрого поиска любого интересующего товара, слайдер и блоки новостной ленты.
• Двусторонняя интеграция с 1С. Обновление номенклатуры каталога, синхронизация заказов сайта с 1С производится автоматически.
• Оптимизированный импорт и каталог, формирующийся автоматически по имеющейся базе и свойствам товара, позволяет не прибегать к помощи программистов при любом изменении ассортимента товаров, их свойств и разделов. Настройки вывода списка фильтрации, параметры отображения каталога, списки доставок и оплат с легкостью могут настраиваться в административной части.
• Автоматическое определение местоположения пользователя.
• Удобная детализация товара, позволяющая переходить не только по схожим товарам, просмотренным ранее, схожим по расцветке, но и по пользовательским настройкам фильтрации, дает возможность пользователю найти и выбрать интересующий их товар без лишних поисков и переходов.
• Покупателям доступны разные способы оплаты заказов, как банковскими картами, так и через платежную систему.
• Система заказа в 1 клик без авторизации, позволяет моментально совершать покупки.
• Складской учет. Используется для показа наличия товара на конкретном складе/магазине.
• Под бизнес требования клиента и с целью увеличения скорости ответа, был переписали фильтр товаров с использованием Elasticsearch. Благодаря этому фильтр и поиск стали отрабатывать в несколько раз быстрее, можно искать не только по названию, но и по другим служебным полям товаров даже с учетом опечаток «кавер-ковер». Для фильтрованных страниц генерируется ЧПУ и СЕО текст. Для конкретных страниц можно задавать индивидуальных СЕО текст.
• Добавление товара в корзину на странице списка товаров с возможностью выбора конкретного размера товара.
• Показ розничных магазинов на Яндекс.Картах.
• Импорт данных со старого сайта в новом формате для разработанного сайта.
• Интеграция с Google Merchant Center для увеличения ранжирования поиска товаров в Google.
• Интеграция с Яндекс Ecommerce и Google Ecommerce, что позволяет анализировать и использовать в рекламных кампаниях Директа информацию о действиях посетителей сайта, связанных с электронной коммерцией (просмотр товара, добавление/удаление товара из корзины, оформление заказа).
• Интеграция с OZON Retail и с Яндекс.Маркет. Позволяет размещать торговые предложения магазина на площадках Яндекс.Маркета и OZON. При оформлении заказа на площадках, автоматически создается заказ на сайте, а затем выгружается в 1С.
• Использование google reCAPTCHA для защиты от интернет-ботов.
• Увеличение скорости сайта, благодаря:
  • автоматической оптимизации изображений в более современный формат webp. В таком формате изображение имеет меньший размер, а значит быстрее скачивается, но если браузер не поддерживает формат webp, то будут подгружены изображения в исходном формате.
  • использовании векторной графики. В основном это различные иконки, логотипы, то есть те изображения, которые легко можно описать формулами и состоят и небольшого количества цветов. Такие изображение имеют небольшой вес и нет потери качества при масштабировании. Особенно это важно для экранов с плотным количество пикселей (все современные мобильные устройства, retina-подобные экраны и т.д.);
  • использованию спрайта для векторной графики;
  • стилизации верстки по методологии БЭМ, в нашем случае это дало значительный прирост скорости рендеринга страниц.
  • отложенной загрузки изображений ниже первого экрана. Также влияет на скорость загрузки страницы, браузер сразу не скачивает все изображения, а только те, которые отображаются на экране. И это реализовано с помощью нативного функционала. В отличии от устаревшего подхода загрузки отложенных изображений с помощью JS кода, этот подход работает быстрее.
  • написанию стилей с помощью на sass. В сочетании с БЭМ это ускоряет написание CSS стилей и как на этапе разработки, так и в дальнейшей техподдержке сайта.
  • использованию Webpack для создания сжатых JS и CSS файлов. Сжатие необходимо, чтобы уменьшить время их скачивания браузером, а в следствии увеличивается скорость отображения страницы. Также для разных типов страниц используется только тот CSS и JS код, которых необходим для конкретного типа страницы. В таком случае это не только уменьшает время скачивания файлов, но и дает меньше кодовой нагрузки на браузер, т.к. он меньше выполняет JS и CSS кода. То есть браузер не делает лишних действий, которые не влияли на общую картину рендеринга конкретной страницы. Например, на странице «Доставка» не будет использоваться CSS и JS код, связанный с фильтром товаров.
  • Ленивой подгрузки функциональных блоков, которые сразу не отображаются на сайте. Например, выпадающее меню, блок выбора города. За счет уменьшения количества html тегов на странице, браузеру нужно меньше времени на обработку и уменьшается время ответа от сервера, т.к. со стороны бэкенда страница генерируется быстрее из-за меньшего количество обработки данных.