Alerela Cosmetics: A Beauty E-Commerce Site Built for Speed, SEO, and Conversion

Alerela Cosmetics is a clean-beauty brand built around a single hero product line: 30 ultra-pigmented, transfer-resistant liquid lip stains with 8+ hour wear, hyaluronic acid hydration, and 100% vegan, gluten-free, paraben-free formulas. The brand's positioning is unambiguous: "Made to Last. Made to Be Noticed." The website's job is to convert browsers into shoppers and shoppers into repeat customers.

The brief

Beauty e-commerce is brutal. Shoppers comparison-shop across Sephora, Ulta, DTC sites, Amazon, and TikTok Shop. They land on a product page, scroll through swatches, check ingredients, scan reviews, and decide in seconds. The site has to look premium, load instantly, and make shade selection effortless on a phone — or the sale goes to a competitor.

The design — product-first, monochromatic, premium

The visual direction leans into product photography. High-resolution swatch imagery, minimalist typography, generous whitespace, monochromatic palette so the actual lip color pops in every frame. Categories — Nudes, Pinks, Berries, Reds, Darks — give shoppers a clear browsing path. No clutter, no animated banners, no "spin the wheel for 10% off" popups. Premium beauty brands earn trust by what they don't do as much as what they do.

Critical UX call: shade browsing works as the primary navigation. Visitors can filter by category, scroll a unified grid, or hit specific bestseller / new-arrival collections. Product cards show the swatch first, then the name and price. Adding to cart is one tap.

How do you keep a photo-heavy beauty store fast?

Serve it from the edge and size every photo for the screen that shows it, because beauty sites are notoriously heavy with photography. Zorva Edge hosting serves the site from the global edge with sub-second mobile loads despite the visual density. Every product photo is responsively sized per breakpoint, served as next-gen AVIF/WebP, and lazy-loaded as the user scrolls. Our goal on PageSpeed Insights mobile is always 95+ — well above the 50-65 typical of Shopify themes loaded with apps.

Why this matters: every additional second of load time drops conversion by roughly 7%. On a 30-shade catalog where the hero shot is the entire pitch, a fast site directly converts to revenue.

SEO — built for beauty shopper queries

Beauty SEO has its own keyword landscape. The site's foundation:

• Product schema per shade with name, brand, color, price, availability, AggregateRating — Google can show shopping rich results
• Organization + Brand schema with logo, sameAs links to Instagram and TikTok
• FAQPage schema covering ingredient questions, wear time, vegan certification, fair trade sourcing
• Page titles optimized for "liquid lip stain", "long-lasting lip color", "transfer-resistant lipstick", "vegan liquid lipstick", "clean beauty lip stain"
• Per-shade pages targeting specific shade-name searches (people Google "berry liquid lipstick" or "best nude lip stain")
• Collection pages targeting category-level searches (Nudes, Reds, Berries, etc.)
• Long-form content on the brand story, ingredients, and application — Google rewards depth on commercial queries

GEO, AIO, AEO — beauty in the AI search era

Beauty shoppers ask AI engines for product recommendations as often as they Google. The site is structured to be cited:

• GEO (Generative Engine Optimization): citation-friendly factual content (8-hour wear, hyaluronic acid, vegan certification), llms.txt summary, AI crawlers welcomed in robots.txt — so when someone asks ChatGPT "best vegan liquid lipstick" or "long-lasting lip color that doesn't dry out," Alerela shows up in the cited sources.
• AIO (AI Overview Optimization): FAQ schema and direct-answer paragraphs so Google's AI Overview pulls Alerela into beauty-product summary boxes.
• AEO (Answer Engine Optimization): SpeakableSpecification on key product attributes so voice queries like "how long does Alerela lip stain last" get a direct answer.

How much beauty shopping happens on a phone?

Phones drive 75%+ of beauty e-commerce traffic. The mobile design priorities:

• Single-column shade grid with native swipe gestures, lazy-loaded as the user scrolls
• Sticky "Add to cart" button as the user scrolls product detail pages
• Swatch images optimized for vertical viewport (no awkward letterboxing)
• Payment integrations sized for thumb input — Apple Pay, Google Pay, Shop Pay buttons large and prominent
• Newsletter signup tucked into the footer, not a popup interrupting browsing

Conversion engineering

Every product page is a small landing page in itself. Hero swatch image, product name, price, key benefits in a tight bullet list (8+ hour wear, vegan, hyaluronic acid hydrating), shade selector with live preview, add-to-cart, and below-the-fold ingredient details for shoppers who research before buying. Newsletter signup converts at the strongest moment — right after the user explores a shade — with a 15% first-purchase incentive that runs through the email tool, not a third-party popup app.

What do clean beauty shoppers check before they buy?

Clean beauty shoppers verify ingredients before buying. The site surfaces every certification clearly: vegan certified, gluten-free, paraben-free, fair-trade sourced botanicals, ethically sourced ingredients. These appear on product cards, collection pages, and a dedicated "Our Standards" page that serves both customers and Google's E-E-A-T (Experience, Expertise, Authoritativeness, Trust) ranking signals.

What's running underneath

Custom Next.js commerce app on Zorva Edge hosting. Stripe for payments. Email integration for the welcome series and post-purchase flows.

Google Analytics, Search Console, and the store's traffic page

On the Alerela store, GA4 records the e-commerce conversion events and Google Search Console holds the verified domain and the submitted sitemap, both from launch day. Each visit is attributed to the source that sent it, and the team maintains none of it.

Alerela's team reads the store's numbers on a private page at /traffic on the site itself. Page views are logged at the edge, before any tracking script loads, so shoppers with ad blockers are counted too. Next to them sit the channels that bring visitors who get in touch, the most-viewed pages, the devices people shop on and what they searched on Google to arrive. One password, no GA4 login.

FAQ

How do shoppers pick a shade on the Alerela site?

Shade browsing is the main way around the store. Shoppers filter by Nudes, Pinks, Berries, Reds or Darks, scroll a single grid, or go straight to bestsellers and new arrivals, and each card puts the swatch ahead of the name and price.

Which payment options does the Alerela store take?

Payments run through Stripe on a custom Next.js commerce app. On a phone, the Apple Pay, Google Pay and Shop Pay buttons are big enough to hit with a thumb.

Does Alerela push a discount pop-up on new visitors?

No. The 15% first-purchase offer comes from the email tool after a shopper has looked at a shade, and on mobile the signup lives in the footer, out of the way of browsing.

What schema gets lip products into Google's shopping results?

Product markup on every shade, carrying its name, brand, color, price and availability, is what makes shopping rich results possible. Alerela also has Organization and Brand markup that ties the site to its Instagram and TikTok accounts.

Which searches is a lip stain brand's site built for?

The phrases shoppers type, like liquid lip stain, long-lasting lip color, transfer-resistant lipstick and vegan liquid lipstick. Every shade has a page for people searching by shade name, and every collection page targets its color family.

Want similar for your e-commerce business?

We build custom small-business e-commerce websites priced to your project. Product-forward design, edge hosting performance, full SEO + AI-search foundations baked in. See how your store scores on the free 103-check scan, then ask us to quote the build.

Visit the live shop: alerela.com