Disciplina: Web Design / ABPR19

Obiettivi formativi:
Il corso di Web Design è progettato per fornire agli studenti una solida formazione nell’ambito della progettazione e sviluppo di siti web moderni e coinvolgenti. Gli studenti impareranno a utilizzare strumenti e tecnologie di design web avanzate per creare siti web attraenti, responsive e facilmente navigabili. Durante il corso, saranno affrontate tematiche legate all’esperienza utente (UX),
all’interazione (UI) e all’ottimizzazione per i motori di ricerca (SEO).
• Layout e design system: componenti riusabili, pattern e style guide.
• Accessibilità: principi WCAG 2.2 e adeguamento all’European Accessibility Act 2025; progettazione inclusiva by-design.
• Performance: ottimizzazione per Core Web Vitals (INP, LCP, CLS), immagini e font moderni.
• UX/UI e content design: wireframe, prototipi, microcopy, architettura dell’informazione.
• Responsive & mobile-first: fluid layout, container queries, dark mode e riduzione
animazioni.
• Laboratorio WordPress: realizzazione di un sito completo con block theme (Full Site Editing), pattern e template parts, senza uso di JavaScript custom.
Al termine, lo studente è in grado di: impostare un progetto web end-to-end, produrre deliverable progettuali (brief, mappa dei contenuti, wireframe/prototipo, UI kit), realizzare e pubblicare un sito WordPress accessibile, performante e SEO-ready.

Contenuti del corso:
Introduzione al web design
Panorama 2025, standard W3C, principi di progettazione visiva, design system e pattern, workflow e strumenti (Figma, Adobe), etica e sostenibilità del digitale.
Architettura dell’informazione & content strategy
Raccolta requisiti, personas e scenari d’uso, tassonomie e nomenclature, mappe dei contenuti e navigazione, microcopy e linee guida redazionali.
Progettazione user-centered: UX & UI
Wireframe e prototipi low/high-fi, linee guida di usabilità, UI kit/style guide, design tokens, principi di coerenza visiva e gerarchia informativa.
Linguaggi e standard del web
HTML semantico, CSS moderno, responsive images (srcset/sizes).
Responsive, progressive enhancement & accessibilità
Approccio mobile-first, layout fluidi, dark mode e riduzione animazioni; WCAG 2.2, design inclusivo, validazione W3C e basi di audit accessibilità.
Tipografia, colore e asset grafici per il web
Variable fonts e scale tipografiche, contrasto e sistemi colore, SVG e icone, formati immagine moderni (WebP/AVIF) e ottimizzazione.
Performance e qualità tecnica
Core Web Vitals (INP, LCP, CLS), ottimizzazione di font/immagini/CSS, caching di base, qualità del codice e controlli pre-rilascio.
SEO on-page e dati strutturati (base)
Struttura URL, titoli e meta, headings e linking strategy, contenuti evergreen e introduzione ai dati strutturati (Schema.org).
Laboratorio WordPress – Full Site Editing (no-code)
Installazione e setup, block theme, pattern, template parts e Style Book; gestione contenuti, Query Loop; CPT/tassonomie e campi personalizzati via plugin; moduli, privacy/GDPR e cookie banner, sicurezza essenziale.
Testing, iterazione e consegna
Test cross-device, checklist di accessibilità/performance/SEO, correzioni iterative, preparazione al deploy e alla presentazione finale.

Modalità di verifica:
Esame pratico–orale sul progetto sviluppato (sito WordPress completo, accessibile e responsive) e discussione dei passaggi progettuali.
Consegne obbligatorie (caricate in un’unica cartella):
• Brief di progetto (obiettivi, target, requisiti).
• Mappa del sito e tassonomie.
• Wireframe/prototipo + UI kit/style guide.
• Sito WordPress funzionante.

Testi di approfondimento consigliati:
Libri
• Jon Duckett, HTML & CSS. Progettare e costruire siti web, Apogeo, 2014.
• Lea Verou, CSS Secrets, Apogeo, 2016.
• Jenifer Tidwell, Progettare Interfacce. Modelli per interfacce efficaci (III ed.), Pearson, 2021.
• Steve Krug, Don’t Make Me Think – Revisited. L’usabilità nella progettazione web e mobile, Apogeo, 2014.
• Luca Rosati, Architettura dell’informazione (II ed.), Apogeo, 2017.
• Francesco De Nobili, SEO Google. Guida avanzata al web marketing, Hoepli, 2023.
• Jake Knapp, Sprint. Risolvere problemi e testare nuove idee in soli cinque giorni, Rizzoli Etas, 2017.
• Aarron Walter, Progettare per le emozioni, Apogeo, 2013.
Risorse istituzionali online (aggiornate)
• AGID & Designers Italia – Linee guida di design per i servizi digitali + risorse su
accessibilità (WCAG 2.2) e adeguamento EAA 2025.
• WordPress – Documentazione su block editor/Full Site Editing
(it.wordpress.org/documentation).