Магазин Mnogoprint с оригинальным дизайном и функционалом.
Оглавление статьи
1. Дизайн
2. Блоки на сайте.
3. Функционал.
4. Интересные особенности.
5. Дополнение от разработчика.
1. Дизайн
2. Блоки на сайте.
3. Функционал.
4. Интересные особенности.
5. Дополнение от разработчика.
Интернет-магазин по продаже картриджей с нешаблонным дизайном и функционалом. Сделан от-и-до и под ключ. Работа нешаблонная, сложная, в процессе реализовано множество дополнений, доделок и переделок.
Дизайн
. Дизайн совершенно нестандартный, и, я бы сказал, нарочито нестандартный, адаптивный. Начать с того, что логотип находится справа вопреки всем возможным и невозможным правилам. Хотя на мой взгляд сайт всё-таки недостаточно радикален, от некоторых идей пришлось отказаться в процессе по желанию клиента. К сожалению по желанию клиента также пришлось убрать большую стрелку со страницы товара. Это безусловно разрушило общую концепцию дизайна сайта, но зато решило некую локальную проблему юзабилити. Дизайн главной страницы (и всего сайта) основан на стрелках. Стрелки везде. Это и кнопки, это и тематические блоки с товарами на главной, это даже строки рекламного блока "почему у нас покупают". Все стрелки при уменьшении размера экрана ведут себя по разному. Какие-то переносятся и свиваются в кольца как змеи, у каких-то просто исчезают носики.Блоки на сайте.
Сайт состоит из шапки, подвала, центральной области с контентом и правого сайдбара. Довольно обычно, согласен с внимательным читателем. Ещё важная особенность - при уменьшении ширины экрана менее важные элементы исчезают, а не переносятся куда-нибудь из зоны просмотра. Это безусловно помогает клиенту с мобильным устройством ориентироваться на сайте и улучшает юзабилити, хоть и ограничивает функционал.Функционал.
Большинство сложных элементов на сайте сделано при помощи htmlcss css вместо использования js. Это сделано для того, чтобы уменьшить количество загружаемых скриптов и как следствие - увеличить скорость загрузки сайта, а значит - увеличить конверсию. Единственно что пришлось сделать картинкой так это маленькие жёлтые стрелки различных кнопок. Сделать их при помощи css качественно к сожалению не вышло. Зато на css работает главное верхнее меню, что неплохо увеличивает скорость загрузки сайта.Интересные особенности.
Интересная особенность сайта - на страницах корзины и блога правый сайдбар исчезает. Это безусловно улучшает юзабилити сайта - клиент видит, что ему не подсовывают лишнюю назойливую информацию, к тому же, если говорить о корзине, сайдбар не отвлекает от самого главного, что есть в магазине - от совершения покупки. На некоторых страницах, например, целевая страница, корзина, на информационных статических страницах перед заголовком h1 поставлена картинка. Получилось красиво и здорово. Ещё интересная фишка на странице товара. При уменьшении ширины экрана менее 480px название товара заголовок h1 переносится под изображение. То есть сначала идёт шапка, потом изображение товара, потом заголовок, а потом характеристики. Эта простая и неочевидная штука помогает пользователю, читающему характеристики товара. В каталоге товаров сделана возможность отображать товары как в виде плитки, так и в виде таблицы. В корзине около каждого способа доставки стоит картинкаДополнение от разработчика.
. К сожалению я не могу сказать, что я горжусь сделанной работой. Точнее, не совсем так. Разумеется, я горд объёмом и сложностью проделанной работы, это было действительно трудно. Более того, когда я возвращался к каким-то другим "фоновым" проектам, я видел как вырос мой уровень как верстальщика. Но получившийся в итоге код никак нельзя назвать изящным, никак нельзя назвать идеальным, совершенно правильным и как перфекционисту мне этот код не нравится. Такая досадная ситуация получилась из-за смены концепций. Простой пример. Допустим, Вы строитель и строите детский садик. Уже почти построили и тут Вам заказчик говорит: нет, теперь это будет овощехранилище. Будут проблемы у Вас, как у строителя? Да, они будут колоссальны. Будут проблемы у заказчика в процессе эксплуатации? Да, разумеется. Потому что есть концепция. Её нельзя смешивать, в конечном итоге из детского садика может получиться неплохое овощехранилище (если Вы профессионал и любите потрудиться), но оно не будет идеальным и стоить будет дороже.Если Вы заказчик сайта и читаете эти строки, надеюсь эта информация будет для Вас полезной. В вёрстке так. Одна концепция - одна вёрстка. Другая концепция - другая вёрстка. Две концепции - городьба. А чем плоха городьба? Тем, что она чревата труднопредсказуемыми ошибками, а так же её дороже поддерживать. Потому что в городьбе сложнее и дольше, а соответственно, дороже разобраться. Городьба - расходы больше, чистый код - расходы меньше. А в целом сайт плучился интересный и яркий.Приложения к тексту:
<--Предыдущая статья | Следующая статья-->