Utilizza Axe Expert con la tecnologia assistiva

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Not for use with personal data
warning

L'estensione Axe Expert è stata ufficialmente ritirata. Per saperne di più, consulta la pagina axe Expert Replacement . Queste pagine verranno rimosse nel luglio 2024. Per qualsiasi domanda o dubbio, inviare un'e-mail a helpdesk@deque.com.

Deque Systems, Inc. considera NVDA/Windows la piattaforma principale per gli utenti di lettori di schermo dell'estensione axe Expert. Consigliamo di utilizzare NVDA o JAWS su Windows e VoiceOver su Mac.

Prima di iniziare:

Consultare axe Expert Extension for Chrome VPAT.pdf per esaminare il rapporto di conformità volontaria di Deque sull'accessibilità del prodotto per axe Expert Extension.

Utilizza l'estensione axe Expert per Google Chrome con NVDA

Riferimento alle scorciatoie da tastiera di Chrome DevTools:

Prima di iniziare: Google ha recentemente aggiornato la Guida per l'utente di DevTools del browser Chrome e i materiali di riferimento web. Per le scorciatoie da tastiera generalmente applicabili all'uso dell'estensione axe Expert in Google Chrome, vedere Riferimento alle scorciatoie da tastiera - Google Developers Chrome DevTools.

Le seguenti istruzioni spiegano in generale come utilizzare l'estensione axe Expert in Google Chrome con gli screen reader basati su Windows, tra cui NVDA. Vengono fornite istruzioni per installare, avviare, navigare nell'interfaccia utente, regolare le impostazioni, eseguire un'analisi dell'accessibilità ed esportare i risultati. Questa documentazione non include istruzioni su come lavorare con l'estensione SimulAT di axe Expert o con la funzionalità di scripting in NVDA, né le istruzioni contengono il livello di dettaglio presente nel resto di questa guida per l'utente. La documentazione qui inclusa serve solo come guida rapida per gli utenti del software per la lettura dello schermo NVDA.

In questo argomento:

Installa l'estensione di axe Expert

