Metti alla prova quello che hai imparato
Esegui l’audit SEO su Martini Francesco e verifica title, meta e performance sulla tua homepage.
Avvia audit SEOHTML
Percorso HTML con heading, link e form accessibili: struttura chiara per motori di ricerca, screen reader e per chi aggiorna il sito senza markup caotico.
Lezioni
-
Benvenuto nel percorso
Qui costruisci pagine comprensibili a browser, motori e tecnologie assistive con markup semantico.
Inizia dalla gerarchia degli heading: è la base di accessibilità e SEO.
Inizia - Gerarchia degli heading Gerarchia heading pratica: un H1 per pagina e H2–H3 sequenziali che organizzano il testo per motori di ricerca, screen reader e chi scorre solo i titoli.
- Elementi semantici Tag semantici al posto dei div: main, nav, header e article creano una mappa chiara del contenuto e rafforzano accessibilità e SEO tecnica del sito.
- Navigazione e menu nav, liste di link e ordine logico per tastiera e screen reader: guida operativa per navigazione e menu — pratica su navigazione e menu per il tuo progetto web.
- Liste e tabelle ul, ol, table, th e caption per dati tabellari veri: guida operativa per liste e tabelle: esempi e passi da applicare subito sul sito che pubblichi.
- Testo dei link Anchor descrittivi al posto di «clicca qui»: testi di link che spiegano la destinazione per tastiera, screen reader e risultati di ricerca più chiari.
- Link che aprono nuova scheda target, rel e avvisi per non disorientare chi usa tastiera: guida operativa per link che aprono nuova scheda sul web, con errori comuni da evitare.
- Immagini responsive e alt picture, srcset, width/height e testo alternativo corretto: guida operativa per immagini responsive e alt sul web, con errori comuni da evitare.
- Label e campi form Label HTML collegate agli input con for e id: ogni campo del form diventa comprensibile a screen reader e clic su testo, così meno errori in compilazione.
- Tipi di input HTML email, tel, number, date e autocomplete per meno errori utente: guida operativa per tipi di input html — pratica su tipi di input html per il tuo progetto web.
- Errori e validazione accessibile Messaggi collegati ai campi con aria-describedby e aria-invalid: guida operativa per errori e validazione accessibile sul web, con errori comuni da evitare.
- Video e audio nel markup track, controlli nativi e alternative testuali: guida operativa per video e audio nel markup: esempi e passi da applicare subito sul sito che pubblichi.
- Lingua e metadati documento lang, charset, viewport e title per ogni pagina: guida operativa per lingua e metadati documento: esempi e passi da applicare subito sul sito che pubblichi.
- Tabelle accessibili scope, header e layout che non si appoggiano solo al colore: guida operativa per tabelle accessibili: esempi e passi da applicare subito sul sito che pubblichi.
- Validare l’HTML Errori comuni, parser e controlli prima della pubblicazione: guida operativa per validare l’html: esempi e passi da applicare subito sul sito che pubblichi.
- Collegare CSS e JavaScript link, script defer/async e ordine di caricamento sicuro: guida operativa per collegare css e javascript sul web, con errori comuni da evitare.