Design, UX e accessibilità

Comprendere design, UX e accessibilità

Osserva un compito concreto oltre all’aspetto. Collega ordine di lettura, nomi dei comandi, stati ed errori. Testo ampliato e tastiera rivelano ostacoli che una maquette statica non mostra.

81 concetti con definizioni e consigli pratici.

Cerca nell’intero glossario

Illustrazione generata con IA — Comprendere design, UX e accessibilità — Illustrazione generata con IA

Un percorso di lettura

1. Orientare la lettura

Gerarchia visiva
organizzazione grafica che indica ciò che dovrebbe essere visto e compreso prima attraverso dimensioni, contrasto, spazio e posizione.
Architettura dell'informazione
Organizzazione di contenuti, categorie, etichette e percorsi di navigazione in modo che le informazioni siano facili da trovare e comprendere.
ordine di lettura
Sequenza in cui si incontra il contenuto della pagina o del documento, anche tramite tastiera o tecnologia assistiva.

2. Descrivere le interazioni

Nome accessibile
Nome esposto a tecnologie assistive per identificare un pulsante, un campo, un collegamento o un altro componente interattivo.
Stato componente
condizione visibile di un controllo, come messa a fuoco, errore, caricamento o indisponibilità.
Messaggio di errore sul campo
Messaggio associato a un campo modulo che spiega il problema e la correzione prevista.

3. Osservare l’uso

Usabilità
Facilità con cui gli utenti possono comprendere un'interfaccia, completare le attività ed evitare o recuperare da errori.
Design reattivo
Progettare adattare layout, media e interazioni a diverse dimensioni e condizioni dello schermo.
Cumulative Layout Shift (CLS)
Metrica di stabilità visiva basata sulla maggiore sequenza di spostamenti inattesi del layout.

Distinzioni utili

Testo alternativo / Nome accessibile

Il testo alternativo comunica la funzione dell’immagine; il nome accessibile identifica un elemento. Un’immagine usata come comando deve spiegare l’azione.

Wireframe / Mockup

Un wireframe esplora struttura; una maquette dettaglia presentazione. Nessuno prova il funzionamento del percorso nel browser.

Esempio didattico

Usare i concetti per decidere

Situazione

Un errore è visibile, ma il campo è difficile da ritrovare con tastiera.

Prima di decidere

Controlla nome, associazione del messaggio e ordine. Cambiare solo colore non spiega come correggere.

Un controllo concreto

Ripeti con un valore non valido senza aiuto di chi ha progettato la schermata.

Tutti i concetti del tema

I link aprono la definizione completa sulla pagina alfabetica. Sigle e sinonimi restano ricercabili nel glossario generale.

Documenti di riferimento primari

Questi documenti spiegano concetti tecnici. Percorsi ed esempi sono metodi editoriali da adattare al progetto.

Vai alla pratica