L'installazione dell'estensione axe Expert in DevTools di Google Chrome è leggermente diversa dall'installazione dell'estensione axe Expert di Deque per Mozilla Firefox, che ha una procedura di installazione diversa per gli utenti di axe Monitor (che utilizzano un collegamento di installazione dall'applicazione) rispetto a quella per gli utenti di axe Expert Extension (che scaricano prima un file .xpi da un repository).

Importante

Le seguenti istruzioni sono fornite solo a _ scopo di esempio_ per darvi un'idea del processo di installazione. Le fasi specifiche del processo potrebbero variare in base ai requisiti specifici di sicurezza e al tipo/versione del browser. Ad esempio, a seconda dell'organizzazione, potrebbe essere necessario caricare un'estensione non compressa con la modalità sviluppatore abilitata. Per istruzioni specifiche sull'installazione, consultare il proprio responsabile. La best practice consigliata da Deque è che tutti i clienti collaborino con il proprio Deque Engagement Manager o con l'Help Desk Deque per ottenere la versione corretta e i file di installazione con la licenza appropriata.

Dalla pagina dell'estensione del Chrome Web Store

Il modo più semplice per installare l'estensione axe Expert è tramite un collegamento diretto alla pagina dell'estensione di Google Chrome nel Chrome Web Store. Se hai già installato un'estensione del browser Google Chrome in precedenza, la procedura è la stessa. Tuttavia, l'estensione axe Expert non è generalmente ricercabile nel Chrome Web Store, quindi è necessario un collegamento diretto:

Link ad axe Expert nel Chrome Web Store.

Per istruzioni complete sull'installazione tramite il collegamento fornito, fare riferimento all'argomento Scarica e installa nella sezione Introduzione di questa guida.

Da un collegamento di installazione

È possibile accedere direttamente al file di installazione compresso .crx tramite un collegamento nel menu della barra laterale destra di axe Monitor, consentendo di avviare il processo di installazione dal browser Google Chrome.

Per installare axe Expert Extension da un collegamento di installazione (axe Monitor):

  1. Accedi alla sezione Collegamenti rapidi della schermata Home di axe Monitor utilizzando il browser Chrome.
  2. Seleziona Scarica estensione axe Expert 3.5.

Quando selezioni il link di installazione dell'estensione axe Expert, viene visualizzato un messaggio che ti chiede se desideri installare l'estensione axe Expert.

  1. Usare il tasto Tab per navigare fino a e selezionare il pulsante Carica estensione non impacchettata... (o premere Alt_I).

Da un file CRX

L'estensione di Google Chrome compressa viene offerta come un file compresso con l'estensione del file .crx e offre una chiave privata, così non dovrai mai preoccuparti di aggiornare manualmente l'estensione, poiché questa operazione viene gestita automaticamente.

Per installare axe Expert Extension da un .crx file (axe Expert Extension):

  1. Contattare il proprio Deque Engagement Manager o l'Help Desk Deque per ottenere il programma di installazione del file CRX richiesto.
  2. Accedi al file scaricato .crx sul tuo computer.
  3. Premere Enter.

Verifica l'installazione

L'installazione dovrebbe richiedere solo pochi secondi. Al termine dell'installazione verrà riprodotto un messaggio che informa che l'estensione axe Expert è stata installata correttamente. Puoi sempre verificare il successo dell'installazione provando ad aprire l'estensione axe Expert in Google Chrome DevTools. Per ulteriori informazioni, vedere Apri l'estensione axe Expert. I passaggi seguenti ti guideranno attraverso la verifica dell'installazione tramite la navigazione alla voce axe Expert Extension nella pagina delle estensioni di Google Chrome.

  1. Nel campo Indirizzo (Posizione) di Google Chrome, digita chrome://extensions/ e premi Invio.

  2. Attiva TAB tre volte per accedere all'elenco delle estensioni di Google Chrome installate.

  3. Premere il tasto Down Arrow per individuare la voce dell'elenco axe Expert Extension.

    Le estensioni di Google Chrome vengono visualizzate in ordine crescente e in base a quelle installate più di recente, quindi dovrebbe essere la prima voce dell'elenco.

  4. Ascolta le opzioni "disattiva, rimuovi". Quando senti queste opzioni annunciate dopo axe Expert, l'estensione è stata installata correttamente.

Apri l'estensione axe Expert in Google Chrome

L'estensione axe Expert è installata nella barra delle schede DevTools di Chrome.

  1. Tieni premuto Ctrl+Shift+I per avviare Chrome DevTools.
  2. Tieni premuto Ctrl\_\] finché non senti la parola "axe Expert".

Quando viene installata per la prima volta, e non sono presenti altre estensioni che si integrano con gli Strumenti di sviluppo di Google Chrome, la scheda axe Expert si troverà all'estrema destra della barra delle schede della casella degli strumenti.

  1. Premere Invio per abilitare la scheda axe Expert nella finestra DevTools.

L'estensione axe Expert è ora attiva nella finestra DevTools di Google Chrome ed è pronta per l'uso.

Comprendere e navigare nell'interfaccia utente dell'estensione axe Expert

Selezione del pannello del menu principale

