Добрый день. В этой статье рассмотрим основные моменты на что стоит обратить внимание при заполнении и верстке карточки товара на любом сайте.
Итак, начнем по порядку...
1) ЧПУ ссылки карточки товара
ЧПУ (человеку понятный урл ссылки). Бывает так, что при формировании структуры сайта, ссылки на позиции товаров генерируются из кодов товаров или id товаров - это неправильно. Ссылки на товары должны формироваться из транслитерации названий товаров.
Пример: https:site.ru/catalog/27923/672342 - тут ссылки сформированы из id товара.
Должно быть так: https:/site.ru/catalog/smartfony/smartfon-xiaomi-redmi-11lite-256.
2)Хлебные крошки
Это полный путь до карточки товара со всеми ссылками, который как правило указывается в самом верху каждой страницы. Это своеобразная перелинковка страниц.
3) Заголовок Title и описание description товара
Заголовок title визуально не виден, только если навести указатель мыши на вкладку в браузере. Обычно указывается в коде страницы. Этот заголовок один из самых важных для правильной оптимизации сайта под поисковые системы, ведь именно по нему поисковые системы понимают что за контент на странице, и отображают этот заголовок в выдаче поиска.
Длина тега title не должна превышать 60-70 символов.
То же самое с мета тегом description. В нем содержится краткое описание страницы. Размер description не должен превышать 300 символов.
И в title и в description необходимо указывать ключевые слова карточки товара.
Примеры:
<title>Купить смартфон Xiaomi 11 lite 256 ГБ в Таганроге со скидкой</title>
<meta name="description" content="В нашем магазине site.ru вы можете приобрести смартфон Xiaomi 11 lite 256 ГБ в Таганроге с доставкой по выгодной цене." />
4) Фото товара и описание
Обязательно наполняйте Ваши товары только качественными фотографиями без водяных знаков, желательно добавлять по несколько фотографий к каждому товару. Для фотографий нужно так же указывать теги alt и title, в которых содержатся описания для изображений.
В описании к товару так же нужно вставлять 1-2 ключевых слова (заголовок товара) все зависит от количества символов в описании.
Описание должно содержать основные ключевые моменты по товару, и должно быть порядка 1000 символов в идеале.
5) Тег H1 - название товара
Очень важно указывать в теге H1 название самого товара, убрать все сокращения товара из названия.
Пример:
<h1>Cмартфон Xiaomi 11 lite 256 ГБ</h1>
6)Микроразметка для товара
Микроразметка нужна для того, чтобы помочь роботам поисковых систем определить где и что находится на странице, проиндексировать контент и выдать хороший сниппет в поиске.
Выглядит разметка примерно так:
<div itemscope itemtype="http://schema.org/Product">
<h1 itemprop="name">Cмартфон Xiaomi 11 lite 256 ГБ</h1>
<img src="/photo.jpg" itemprop="image">
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<div>20 899 руб</div>
<meta itemprop="price" content="20 899.00">
<meta itemprop="priceCurrency" content="RUB">
</div>
<div itemprop="description">Cмартфон Xiaomi 11 lite 256 ГБ цвет серый имеет отличный дизайн и подойдет для любого пользователя.</div>
<div>Производитель: <span itemprop="brand">XIAOMI</span></div>
<div>Модель: <span itemprop="model">11 lite</span></div>
</div>
7) Цена и наличие товара, кнопка купить, отзывы, характеристики товара
Тут все понятно. Это основные блоки магазина и они должны быть.
8) Адаптация под мобильные устройства
В данный момент адаптация под все устройства считается одним из самых главных параметров и для поисковых систем. Если сайт не адаптирован под мобильные устройства вы теряете до 60% потенциальных покупателей и поисковые системы будут хуже ранжировать Ваш сайт в выдаче.
Проверить адаптацию под мобильники можно в браузере Google Chrome нажав F12 и далее наживаете CTRL+SHIFT+M и в самом меню можно выбрать режимы просмотра на мобильных устройствах.