Vai al contenuto principale
โ† ๐Ÿ“„ HTML & the platformยทModulo A7 ยท Lezione 13
CompitoQuick recap. Build a head + body that proves you know the 4 perf basics. Head: viewport meta + preconnect to https://cdn.example.com (crossorigin). Body: <img src='/below.jpg' alt='Below' loading='lazy' width='800' height='600'> and a <picture> with one <source srcset='/hero-2x.webp' media='(min-width: 800px)'> plus an <img src='/hero.webp' alt='Hero' width='1200' height='630'> fallback.

Recap: Performance & loading

50 XP5 min
Teoria

Quick recap โ€” Module A7

12 lessons on shaving milliseconds. The 4 head-tags that survive every audit:

  1. `<meta name="viewport">` โ€” mobile rendering at all (covered in A1, reused here).
  2. `<link rel="preconnect">` โ€” warms TCP+TLS to a third-party origin before the first request.
  3. `<img loading="lazy">` โ€” below-fold images don't block LCP.
  4. `<img srcset>` (or <picture>) โ€” phones don't download desktop-resolution hero images.

If any feels random, redo A7-01 / A7-03 / A7-06 / A7-09 then come back.

๐Ÿ”’

Iscriviti per iniziare a programmare

La teoria รจ aperta a tutti. Editor, anteprima e check si sbloccano con una prova gratuita di 7 giorni โ€” carta richiesta, annullabile in qualsiasi momento.

Iscriviti โ€” prova gratuita โ†’

Le prime 10 lezioni di ogni percorso sono gratuite. Nessuna carta richiesta.

โ† PrecedenteProssima lezione โ†’

Ricevi un consiglio Python o web al giorno โ€” via email

Breve, scritto a mano, niente spam. Disiscriviti in un clic.