Skincare website design: where buyers drop off

A shopper with dry or sensitive skin is not browsing for a mood. They want to know whether a moisturizer has fragrance, essential oils or a preservative they react to, and they want that answer before the photo of the jar has loaded. Many skincare pages keep the full ingredient list in a panel below the product photos, labeled with a short phrase such as show details. On a phone the panel can sit beneath several sections of text. The shopper taps, sees nothing change, taps again, and decides the product does not publish its ingredients, then leaves.

• Is the full ingredient list visible on the product page without opening a panel?
• Does the price show with the same contrast as the product name, on a phone in daylight?
• Can a shopper reach a product in three taps from the homepage, without finishing a quiz?
• Is a sample or trial size offered as its own choice, not as a hidden extra at checkout?

Skin-type quizzes can help a shopper who does not know their skin. They become a barrier when they must be finished before any product appears, or when a shopper with a clear need is asked five questions about routine and goals first. A person searching for a fragrance free moisturizer wants the moisturizer list. They do not want to explain their concerns before they see a single jar. Test the homepage by asking for a product type directly, with the quiz skipped, and count the steps to the first product. If the count depends on answering the quiz, the quiz has become the store.

Keep the quiz as a helper beside the product list, with a plain link to the full range. Let the shopper filter by need, such as dry, sensitive or fragrance free, once the list has loaded, so the search term they arrived with works on the first screen. A visitor who reaches a product quickly has a real chance to read its ingredients, and that is the question they came with.

Ingredients are the reason a sensitive-skin buyer reaches the product page at all, and many skincare sites put them in an accordion. An accordion is tidy on a laptop. On a phone it needs a tap on a small label, and a shopper who scrolls past that label may never see it. Some pages also split the list across a tab and a PDF, which puts the full list one step further away. Check each product page for the word the shopper would search, such as fragrance or essential oils, and see whether it appears without opening anything.

A short paragraph of plain text above the panel, saying what is in the product and what is left out, saves the shopper that search. Keep the full list in the panel as well, for the buyer who wants the INCI order. The answer to the first question should not depend on a tap. The test records whether the visitor found the list, and at which tap they gave up.

Skincare pages often lead with a large photo of the jar, a soft background and a line of type set in pale grey. That reads as calm on a large screen. On a phone in a bright room, a pale grey price over a light photo is hard to read, and a sample size printed in the same grey is easy to miss. A shopper who cannot find the price does not know whether the jar is within reach, so they leave for a store that puts the number in plain black. The test does not judge how the page looks, but it can show whether the price and the sample offer are reached, read and tapped.

Skincare brands run seasonal launches, new photo shoots and new quizzes, and each one can push the ingredient text lower or change the contrast of the price. Run a sensitive-skin shopper through the product page after every launch, and check that the full list and the price still show on a phone. A shop behind a login needs a test account that you give the run, so the run can reach the product pages.