Skip to main content
Projects Live

Root Landing

Root landing that explains the AI label scanner, the compatible active restrictions (celiac disease, diabetes, lactose intolerance), and access to the PWA.

By Valentina Ramírez · Updated: June 19, 2026

View live site

Summary

Root landing that explains the AI label scanner, the compatible active restrictions (celiac disease, diabetes, lactose intolerance), and access to the PWA.

Stack
AstroTailwind CSSSEOA11yGA4Performance
01

The problem

A multi-restriction diet app needs to communicate with precision who it is for and what it does before the user installs or tries it.

02

What I built

  1. 01

    Astro with static output: section components and continuous deployment to Netlify.

  2. 02

    Tailwind CSS for responsive design.

  3. 03

    Technical SEO: title, meta-description, Open Graph, Twitter Card, canonical, and schema markup.

  4. 04

    Accessibility (a11y): heading hierarchy, aria-labels, and WCAG AA contrast.

  5. 05

    Performance: static output, WebP images, and immutable cache on Netlify.

  6. 06

    Google Analytics (GA4): visit tracking and user behavior.

03

Results

  • Landing published in production with the main sections of the AI label scanner, the active dietary restrictions, and direct access to the PWA.

  • Technical SEO, WCAG AA accessibility, and GA4 analytics configured from launch.

04

Learnings

  • Communicating three distinct dietary restrictions in a single CTA without losing clarity requires prioritizing the action over the conditions list: 'photograph the product' converts better than listing the restrictions.

One click away

Your next idea deserves
code that can carry it.

I design and build complete products: from the backend to the interface your users love. With integrated AI and security by design.

Projects from COP 2,000,000 / USD 500 depending on scope (MVP from 3-6 weeks).

Limited availability, I respond within 24h.

Start my project See services