Flessibilità dell’orientamento dei contenuti

Scopo #

Lo scopo principale di questo test di accessibilità manuale è valutare meticolosamente se il contenuto della piattaforma ne limita la visualizzazione e il funzionamento a un unico orientamento del display (verticale o orizzontale). Questo test mira a confermare la conformità al Criterio di Successo 1.3.4 WCAG 2.2 Orientamento (AA), garantendo che gli utenti possano accedere e interagire con il contenuto nell’orientamento del dispositivo preferito. Ciò è particolarmente importante per le persone che utilizzano dispositivi montati in posizione fissa o per coloro che hanno problemi di destrezza che rendono difficile o impossibile la rotazione del dispositivo, prevenendo il clipping, la distorsione o la perdita di funzionalità del contenuto.

Criteri WCAG coperti #

Questo test affronta specificamente i seguenti criteri di successo WCAG 2.2 relativi all’accessibilità dei media:

• 1.3.4 Orientamento – A

Il criterio di successo WCAG 2.2 1.3.4 Orientamento (Livello AA) afferma: “Il contenuto non limita la sua visualizzazione e il suo funzionamento a un singolo orientamento di visualizzazione, ad esempio verticale o orizzontale, a meno che non sia essenziale un orientamento di visualizzazione specifico.”
Questo criterio è rilevante e viene testato nei seguenti modi:

Flessibilità di orientamento:

Verificheremo sistematicamente la capacità dei contenuti della piattaforma di adattarsi correttamente al passaggio dell’orientamento del dispositivo da verticale a orizzontale e viceversa. Ciò include la verifica che il layout, il testo, le immagini e gli elementi interattivi si adattino correttamente senza causare perdita di contenuto, distorsioni o compromissioni funzionali.

Giustificazione dell’orientamento essenziale:

Nei casi in cui il contenuto limita l’orientamento, valuteremo attentamente se tale restrizione sia realmente “essenziale”. Un orientamento è considerato essenziale solo se la funzionalità del contenuto richiede intrinsecamente un orientamento specifico (ad esempio, un’applicazione per pianoforte che richiede un orientamento orizzontale per visualizzare tutti i tasti, o un’applicazione bancaria in cui una visualizzazione specifica è fondamentale per la sicurezza e non può essere adattata). Semplici preferenze estetiche o praticità di sviluppo non sono valide giustificazioni per un orientamento essenziale.

Leggibilità e usabilità dei contenuti:

Faremo in modo che, quando cambia l’orientamento, il testo rimanga leggibile, gli elementi interattivi siano ancora utilizzabili e tutte le informazioni essenziali restino visibili senza richiedere uno scorrimento eccessivo o non necessario.

Ambiente di prova #

Questo test si concentra principalmente sui dispositivi mobili e tablet, dove la modifica dell’orientamento dello schermo è un’interazione comune da parte dell’utente.

Desktop #

• Sistemi operativi: Windows (ultime due versioni), macOS (ultime due versioni).
• Browser: ultime versioni stabili di Chrome, Firefox, Edge, Safari.
• Rilevanza: sebbene i browser desktop non dispongano di un “orientamento” in senso mobile, i principi del responsive design garantiscono che i contenuti si adattino alle diverse larghezze delle finestre, il che equivale a un orientamento flessibile su desktop. Verificheremo l’adattabilità dei contenuti al ridimensionamento delle finestre.

Cellulari e tablet #

• Sistemi operativi: iOS (ultime due versioni), Android (ultime due versioni).
• Browser: (Safari su iOS, Chrome su Android) e altri browser mobili diffusi.
• Metodi di input:
  • Touchscreen (per la navigazione generale e la rotazione del dispositivo).
• Preparazione: assicurarsi che la funzionalità di rotazione automatica sia abilitata sui dispositivi di prova.
• Orientamento: modalità verticale e orizzontale.

Preparazione al test #

Prima di iniziare il test manuale, assicurarsi di aver completato i seguenti passaggi:

1. Identificare tutte le aree di contenuto:
   Elencare sistematicamente tutte le pagine, i componenti e gli elementi interattivi specifici all’interno della piattaforma che potrebbero essere interessati dalle modifiche all’orientamento dello schermo. Tra questi:
   • Pagine di contenuto standard (articoli, elenchi di prodotti).
   • Moduli e campi di input.
   • Lettori video e gallerie multimediali.
   • Mappe e diagrammi interattivi.
   • Giochi o applicazioni specifiche (ad esempio, app di disegno, calcolatrici).
   • Finestre di dialogo modali, pop-up e sovrapposizioni.
   • Layout complessi o widget personalizzati.
