An Ideal Product Card: 12 Must-Have Elements and Rules for Mobile version
how to inform vendors
How to notify vendors about a paid order

An Ideal Product Card: SEO


In the last article, we listed 12 elements that will make your product card ideal for your online store visitors. However, these are not all the details that you need to know. Product cards should also be attractive to search engines. 

If there are several dozen categories in a large online store, then the number of products can be in the thousands. This means that most of the site will be made up of product pages, and their SEO will have a positive effect on the promotion of the online store as a whole.

Let’s consider what should be in a product card for good SEO and how to set up and fill in these elements correctly.

Product card markup

You should use the markup “Product” of the standard (or Product Schema). It helps search robots understand where is the product price, where is its description and where is its image. Then the search robot will be able to analyze the information correctly, determine how relevant the information on the page is to the user’s request and display it when generating snippets. The user will know what awaits him when switching to the product card. Finally, it increases the attractiveness of the resource in the search results.

Here is how a product card snippet with markup looks like in search results:

product markup example

CS-Cart has Product Schema markup by default, you don’t have to buy anything or configure it additionally. You can read more about markup in our article “Everything you need to know about the markup in CS-Cart online store”

Meta tags

In short, meta tags help search robots to recognize information on a product page: understand what query to show it in search results and what exactly to show. For the product card, you need to fill in 4 meta tags: title, description, h1 and keywords.

Page title

This meta tag should contain a keyword, usually the name of the product. You can also enter brand, model, city, important characteristics and commercial words (“price”, “buy”, etc.). The size of the page title should be 70-80 characters, this is how much search engines can recognize and display. 

When filling in the page title, you shouldn’t:

  • list words separated by commas: for example, “plastic windows, buy, price, moscow, cheap”; 
  • make the title the same as the heading h1;
  • make the title of one product card the same as the title of another. Within one site, all meta tags must be unique;
  • use a period, exclamation or question marks.

When filling in the page title, you can use a dash, comma, colon and parentheses.

This is how the page title looks for the user:

product title example


product title example
Universal template for any page title:

[Product name] – [Brand] – [Model] – [characteristics].

Meta description

The meta description should not duplicate the page title, but should expand it. This meta tag includes the name of the product, brand, model, characteristics, information about delivery and guarantees, call-to-action, special characters. The description must be between 70-156 characters.

When filling in the meta description you shouldn’t use a period, exclamation mark or question mark.

When filling in the meta description you can use a dash, comma, colon and parentheses.

For an online store visitor the meta description looks like this:

description example

Universal template for meta description:

[Product name] [brand] at a price [price] USD. Delivery to [city]. Full range of products on the site. Order [product name] right now.

H1 heading

This is the main heading of the text, where you should enter the name of the product. 

Basic rules for the h1 heading:

  • it must be written on every page of the site;
  • there can be only one h1 heading per page. If you need more headings on the page, use h2-h6 headings; 
  • the text in the h1 heading must be different from the title.

This is how an online store visitor sees the h1 heading on the product card:

h1 example


These are the keywords by which the page is being promoted. The user does not see them, they are only needed to exchange information between the online store and the search engine. 

You need to take only those keywords that are relevant for the product card. This is usually 2-5 of the most significant words from the title. Punctuation marks are not used in keywords, but they are separated by a comma.

It is important that the keywords must be unique for each page. If it is difficult to fill it for all of the products, then it is better not to fill in keywords at all than to duplicate them. Duplicates worsen the site ranking and only one page from duplicates gets into the search results.

The easiest way to work with meta tags in a CS-Cart Online store 

The fastest and most convenient way to work with metadata in an online store is to set up a template that will fill everything in automatically. You can do this with the “SEO Templates” add-on. Below we have given an example of how it looks from the CS-Cart administrative panel. Placeholders and text can be taken by others, detailed information is in the documentation on the addon’s page.

seo templates example


“Breadcrumbs” is a navigation from the home page to the current page. This element is useful both for the user (it is easy to return to any previous page) and for SEO (it provides additional linking of pages).

This is how “breadcrumbs” look for an online store visitor:

breadcrumbs example

“Breadcrumbs” should be located at the top of the page. Every element in the chain, except for the last one, must be clickable (if you make the last element of the chain clickable, you will end up with a circular link, which negatively affects SEO).


An attractive design and usability of a product card does not make sense without SEO. Search engines won’t see your products or won’t rank high on your pages, which means users won’t find you. The converse is also true, if you’ve done good SEO and people don’t like your product card, you will get a low conversion rate and a high bounce rate. As a result, negative user experience will also reduce the store’s position in the search results. 

As you can see, in e-commerce everything is interconnected: you can’t work on one thing and think that sales will boost. The effect is provided only by an integrated approach. You need to constantly monitor your online store and quickly respond to a decrease in site ranking.

Choose SEO from Cart-Power. A professional team will work on your project: not only an SEO specialist, but also a programmer, designer, marketer and copywriter. We will conduct a free preliminary audit of your online store. On its basis, a promotion strategy will be created in the first month of work. We will increase targeted traffic to your site and achieve an increase in conversion.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>