CTA Placement Best Practices

The position of the Tangiblee call to action (CTA) on a product page has more effect on open rate than its size, color, animation, or wording. This article describes where to place the CTA, how to design it, and how to label it, by device and product category, with the data behind each guideline.

Before you start

• Open rate is the share of users on a Tangiblee product page who open the Tangiblee experience. It counts all users on the page, including users who never scroll to the CTA.
• The data comes from two Tangiblee Analytics audits of product pages, from July to October 2026. One audit covers jewelry and watches. The other audit covers bags and luggage.
• Results are aggregated across retailers. They do not identify individual sites.

[[warning]]The audits compare different retailers. Category, market, price point, and traffic are not controlled. Treat the results as strong guidance, not proven effects, and test any large change before you roll it out. See “Test a CTA change” below.[[warning]]

Key guidelines

Mobile CTA placement

On mobile, CTAs in the first screen have a higher open rate than CTAs below the fold. The strongest placements are directly below the gallery or main image, and at the bottom of the main image. This area is in the thumb zone, and it is on the path of the shopper’s eye toward the product details.

On bags and luggage pages, a CTA directly below the gallery has a median open rate of 17.4%. A CTA in the buy box, below the fold, has a median open rate of 10.6%.

Bags and luggage (median open rate, 90 days)

Jewelry and watches (mean open rate, 7 days)

One low-traffic retailer put its CTA at the bottom of the main image and reached 30.3%. This supports the bottom-of-image zone, but it is not a precise figure.

The same pattern appears when one retailer is compared across devices. 10 of 13 bags and luggage retailers with the mobile CTA in the buy box, below the fold, have a lower open rate on mobile than on desktop, by a median of 3.6 percentage points. Retailers with the CTA directly below the gallery gain a median of 2.1 points on mobile.

[[info]] The two audits use different periods and methods. Compare placements inside one audit, not between audits. [[info]]

Mobile guidelines

• Pin an overlay to the image, not to the screen.
• Inset the overlay 16 to 20 pixels from the image edge.
• Keep the overlay visible while the shopper swipes through the gallery.
• Do not put the CTA in the top corners of the image. It competes with the breadcrumb and the navigation.
• Do not put the CTA below the thumbnail strip or in the buy box. These areas usually fall below the fold.
• Check for floating elements, such as chat bubbles, loyalty badges, accessibility buttons, and sticky Add to Cart bars. Check the CTA at every scroll position. If an element covers it, move the CTA toward the center.

Desktop CTA placement

On desktop, the buy box is usually visible without scrolling. We recommend placing the CTA between the variant selector and Add to Cart, where the shopper chooses size, color, or style. If the layout does not allow this, place the CTA centered directly below the main image.

Overlays at the top of the main image have the lowest open rate in both audits. In the bags and luggage audit, buy box placements have medians of 13.9% for a small link and 13.2% for a full-width button. CTAs on the main image have a median of 10.8%.

Bags and luggage (median open rate, 90 days)

Jewelry and watches (mean open rate, 7 days)

[[info=Tip:]] A placement that works in the desktop buy box does not carry over to mobile. The buy box usually falls below the fold on mobile. Set the placement for each device.[[info]]

Placement by category

The general guidelines apply to every category. The table shows what the data adds for each category.

Bags and luggage

Bags and luggage has the strongest evidence of any category, on both devices. On mobile, the highest open rate in the audit came from 2 pills at the bottom of the main image. On desktop, the buy box has a higher open rate than the main image.

Size and capacity drive the decision to buy a bag. If both experiences exist, we recommend 2 entry points: one for scale and one for capacity. Size labels and capacity labels have almost the same open rate. Choose the label that matches what the experience shows.

Open rates also change by market with the same layout. One brand has mobile open rates from 8.6% to 13.8% across its markets. Compare placements inside the same market.

Jewelry

Most of the jewelry data comes from ring pages. The samples for bracelets and earrings are small. On mobile, a CTA directly below the main image, centered, has the highest average open rate (14.5% across 5 retailers). On desktop, directly below the main image has the highest average open rate (11.0% across 3 retailers), and top-of-image overlays have the lowest.

A camera icon is the try-on convention for the category. Wording was not analyzed for jewelry, so the general label guidelines apply.

Watches

