OpaGPT 1. Сжимаем визуальный шум: превью на 3 секунды
Среднее время просмотра карточки на мобильном Ozon — 2,8 секунды. Первые 3 слайда галереи должны отвечать на главный вопрос: «Зачем это мне?». Убери лишние фоны, оставь продукт в центре. Используй вертикальные кадры 9:16 — они занимают 78% экрана без обрезания.
Чек-лист: первое фото — товар на белом фоне, второе — сцена использования, третье — ключевая деталь (шов, замок, текстура).
2. Rich-контент: мобильный формат без горизонтальной прокрутки
На десктопе rich-контент может быть широким, на смартфоне — только одноколоночным. Ширина контейнера на Ozon Mobile — 360–390 px. В OpaGPT мы тестировали: адаптивный rich-контент повышает конверсию на 23% за счёт того, что пользователь не делает лишних жестов.
Правило 2026 года: все блоки rich-контента должны открываться вертикально. Избегай таблиц с тремя колонками — на мобильном они превращаются в кашу.
3. Текст на 40% короче, смысл на 100%
На мобильном экране читаемость падает на 40% при длине строки более 60 символов. Описание в rich-контенте сокращай до 2–3 предложений на блок. Используй маркеры преимуществ: «⚡ Быстрая доставка за 1 день», «✅ Гарантия 12 месяцев».
4. Кнопка «Купить» — всегда в зоне большого пальца
По статистике Ozon за 2025 год, 67% покупок совершаются большим пальцем правой руки. Кнопка CTA должна находиться в нижней трети экрана, а не под описанием. В rich-контенте размещай плавающий блок с ценой и кнопкой — это увеличивает кликабельность на 31%.
5. Интерактивные элементы: только тап, без ховера
На смартфонах нет наведения курсора. Все подсказки, зум-эффекты и выпадающие списки должны срабатывать по тапу. Например, в rich-контенте Ozon используй «аккордеон» для характеристик: раскрывается только по нажатию.
6. Видео — 15 секунд, автостарт с субтитрами
На мобильном Ozon видео автозапускается без звука. Длина — не более 15 секунд. Добавь субтитры: 82% пользователей смотрят без звука. Пример: для одежды — покажи, как ткань тянется, для электроники — включение одним нажатием.
7. Шрифты не меньше 14 px
Минимальный размер шрифта в rich-контенте для смартфонов — 14 px. Заголовки — 18–20 px. Мелкий текст (менее 12 px) Ozon может автоматически скрывать на мобильных устройствах с 2026 года.
8. Сетка изображений 2×2, а не 3×3
В мобильной версии Ozon блоки сравнения или «до/после» лучше размещать как 2 колонки. Три колонки делают картинки размером с почтовую марку — кликабельность падает на 44%.
9. Отступы между блоками — 16 px
Пальцем сложно попасть в элемент, если отступы меньше 12 px. Оптимальные отступы между блоками rich-контента на Ozon — 16 px. Это снижает количество ложных тапов и улучшает юзабилити.
10. Цветовые акценты только в одном месте
На мобильном экране больше 2–3 ярких цветов создают визуальный шум. Выдели только цену, скидку и кнопку. Остальное — в нейтральных тонах. Пример: чёрный/белый фон + один акцентный цвет (например, оранжевый для скидки).
11. Анимация — не дольше 0,3 секунды
Плавные переходы в rich-контенте (появление текста, смена картинки) должны длиться 0,2–0,3 секунды. Дольше — пользователь уходит. На Ozon зафиксировано: задержка анимации более 0,5 с увеличивает отказы на 19%.
12. Хлебные крошки — обязательны
На мобильной версии Ozon навигация через хлебные крошки снижает количество выходов из карточки на 27%. Размещай их в самом верху rich-контента: «Главная > Категория > Подкатегория > Товар».
13. Адаптация под тёмную тему
С 2025 года 54% пользователей Ozon включают тёмную тему. Rich-контент должен корректно отображаться на чёрном фоне: избегай белых плашек, используй полупрозрачные элементы и светлые шрифты.
14. Кнопки социального доказательства — компактно
Отзывы и рейтинг на мобильном экране не должны занимать больше 2 строк. Используй иконку звезды, число отзывов и один яркий тег (например, «Выбор покупателей»). Полный блок отзывов — в раскрывающемся списке.
15. Тестирование на реальных устройствах
Перед публикацией проверь карточку на 3 моделях: iPhone SE (маленький экран), Samsung Galaxy S24 (средний), Pixel 8 Pro (большой). Используй эмулятор Ozon в браузере или физические устройства. Ошибки мобильной вёрстки стоят 12–15% потерь заказов.
16. Скорость загрузки rich-контента — до 2 секунд
Оптимизируй изображения: формат WebP, размер не более 200 КБ на файл. Общий вес rich-контента — до 1,5 МБ. Если страница грузится дольше 3 секунд, 40% пользователей закрывают карточку.
17. Уникальные блоки для мобильного: «Как использовать»
Добавь в rich-контент блок с пошаговой инструкцией в виде иконок (3–4 шага). На мобильном это лучше читается, чем длинный текст. Пример: «Шаг 1: Открой упаковку → Шаг 2: Нанеси на кожу → Шаг 3: Втирай 2 минуты».
18. Сравнение товаров — в виде слайдера
Вместо таблицы сравнения используй горизонтальный слайдер с двумя фото (до/после) или карусель характеристик. На мобильном Ozon такой формат даёт +18% к удержанию внимания.
19. Чек-лист перед публикацией
- Проверить: все ли блоки rich-контента вертикальные?
- Убедиться: кнопка CTA видна без скролла?
- Отключить: hover-эффекты, заменить на тап.
- Сжать: изображения до 200 КБ.
- Протестировать: на 3 устройствах.
20. Итог: мобильный rich-контент как драйвер продаж
Адаптация карточки под смартфоны на Ozon — не просто тренд, а необходимость. К 2026 году более 80% заказов будет совершаться с мобильных устройств. Rich-контент, оптимизированный под мобильное юзабилити, увеличивает конверсию в 1,5–2 раза. Начни с первых 3 пунктов чек-листа — и увидишь рост продаж уже через неделю.