2. Abilita rotazione automatica:
   Su tutti i dispositivi mobili e tablet di prova, assicurarsi che l’impostazione “rotazione automatica” o “blocco orientamento” sia disabilitata/sbloccata per consentire allo schermo di ruotare liberamente.
3. Stabilire la funzionalità di base:
   Interagisci brevemente con ciascuna area di contenuto identificata nel suo orientamento predefinito per comprenderne il comportamento normale.
4. Familiarizzare con WCAG 1.3.4:
   Rileggere e comprendere le sfumature del Criterio di successo 1.3.4, in particolare la definizione di orientamento “essenziale”.

Processo di test passo dopo passo #

Eseguire i seguenti passaggi per ciascuna area di contenuto identificata, sia su dispositivi mobili che tablet. Documentare meticolosamente le osservazioni. Per i desktop, concentrarsi sul ridimensionamento delle finestre.

PASSO 1 – Procedura generale per la flessibilità dell’orientamento #

Carica contenuto nell’orientamento predefinito: #

• Vai alla pagina di destinazione o all’area dei contenuti sul dispositivo mobile/tablet.
• Osservane l’aspetto e la funzionalità nell’orientamento corrente (predefinito) del dispositivo (ad esempio, verticale per uno smartphone, orizzontale per un tablet).

Ruotare il dispositivo e osservare l’adattamento: #

• Ruotare fisicamente il dispositivo di prova nell’orientamento opposto (ad esempio, da verticale a orizzontale o viceversa).
• Lascia che il contenuto si riorienti.
• Caso di prova:
  il contenuto si riorienta automaticamente e si adatta al nuovo orientamento dello schermo?
• Caso di prova:
  tutti i contenuti essenziali (testo, immagini, elementi interattivi) sono completamente visibili dopo la rotazione? Ci sono elementi tagliati, nascosti o che richiedono uno scorrimento orizzontale/verticale eccessivo?
• Caso di prova:
  il layout si adatta correttamente? Gli elementi si sovrappongono, risultano distorti o vengono visualizzati in modo errato?
• Caso di test:
  tutti gli elementi interattivi (pulsanti, link, campi dei moduli) sono ancora pienamente funzionali e accessibili tramite tocco? Le dimensioni dei target touch sono ancora adeguate?
• Caso di prova:
  il testo è ancora leggibile e formattato correttamente (ad esempio, senza linee spezzate, testo sovrapposto ad altri elementi)?
• Caso di prova:
  le immagini e i video vengono ridimensionati in modo appropriato senza essere tagliati o allungati/compressi in modo sproporzionato?
• Caso di prova (specifico della funzionalità):
  per i componenti interattivi come mappe, giochi o moduli, la funzionalità rimane completamente utilizzabile nel nuovo orientamento? (ad esempio, i controlli della mappa sono ancora accessibili, i controlli del gioco sono ancora visibili e utilizzabili).

Prova entrambi gli orientamenti (carico iniziale): #

• Chiudere il browser o uscire dalla pagina.
• Ruotare il dispositivo nell’orientamento non predefinito prima di caricare la pagina.
• Carica la stessa pagina/contenuto.
• Caso di prova:
  il contenuto viene caricato correttamente in questo orientamento, comportandosi come previsto e senza problemi durante la rotazione a metà sessione?

Ripetere per tutte le aree di contenuto identificate: #

Applicare sistematicamente i passaggi da 1 a 3 a tutte le pagine e i componenti elencati nella fase di “Preparazione al test”.

PASSO 2 – Esame dell’orientamento “essenziale” (se applicabile) #

Identificare i blocchi di orientamento: #

• Se un contenuto limita la sua visualizzazione a un singolo orientamento (ad esempio, non ruota quando ruota il dispositivo), identifica questo contenuto.

Valutare l’essenzialità: #

• Caso di prova:
  la funzionalità di questo contenuto richiede intrinsecamente un orientamento specifico? (ad esempio, si tratta di un’interfaccia per uno strumento musicale, di un visualizzatore di immagini mediche specializzato o di un’esperienza di realtà aumentata specifica che in realtà non potrebbe funzionare altrimenti?).
• Caso di prova:
  esiste una chiara ragione programmatica per cui un orientamento alternativo non è possibile o invaliderebbe l’attività? (ad esempio, un gioco in cui l’intero spazio dello schermo è necessario per la plancia di gioco e il ridimensionamento lo renderebbe ingiocabile).
• Caso di prova:
  l’utente viene informato del requisito essenziale di orientamento (ad esempio, un messaggio che invita l’utente a ruotare il dispositivo)?

