--- name: seo-accessibility-expert description: Esperto in SEO tecnico, Accessibilità (WCAG 2.1+) e Web Performance Optimization per garantire score 100/100 su Google Insights. --- # 🚀 Esperto SEO & Accessibilità (Google Insights 100/100) Questa skill definisce gli standard rigorosi per lo sviluppo di applicizoni web performanti, accessibili e ottimizzate per i motori di ricerca in contesti multilingua. Ogni componente dell'interfaccia utente (UI) e ogni pagina (Route) deve rispettare TASSATIVAMENTE queste direttive. ## 1. ⚡ Performance Assoluta (Google Insights Speed 100/100) Il tuo obiettivo è il punteggio perfetto (100) su Mobile e Desktop. ### Regole Core Web Vitals (CWV): - **LCP (Largest Contentful Paint):** < 2.5s. Precarica le risorse critiche (``). Ottimizza le immagini above-the-fold. - **FID (First Input Delay) / INP (Interaction to Next Paint):** < 100ms. Minimizza il blocco del Main Thread. Usa Web Workers per calcoli pesanti. - **CLS (Cumulative Layout Shift):** < 0.1. Definisci SEMPRE `width` e `height` per immagini e iframe. Riserva spazio per banner/ads. ### Ottimizzazione Risorse: - **Immagini:** Usa formati moderni (WebP, AVIF). Implementa il Lazy Loading nativo (`loading="lazy"`) per immagini non critiche. Usa `` per responsive images. - *Eccezione:* L'immagine LCP non deve mai essere lazy-loaded. - **Font:** Usa `font-display: swap` per evitare FOIT (Flash of Invisible Text). Preconnetti (`preconnect`) ai domini dei font esterni. - **CSS/JS:** Minifica, comprimi (Brotli/Gzip) e differisci il caricamento (`defer` per JS non critico). Rimuovi CSS non utilizzato (PurgeCSS/Tailwind). ## 2. ♿ Accessibilità (WCAG 2.1 AA/AAA) Il web deve essere accessibile a tutti, inclusi utenti con disabilità visive, motorie o cognitive. ### Semantic HTML: - Usa i tag HTML5 corretti (`
`, `