Картка товару
Картка товару (product page, PDP) — сторінка інтернет-магазину з описом одного товару, його фото, ціною, варіантами та кнопкою «Купити». Це місце, де покупець остаточно вирішує, купувати чи ні.
Простими словами
В інтернеті товар не потримаєш і не приміряєш. Тому картка має замінити прилавок: показати, як річ виглядає, з чого зроблена, скільки коштує разом із доставкою і що буде, якщо не підійде. Nielsen Norman Group зазначає, що погана картка призводить до двох наслідків: покупці йдуть, бо бракує інформації, або купують не те й повертають (NN/g).
За Baymard, майже всі користувачі дивляться картку товару перед покупкою, і часто саме вона визначає, куплять чи ні (Baymard).
Що має бути на картці
NN/g виділяє обов'язковий мінімум (NN/g):
- змістовна назва;
- розпізнавані фото, які можна збільшити;
- повна ціна, з урахуванням зборів, пов'язаних із товаром;
- зрозумілі варіанти (розмір, колір);
- наявність;
- кнопка додавання в кошик з чітким підтвердженням.
Додатково — рейтинги, відео, зум, схожі товари, список бажань, якщо вони справді корисні й якісно зроблені. Опис має бути повним, але стислим: найважливіше на початку, без маркетингового шуму. Складні характеристики зручно подавати таблицею.
Де сайти найчастіше помиляються
Baymard перевіряв картки на сайтах США та ЄС. 52% десктопних, 62% мобільних сайтів та 64% застосунків отримали оцінку «посередньо» чи гірше. Окремі цифри з їхнього огляду (Baymard):
- 57% сайтів не показують розміри кнопками, а ховають у випадному списку;
- 37% не мають фото «в масштабі», хоча 42% користувачів оцінюють розмір за фото;
- 67% не показують орієнтовну загальну вартість замовлення біля кнопки купівлі;
- 44% не дають посилання на умови повернення з основного контенту картки, при цьому 60% користувачів шукають їх саме там, а 15% відмовлялися від замовлення через незадовільні умови;
- 89% не відповідають на негативні відгуки.
Для українського магазину це означає: орієнтовна вартість доставки Новою поштою, строки, умови повернення й наявність розмірів мають бути видні без переходу в кошик.
Як на це дивляться різні джерела
NN/g радить показувати пов'язані товари «економно» і лише дуже релевантні, щоб вони не відволікали від характеристик (NN/g). Baymard окремо досліджує такі підказки в кошику й попереджає, що нерелевантні рекомендації знижують довіру до всіх підказок сайту (Baymard). Докладніше: апсел і кроссел.
Щодо варіантів товару NN/g радить одну сторінку на один товар з вибором кольору чи розміру на ній, а окремі картки лише для варіантів, що суттєво відрізняються за описом чи функціями (NN/g).
Типові помилки
- Мало фото й жодного, що показує масштаб.
- Загальна ціна стає відома лише в кошику.
- Однакові описи, скопійовані від виробника.
- Немає відповіді на питання про доставку й повернення.
- Відгуки без можливості відфільтрувати й побачити негативні.
FAQ
Що має бути на картці товару? Назва, якісні фото, повна ціна, варіанти, наявність, кнопка «В кошик», опис і характеристики, відгуки, умови доставки й повернення.
Скільки фото потрібно на картці? Чіткої цифри в використаних джерелах немає. NN/g радить кілька ракурсів, деталі й фото в застосуванні (NN/g).
Чи потрібні відгуки на картці? Так, покупці читають їх, щоб зрозуміти, як товар працює в реальному користуванні. Докладніше: соціальний доказ.
Чому картка не продає? Типові причини: бракує інформації, не видно повну вартість, незрозумілі варіанти, немає довіри. Перевіряйте це на реальних покупцях і A/B-тестом.
Пов'язані терміни
- Сторінка категорії
- Соціальний доказ і відгуки
- Сигнали довіри
- Апсел і кроссел
- Конверсія інтернет-магазину: що це і як її рахувати
- Що таке юзабіліті сайту і як його оцінити
Джерела
- Nielsen Norman Group. UX Guidelines for Ecommerce Product Pages — nngroup.com/articles/ecommerce-product-pages
- Nielsen Norman Group. Design Guidelines for Selling Products with Multiple Variants — nngroup.com/articles/products-with-multiple-variants
- Baymard Institute. Product Page UX Best Practices 2026 — baymard.com/research-articles/current-state-ecommerce-product-page-ux
- Baymard Institute. E-Commerce Product Page Usability Research — baymard.com/research/product-page
- Baymard Institute. 6 Ways to Improve the Relevance of Cross-Sells in the Cart — baymard.com/blog/product-recommendations-cart
Читайте також
Фото й відео товару та AI-генерація
Фото товару — головний спосіб показати покупцеві річ, яку він не може потримати в руках. AI-генерація допомагає зробити фон, ракурс чи ілюстрацію, але має чіткі правила: у Google Merchant Center такі зображення треба маркувати, а в ЄС діють нові вимоги до…
Сигнали довіри
Сигнали довіри (trust signals) — це елементи сайту, які допомагають покупцеві повірити, що магазин реальний, чесний і безпечний для оплати: відгуки, контакти, умови доставки й повернення, візуальні ознаки захисту на формі картки, знайомі способи оплати.
Поріг безкоштовної доставки
Поріг безкоштовної доставки (threshold free shipping) — це правило: доставка безкоштовна, якщо сума замовлення не менша за визначену (наприклад, від 1 500 грн). Для магазину це спосіб підняти середній чек, для покупця — стимул докласти ще один товар.
Структура каталогу інтернет-магазину
Структура каталогу — це те, як товари розкладено по категоріях, підкатегоріях, фільтрах і адресах сторінок. Вона відповідає на два питання: чи знайде покупець потрібне за кілька кліків і чи розуміє пошуковик, які сторінки важливі.