105

Верстка сайта Videyra

Список страниц

  1. Главная
  2. Каталог
  3. Страница товара
  4. Корзина
  5. Избранное
  6. Доставка, возврат

Нюансы верстки

Ниже я покажу некотрые особенности верстки, решения и демо работы.

Товар

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

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

Поэтому для этого элемента я сделал один класс, который расширил модификациями: для корзины, для каталога, для избранного.

Верстка сайта Videyra 1

Демо работы интерфейса

Меню в каталоге

Переключение вида товаров

Фильтры и сортировка

Боковое меню

Демо прокрутки, прокрутка двух областей

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

Выбор цвета и размера

Окно заказа

Заказать крутой дизайн
Поделиться
Отправить
Линкануть
Вотсапнуть
← К списку проектов