Nel riquadro sinistro di axe Expert Extension, indipendentemente dal pannello selezionato, è presente un menu a discesa principale che fornisce collegamenti a ciascuno dei cinque pannelli principali di axe Expert Extension.

  1. Verificare l'attivazione della scheda axe Expert premendo il tasto Tabulazione per spostare il focus sul Menu principale, denominato "Navigazione globale".

    Il frame viene annunciato come frame "data/index".

    Scheda predefinita: il riquadro Analizza è attivo per impostazione predefinita all'avvio dell'estensione Expert di axe. Utilizza la scheda Analizza per eseguire l'analisi dell'accessibilità; è probabile che sia la scheda che utilizzi nel 99,5% dei casi. Utilizzare il menu axe Expert Extension Options per selezionare Settings e Sign in to axe Monitor.

  2. Sposta il focus sul menu principale di navigazione globale dell'axe Expert Extension e premi Invio.

    Si apre il menu principale dell'estensione Expert di Axe e vengono visualizzate cinque opzioni di pannello:

    • Analyze: Il pannello Analyze è il pannello predefinito visualizzato quando si attiva l'estensione Expert di axe. Per istruzioni specifiche di JAWS per questo pannello, fare riferimento a Analizza una pagina per violazioni delle regole di accessibilità . Per ulteriori dettagli, vedere Analizza.
    • Scripts: Per i dettagli completi, vedere Script .
    • Page Insights: Consultare Approfondimenti sulla pagina per i dettagli completi.
    • Rules: Consultare [Usa regole personalizzate] per istruzioni specifiche di JAWS per questo pannello.(#custom) Per i dettagli completi, vedere anche Set di regole .
    • Settings: Consultare [Configura impostazioni] per istruzioni specifiche di JAWS per questo pannello.(#settings)
  3. Premere i tasti down arrow e up arrow per navigare tra le voci del menu principale dell'estensione Expert di Axe. Premere Enter per selezionare una voce di menu.

Il menu si chiude e lo screen reader annuncia "pulsante collassato", seguito dal nome della voce di menu selezionata.

Panel-Specific Context Menu (Analyze menu)

Accedi a controlli aggiuntivi specifici del pannello e link ai pannelli associati e alle funzionalità correlate su altri pannelli per il pannello selezionato tramite il menu a discesa del pulsante ellissi verticali nella barra superiore del riquadro dei contenuti a destra nel pannello Analizza. Questo menu a discesa viene talvolta chiamato informalmente "menu a tre punti".

Utilizzare il menu contestuale del pannello Analizza:
  • Tab dal Analyze pulsante sul Analyze pannello per spostare il focus su un menu contestuale che viene annunciato come main landmark Analyze google menu button collapsed.
  • Premere Enter per visualizzare le voci del menu contestuale Analizza.
  • Arrow down o scorri verso l'alto per evidenziare una voce di menu e premi Enter per selezionare la voce di menu attualmente evidenziata.

Ogni pannello all'interno di Axe Expert Extension è composto da due o tre sottopannelli informativi. I sottopannelli contengono anche sezioni informative identificate da intestazioni.

Passare da un pannello all'altro

  • In modalità di navigazione, premere Freccia su o Freccia giù per selezionare il pannello che si desidera abilitare e premere Invio.
  • In modalità moduli, premere Tab per passare al pannello attivo, quindi utilizzare i tasti freccia (freccia destra o freccia sinistra) per passare ad altri pannelli (non è necessario premere Invio).

Per riportare NVDA alla modalità di navigazione, premere il tasto NVDA e la barra spaziatrice dopo aver lavorato in modalità modulo.

Layout della tastiera e modalità moduli

Layout tastiera NVDA: premere il tasto Esc o il tasto NVDA e la barra spaziatrice per uscire dalla modalità moduli in NVDA. Il tasto NVDA è il tasto insert [specific key], a meno che non lo si cambi in Caps Lock[specific key], cosa che è possibile fare nel menu di configurazione di NVDA.

Seleziona un set di regole

Potreste voler modificare l'opzione del set di regole nel pannello Regole. Il pannello Regole contiene caselle di controllo con la legenda Set di regole, in cui è possibile trovare tre set di regole. Le regole WCAG 2.0 AA sono attive per impostazione predefinita. L'utilizzo di un set di regole diverso da quello predefinito WCAG 2.0 AA comporta l'esecuzione di modifiche facoltative nella scheda Regole.

È possibile eseguire analisi offline utilizzando uno degli insiemi di regole standard di axe Expert Extension senza connettersi a un server axe Monitor, oppure è possibile utilizzare il proprio insieme di regole personalizzato.

Standard predefinito: se utilizzi l'estensione Expert di axe pronta all'uso, eseguirai un'analisi WCAG 2.1 AA utilizzando il set di regole WCAG 2.1 AA predefinito.

Seleziona un set di regole:

  1. Premi R in NVDA.

La casella di controllo WCAG 2.1 livello AA è selezionata per impostazione predefinita. Si tratta di un ruleset standard fornito con l'estensione Expert di axe. Il ruleset predefinito viene utilizzato finché non si specifica ad axe Expert Extension di utilizzarne uno diverso. Non è possibile eliminare i ruleset forniti come parte dell'estensione Expert di axe.

  1. Selezionare un ruleset tramite la casella di controllo associata.

Non sono necessarie ulteriori conferme.

Impostazioni: connessione al server, selezione del progetto e ambito

La prima cosa che noterai nel pannello Impostazioni è un insieme di campi del modulo che ti consentono di connettere l'estensione axe Expert a un server axe Monitor. Dopo aver effettuato l'accesso ad axe Monitor, viene visualizzato un menu di selezione progetto con pulsanti. Quando selezioni un progetto vengono visualizzate due nuove sezioni: Problemi da scaricare e Ambito.

Potresti voler connettere al tuo server axe Monitor e selezionare un progetto per abilitare il download e il caricamento dei risultati dell'analisi. Se l'estensione axe Expert non è connessa a un server axe Monitor, il menu a discesa viene annunciato come "offline nessun progetto" o "cliccabile offline nessun progetto cliccabile" e la funzionalità di selezione del progetto viene annunciata come "non disponibile". Per maggiori dettagli, vedere rispettivamente Accedi ad axe Monitor e Seleziona un progetto axe Monitor .

Prima di utilizzare il pannello Analisi per analizzare una pagina web, è possibile modificare le opzioni nella sezione Ambito del pannello Impostazioni per definire con precisione cosa verrà preso di mira e cosa verrà ignorato. Per maggiori dettagli, vedere Definizioni di ambito.

Opzioni di registrazione degli eventi

Il pannello Opzioni di registrazione script, a cui si accede tramite il collegamento Opzioni nel pannello della scheda Script, contiene una sezione denominata Eventi da acquisire , contenente caselle di controllo in cui è possibile configurare quali eventi registrare o ignorare durante la registrazione degli script. Per ulteriori informazioni, vedere Selezionare gli eventi da acquisire.

Analizza una pagina per violazioni delle regole di accessibilità

  1. Apri la pagina che vuoi testare in Chrome.

  2. Apri Chrome DevTools (Ctrl_Shift_I) e seleziona la scheda axe Expert.

    Per maggiori informazioni, fare riferimento a Open axe Expert Extension .

  3. Individua il pulsante ANALIZZA o il collegamento Esegui di nuovo se stai rianalizzando una pagina nel riquadro Analizza dell'axe Expert Extension (non importa quale selezioni, entrambi svolgono la stessa funzione).

  4. Il pulsante Analizza.

L'etichetta del pulsante Analizza cambia per visualizzare l'analisi durante una scansione.

Saprai che la scansione è terminata quando potrai usare la freccia o il tasto Tab per spostare il focus dal pulsante Analizza.

Quando non vengono rilevate violazioni dell'accessibilità

Se non vengono rilevate violazioni di accessibilità, la riga dopo il pulsante di caricamento riporta: Congratulazioni! Nessuna violazione di accessibilità trovata. Ora dovresti eseguire test manuali utilizzando tecnologie assistive come NVDA, VoiceOver e JAWS.

Lavorare con i risultati dell'analisi

Pulsante Esporta e conteggio delle violazioni: se sono stati rilevati uno o più errori, utilizzare la quinta opzione di collegamento, Export, nel menu del pannello Analyze per esportare i risultati in un file CSV.

Download e Upload collegamenti: Analyze il menu del pannello include anche gli elementi scarica... e carica... Questi elementi vengono annunciati come "disabilitati" quando non sono connessi a un server axe Monitor. Per ulteriori informazioni, vedere Carica risultati analisi e Scarica uno script.

Analizza i risultati dell'estensione Expert di axe in uno dei due modi:

  • Esporta i risultati in un programma di fogli di calcolo per ulteriori analisi.
  • Esamina i risultati nel pannello Analizza.

Esporta risultati

Se è necessario lavorare con i risultati delle analisi in un programma di fogli di calcolo come Microsoft Excel, che consente l'ordinamento e altre manipolazioni dei dati, seleziona Export dal menu axe Expert Extension Analyze per scaricare un file con valori separati da virgole (CSV). Lavorare con i risultati esportati è particolarmente utile per gli utenti di lettori di schermo, poiché facilita la navigazione tra le violazioni quando i risultati includono più violazioni di più regole.

Esporta i risultati in un file CSV:

  1. Selezionare Export nel Analyze menu a discesa specifico del pannello.

Viene visualizzata una tipica finestra di dialogo Salva file.

  1. Selezionare una cartella comoda, assegnare un nome descrittivo al file, selezionare Save.

    La prima volta che apri la finestra di dialogo Salva file tramite il collegamento Esporta, assicurati che la cartella desiderata sia shift+tabbing selezionata nell'albero delle cartelle. L'estensione axe Expert salva i risultati esportati nel percorso di download predefinito configurato nelle impostazioni del browser Chrome. Una volta selezionata una cartella, axe Expert Extension ricorda la selezione per le esportazioni future.

Revisione dei risultati dell'analisi nell'estensione axe Expert

Tutti i risultati dell'analisi di Axe Expert Extension vengono visualizzati sotto la voce Violazioni trovate. Solitamente questa è l'unica intestazione nel Analyze pannello, quindi usando h dovresti arrivarci direttamente.

Esamina le violazioni delle regole:

  • Premi due volte la freccia su per visualizzare la riga in cui è riportato il numero di violazioni riscontrate.

    L'estensione axe Expert visualizza un elenco ordinato dei test che hanno identificato delle violazioni, insieme al numero di violazioni per ciascuna regola. I nomi delle regole nell'elenco sono collegamenti che, una volta visualizzati, mostrano un elenco di tutte le violazioni di quella regola.

    Un tipico elenco di violazioni potrebbe essere il seguente:

Elenco di x elementi

  1. Link: gli elementi devono avere un contrasto di colore sufficiente violazioni x (dove x è il numero di violazioni).
  2. Link: il valore dell'attributo ID deve essere univoco. Violazioni...

Analizza nel dettaglio le singole violazioni:

  • Selezionare il collegamento alla regola nell'elenco.

Quando si seleziona un collegamento a una regola, verrà visualizzato un pannello che mostra la prima violazione della regola.

Panoramica del pannello dei risultati dell'analisi delle violazioni

Questa sezione descrive le informazioni sequenziali visualizzate scorrendo verso il basso all'interno di una singola violazione di una regola.

  • Visualizzazione di una singola violazione: iniziare dall'elenco delle regole che hanno prodotto violazioni (vedere la sezione precedente per una descrizione e un esempio di come appare l'elenco).

  • Navigazione e impatto delle violazioni multiple

  • Bottone Indietro: Alla fine dell'elenco vedrai un bottone chiamato Indietro. Il pulsante precedente è disabilitato quando visualizzate la prima violazione della regola.

  • # di violazioni totali: scorrendo verso il basso dal bottone Precedente si visualizza una riga che riporta: "violazione 1 di X", dove X è il numero totale di violazioni specifiche della regola attiva.

  • Impatto: scorrendo ulteriormente verso il basso a partire dalla riga # delle violazioni totali vengono visualizzate le informazioni sull'impatto relative alla violazione. La riga dell'impatto contiene il grado di impatto: lieve, moderato, grave o critico.

  • Next Pulsante: dopo le informazioni sull'impatto viene visualizzato un pulsante successivo. Il pulsante successivo viene segnalato come disabilitato se si sta esaminando l'ultima violazione di una regola specifica.

  • Description: Scorrendo in basso dal pulsante successivo viene visualizzata una descrizione di una riga della regola violata insieme a un collegamento Ulteriori informazioni. Ad esempio, questa riga reciterà "Garantisce che il contrasto tra i colori di primo piano e di sfondo rispetti le soglie del rapporto di contrasto WCAG 2 AA" quando viene registrata una violazione della regola sul contrasto dei colori.

  • More info link: seleziona Ulteriori informazioni per esaminare il contenuto di Deque University che fornisce maggiori informazioni di contesto e di base sulla regola violata, oltre a istruzioni dettagliate su come correggere le informazioni.

  • Applicable Ruleset (Standard) and Success Criteria: Un elenco di due elementi segue il collegamento Ulteriori informazioni. Il primo elemento dell'elenco elenca l'insieme di regole attivo utilizzato durante la scansione di analisi dell'estensione Expert di axe. WCAG 2.0 AA è l'insieme di regole di estensione per esperti di axe, indicato come "wcag2aa". La seconda voce dell'elenco specifica il criterio di successo per la regola attiva (ad esempio, wcag143 per il criterio di successo WCAG 2.0 1.4.3 - contrasto colore).

  • Inspect and Highlight links: Il collegamento Ispeziona evidenzia l'elemento violante in DevTools. Il secondo collegamento, Evidenzia, evidenzia visivamente l'elemento della pagina web nella finestra principale del browser Chrome.

  • Section Navigation: Diverse intestazioni h2 aggiuntive rappresentano sezioni del pannello dei contenuti all'interno di un'infrazione:

  • Target: Target identifica un percorso del selettore CSS per l'elemento HTML violante.

  • HTML: visualizza un frammento di markup HTML che include l'elemento violante.

  • Summary: Il riepilogo contiene una sezione che corregge una qualsiasi delle seguenti sottosezioni, seguita da un elenco di correzioni suggerite. La disposizione e la formulazione precise della correzione suggerita dipendono dalla specifica violazione. L'elenco delle soluzioni suggerite è un'informazione essenziale in qualsiasi report o analisi, poiché solitamente aiuta a individuare l'errore esatto e spesso fornisce la soluzione più semplice.

Note di navigazione per violazioni multiple

Utilizzare i pulsanti Previous e Next

Usa i pulsanti previous e next per passare alla violazione precedente/successiva se l'analisi ha registrato più violazioni delle regole. La maggior parte degli screen reader annuncia automaticamente la linea aggiornata della violazione x di y quando si selezionano i pulsanti previous o next . Ad esempio, se il pannello visualizza attualmente la violazione uno su dieci e si seleziona il pulsante next , NVDA pronuncerà automaticamente "violazione due su dieci". I pulsanti next e previous forniscono l'unico modo per navigare verso una specifica violazione delle regole.

Passare a una singola violazione

Per arrivare alla violazione numero otto su dieci per la regola x, clicca sulla regola x e poi clicca sette volte su next .

A proposito dell'ultima violazione

Cliccando su next quando è visualizzata l'ultima violazione di una determinata regola, non viene automaticamente visualizzata la prima violazione della regola successiva. Infatti, il pulsante next è disabilitato quando viene visualizzata l'ultima violazione della regola. Torna all'elenco delle regole e seleziona la regola successiva da ispezionare.

Esaminare tutte le violazioni dell'accessibilità per tutte le regole. Esporta il report in un file CSV per rivedere rapidamente tutte le violazioni delle regole in un unico posto.

Usa regole personalizzate

Il pannello Rules è la quarta selezione nel menu principale. Se hai scritto un file JSON di regole personalizzate da sottoporre a scansione con axe Expert Extension, usa il pannello Rules per aggiungere il tuo set di regole. Una volta aggiunto al Rules pannello, puoi selezionare il tuo set di regole dalla Rules scheda. Il Custom Ruleset pannello contiene due campi modulo e un pulsante: Name for Custom Rules, Enter JSON, e SAVE AND USE RULESET.

Aggiungi regole personalizzate

  1. Specificare un nome per il set di regole personalizzato nel campo (Name for Custom Rules and Enter JSON).

Assicurati che il nome contenga solo lettere o numeri (non sono ammessi spazi, trattini o altri simboli come parte del nome del set di regole).

  1. Inserisci o incolla le tue JSON regole nel campo Enter JSON .

  2. Seleziona SAVE AND USE RULESET.

Il pannello Rules visualizza un messaggio di successo o di errore se hai specificato un nome non valido o hai utilizzato un JSON non valido. Puoi vedere il nome del tuo set di regole nella sezione Set di regole personalizzati del menu della barra laterale sinistra nel riquadro Regole. Per eliminare un set di regole personalizzato, seleziona la casella di controllo corrispondente e poi seleziona Elimina set di regole.