Сравнение товаров

Interaction Design Patterns (Web)
автор: 2002 Martijn van Welie
перевод: Александр Качанов

(назад к списку)

С сайта www.matrox.com

Задача

Пользователи хотят сравнить похожие товары

Условия

Речь идет о торговом сайте, либо сайте где продаётся продукция компании, о сайтах-аукционах. Полсетитель пришел на страницу товаров и каким-то образом получили список товаров. Теперь им необходимо принять решение, какой из похожих товаров выбрать. Для разных пользователей важными могут считатья разные параметры товара. Должна быть возможность легко сравнить одни и те же функции у товаров. У товаров может быть различное количество функций.

Решение

Покажите сравнительную таблицу товаров и их функций

Функции товаров выводите в рядах таблицы, а названия товаров - в колонках. Если функция в товаре присуствует, отметьте ее. Если нет - не отмечайте. Если функция обладает какими-то свойствами, которые могут быть интересны для посетителя, покажите эти данные вместо простой отметки.

Если функций много, сгруппируйте их, чтобы посетители могли сравнивать товары по различным аспектам. Если похожих товаров слишком много, сделайте так, чтобы посетитель мог сам выбрать, какие из товаров он хочет сравнить. Это можно сделать либо на той же странице, если список товаров невелик, либо в два этапа:

Почему

Сравнительная таблица дает простое и ясное описание товаров и облегчает их сравнение. Так отметки ставятся только, если функция в твоаре присуствует, таблица не перегружается визуально.

Еще примеры

Данный пример - с сайта www.expedia.com. На данной странице совмещается сравнение товаров (туристических туров) с выводом результатов поиска. В списке результатов можно выбрать любой тур (поле Compare), щелкнуть ссылку "Compare selected cruises" и сравнить только выбранные туры. На странице, где туры сравниваются, посетители могут снять метку в поле и таким образом исключить какой-либо тур из сравнения.

А вот пример с сайта www.creative.com где выбираются характеристики товара и модели :

пример с сайта www.mcafee.com:

Используют www.3dblaster.com Другие шаблоны

Rambler's Top100
Rating All.BY
Akavita
Valid XHTML 1.0!