Zur Navigation Zum Inhalt Kontakt Menu Principi Base Accessibilité Sistema di design Guidelines Deutsch Français Italiano English I nostri principi di design Soluzioni focalizzate sull’utente Riconoscibilità Inclusione Riduzione Olistico Autoesplicativo Orientamento all’attività Adeguatezza Portale della marca FFS Logo Orologio digitale Diritti di utilizzazione Colori die base Colori funzionali Colori Off Brand Icone Icone dell'orario Pittogrammi Informazioni sull’accessibilità Über diesen Guide Contatti Letture consigliate Product Owner User Research Interaction Design Visual Design Development Content Design Testing What is a design system? Designing Coding FAQ Aiuto Processo Contribution Contatto Introduzione Base Componenti Introduzione Base Componenti Introduzione Base Componenti Design Tokens Introduzione Releases Componenti Introduzione Base Informazioni Senso & scopo Community Assets Istruzioni Power-Apps Banner pubblicitari digitali SAP Icone delle app Visual Design

Tu progetti l’aspetto visivo del prodotto.

Struttura i contenuti

Accertati che le informazioni più importanti siano individuabili a prima vista. Utilizza una struttura semplice con gerarchie chiare e tieni conto dell’ordine di lettura delle informazioni. Verifica che la pagina sia perfettamente comprensibile anche con lo zoom al 200%.

In fase di test: utilizza la funzione di zoom nel tuo browser o sul tuo dispositivo mobile.

Riferimento: https://www.w3.org/TR/WCAG21/#resize-text

Assicurati che il contrasto sia sufficiente

Il contrasto del testo rispetto allo sfondo deve essere almeno di 4,5:1. Per l’interfaccia e altri elementi non testuali importanti ai fini della comprensione, il rapporto di contrasto deve essere di almeno 3:1, con particolare attenzione soprattutto se sullo sfondo compaiono immagini.

In fase di test: Color Contrast Analyzer https://developer.paciellogroup.com/resources/contrastanalyser

Riferimento 1: https://www.w3.org/TR/WCAG21/#contrast-minimum
Riferimento 2: https://www.w3.org/TR/WCAG21/#non-text-contrast

Assicurati che la dimensione dei caratteri sia sufficiente

Verifica che tutti i touch target abbiano una dimensione minima di 44 x 44 Pixel. Inoltre, utilizza caratteri ben leggibili e di dimensioni sufficienti. La regola generale prevede una dimensione minima di 14 Pixel.

In fase di test: effettua il controllo con i rispettivi developer tool.

Riferimento: https://www.w3.org/TR/WCAG21/#target-size

Rendi visibile il focus

Imposta il focus della tastiera in modo che le utenti e gli utenti sappiano sempre dove si trovano, in ogni situazione. Per esempio, vai sul sito ffs.ch e premi più volte il pulsante tab.

In fase di test: non utilizzare il mouse o collega una tastiera esterna al dispositivo mobile.

Riferimento: https://www.w3.org/TR/WCAG21/#focus-visible

Impressum Contatto Impostazioni dei cookie