The audits include 2 watch retailers, with mobile open rates of 8.4% and 12.7%. This is not enough to separate placements. We recommend the jewelry guidelines: a try-on CTA with a camera icon, in the first mobile screen, at the bottom of or directly below the main image.

CTA design

Style

The CTA must look like an action, and it must stay secondary to Add to Cart.

• A plain text link reads as body copy or navigation.
• A large filled button in a purchase color can be mistaken for Add to Cart, or ignored as one.
• An outlined button, or a white pill with a border and an icon, is the recommended pattern.
• On images, check that the CTA has contrast on light and dark product photos.

In the bags and luggage audit, the largest button was a filled button that resembled a purchase action. It was one of the lower performers on both devices. Full-width buttons and small links in the desktop buy box performed about the same.

Size

Size has less effect than position.

• On mobile, use a height of 44 pixels or more.
• On mobile, use a width of 35 to 60 percent of the screen. This is the range of the strongest mobile CTAs in the jewelry and watch audit.
• On desktop, match the width of the swatch row or the Add to Cart column.

Icon

A literal icon shows the shopper what happens when they click. Use a camera for try-on, a ruler or scale for size, and a bag outline for capacity.

11 of 15 jewelry and watch retailers use a camera icon. Abstract icons, such as a scan frame, ask the shopper to guess. One retailer with an icon toggle and no text reaches 27.7% on mobile.

Animation

Animated and static CTAs do not separate in the data. 5 of the 15 jewelry and watch retailers use an animated CTA.

CTA label

In the bags and luggage audit, wording shows no consistent link to open rate after placement and market are considered. A label is basic quality, not a growth lever. We recommend a short, specific label in the language of the shopper.

[[info]] Wording was not analyzed for jewelry, watches, or furniture and home decor. These labels are examples, not measured results.[[info]]

Avoid these labels:

• Generic labels such as “Size information”. They look like a static size chart.
• Words that are not clear for the category. For bags, avoid “fit” alone.
• The name of the native size guide or dimensions section of the site. A native accordion with the same name competes with the CTA.

What the wording data shows

• Size and capacity labels have almost the same open rate: 12.3% and 11.5% on mobile, and 13.7% and 13.1% on desktop.
• Labels that start with a verb lead on desktop (14.3% against 12.9%) but trail on mobile (10.5% against 12.7%). There is no consistent direction.
• Label length shows no clear link to open rate. For the 14 labels in English or another Latin-script language, the rank correlation is -0.19 on mobile and 0.11 on desktop. Both values are close to zero.
• The same label in the same position changes by market. One brand uses one label in the same buy box position on its English-language sites, with desktop open rates from 10.9% to 16.8%. Another brand uses one label on all its German-language sites, with desktop open rates from 12.9% to 16.6%.
• Near-identical labels differ with placement. “See size” reaches 18.8% on mobile directly below the gallery. “See bag size” reaches 10.6% in the buy box below the fold.

Open rate does not show what happens after the click. A clear label could bring fewer but better qualified opens. Neither audit measured this. To find out, run a label-only test on one high-traffic retailer, with the same design and position. Read open rate and Interacted CVR (the CVR of users who opened the Tangiblee experience).

Entry points

An entry point is any element on the page that opens the Tangiblee experience. A page can have several.

• Use one entry point for each zone of the page.
• Add another entry point only if it leads to a different result. For example, use one for size and one for capacity.
• Do not repeat the same CTA with the same label in many places. It adds noise, not reach.
• Tag each entry point separately, so you can measure how much each one adds to the open rate.

Out of stock pages

Keep the CTA on unavailable and out of stock pages. Shoppers still want to see the size and the look of a product that is not available. In the bags and luggage audit, 2 of the highest desktop open rates came from pages with unavailable items.

CTA reach

A CTA that does not load, or loads late, loses opens whatever its design. The audits found:

• CTAs that took 25 to 40 seconds to show.
• CTAs that showed only after a scroll.
• CTAs that were hidden from visitors who declined cookies or data sharing.

Before you change the CTA design, check that the CTA:

1. Shows quickly.
2. Shows without a user action.
3. Shows for every consent state that the site setup allows.

Test a CTA change

We recommend a B/B test for each large CTA change. In a B/B test, both groups see Tangiblee. The control group keeps the current CTA. The variation group gets the new CTA.

‍