PASSO 3 – Controllo specifico del desktop (ridimensionamento delle finestre) #

Ridimensiona la finestra del browser: #

• Sul desktop, carica la pagina in una finestra del browser a schermo intero.
• Ridimensionare gradualmente la finestra del browser dalla larghezza massima a una larghezza ridotta, simile a quella dei dispositivi mobili, e poi tornare indietro.
• Caso di prova:
  il contenuto risponde correttamente al ridimensionamento della finestra?
• Caso di prova:
  il contenuto si ridistribuisce correttamente nei diversi punti di interruzione? (Ciò rispecchia in una certa misura i cambiamenti di orientamento dei dispositivi mobili).
• Caso di prova:
  tutto il contenuto è visibile e utilizzabile in tutte le larghezze delle finestre senza uno scorrimento orizzontale eccessivo?

Identificazione dei problemi #

Durante il processo di test, identificare e documentare eventuali deviazioni dal comportamento previsto in base alle WCAG 1.3.4. Esempi di problemi includono:

• Blocco orientamento forzato:
  il contenuto non riesce a riorientarsi quando il dispositivo viene ruotato, bloccando l’utente in una singola visualizzazione verticale o orizzontale.
• Ritaglio/troncamento del contenuto:
  parti del contenuto vengono nascoste o troncate quando cambia l’orientamento, rendendolo inaccessibile.
• Layout/elementi distorti:
  testo, immagini o elementi del layout risultano allungati, schiacciati o disallineati dopo la modifica dell’orientamento.
• Funzionalità inutilizzabile:
  gli elementi interattivi diventano irraggiungibili, troppo piccoli per essere toccati o comunque non funzionali in un determinato orientamento.
• Scorrimento eccessivo:
  il contenuto richiede uno scorrimento orizzontale o verticale significativo e non necessario dopo il cambio di orientamento, il che indica un layout poco reattivo.
• Problemi di leggibilità del testo:
  le dimensioni del testo o le interruzioni di riga non vengono gestite correttamente, il che determina un testo illeggibile o formattato in modo non corretto.
• Limitazione dell’orientamento ingiustificata:
  il contenuto è bloccato su un singolo orientamento senza una forte ragione funzionale che rientri nell’eccezione “essenziale”.
• Sovrapposizione visiva:
  gli elementi si sovrappongono dopo il cambio di orientamento, rendendo difficile la lettura o l’interazione con entrambi gli elementi.
• Perdita di contesto/informazioni:
  la rotazione del dispositivo provoca una perdita della vista corrente, dei progressi o del contesto che non viene ripristinata con il riorientamento.

Classificazione di gravità #

Assegnare un livello di gravità a ciascun problema identificato in base al suo impatto sull’accessibilità dell’utente:

• Critico:
  impedisce agli utenti di accedere o utilizzare le funzionalità principali in un particolare orientamento, soprattutto se l’orientamento è comunemente utilizzato o è l’unico possibile per l’utente. Una violazione diretta del criterio 1.3.4 di Livello AA senza una valida eccezione “essenziale” (ad esempio, l’intera applicazione diventa inutilizzabile quando ruotata, i dati critici vengono nascosti).
• Alto:
  impedisce in modo significativo agli utenti di completare le attività o di accedere a informazioni importanti in un particolare orientamento, causando notevole frustrazione o richiedendo soluzioni alternative difficili (ad esempio, ampie sezioni di contenuto vengono tagliate, la navigazione principale scompare, i moduli diventano incompilabili).
• Medio:
  causa un moderato disagio o frustrazione agli utenti. Il contenuto potrebbe essere parzialmente visibile o funzionale, ma con significativi problemi di layout o che richieda uno scorrimento difficoltoso (ad esempio, piccoli tagli di contenuto, testo leggermente sovrapposto, ma le funzionalità principali sono comunque raggiungibili con un po’ di impegno).
• Basso:
  piccoli problemi estetici o lievi inconvenienti che non ostacolano in modo significativo l’accesso o la funzionalità (ad esempio, piccoli problemi di allineamento, piccole incongruenze visive).

Nota finale #

Garantire la flessibilità nell’orientamento dei contenuti è fondamentale per offrire un’esperienza utente inclusiva e adattabile, soprattutto in un mondo dominato dall’uso di dispositivi mobili e tablet. Questo test manuale consente ai team di identificare e correggere i casi in cui i contenuti limitano arbitrariamente l’orientamento, rimuovendo così le barriere per gli utenti che dipendono da questa flessibilità. Dando priorità alla progettazione flessibile, le piattaforme possono soddisfare una gamma più ampia di esigenze e preferenze degli utenti.