SiteLens: UX/SEO Visual Audit & Multi-Device SaaS

Gallery

About

Executive SummarySiteLens is a production-ready visual audit overlay tool and multi-device simulator designed for web agencies, developers, and UX designers. Instead of generating complex and boring reports, SiteLens highlights SEO, UX, accessibility, and performance issues directly on the live webpage. It works both as an injected JS script and a fully functional Chrome/Edge browser extension.Key Technical ComponentsMulti-Device Simulation Frame: Features responsive testing modes including Desktop, Mobile, and Split-Screen View with fully synchronized overlay engines.Live Overlay Engine: Scans the active DOM to automatically target images, headings, and input fields, drawing dynamic bounding boxes (Red for Critical, Orange for Warnings) based on severity.Audit Engine (Top 20 Rules): Evaluates real-time criteria across SEO (H1 structure, meta descriptions, image ALTs), UX/A11y (contrast ratios, button sizes <44px, text size), and simplified performance metrics.Premium Extension Options UI: Fully integrated options page with premium styling (mesh gradients, interactive states) allowing end-users to input, store, and asynchronously validate API license keys via safe synchronization.Security & Licensing SystemThe tool contains an active license validation system. The Chrome extension fetches asynchronous network validations and dynamically passes data attributes to secure script injection points, enabling instant Pro feature unlocks without needing a massive infrastructure backend.What's Included in the SaleFull source code ownership (Vite bundle, React client architecture, Chrome Extension Manifest V3 core files).Complete technical documentation and architecture blueprints.Production-ready asset bundle including standard/grayscale active icon variants.