I link portano da qualche parte, i pulsanti fanno qualcosa
L'unica regola che risolve quasi ogni caso.
I link portano da qualche parte, i pulsanti fanno qualcosa è una lezione Web Accessibility Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Web Accessibility Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Web Accessibility Academy include 4 lezioni in totale.
L'unica regola
Ecco la regola che risolve quasi tutti i casi: un link porta da qualche parte, mentre un pulsante fa accadere qualcosa proprio qui. 🧭
Che cos'è un link
Un link consente di spostarsi. Facendovi clic, cambia la pagina o l'URL, ad esempio per passare a un altro articolo o a una nuova sezione.
<a href="/pricing">See pricing</a>Che cos'è un pulsante
Un pulsante esegue un'azione sul posto: invia un modulo, apre un menu o attiva e disattiva un'impostazione senza lasciare la pagina.
<button type="button">Add to cart</button>Perché è importante
I lettori di schermo annunciano il ruolo ad alta voce. Gli utenti sentono link o pulsante, quindi l'elemento corretto crea l'aspettativa giusta prima dell'azione.
Tasti diversi, funzioni diverse
Non è solo una questione estetica. Un pulsante si attiva con la barra spaziatrice o Invio, mentre un link si attiva solo con Invio. I tasti dipendono dal ruolo.
La verifica rapida
Ponga una domanda: questo controllo cambia la posizione in cui mi trovo oppure ciò che appare sullo schermo? Navigazione significa link; un'azione significa pulsante.
Aprire in una nuova scheda
Se un controllo potrebbe ragionevolmente essere aperto in una nuova scheda o aggiunto ai segnalibri, si tratta di navigazione: usi quindi un vero link con un href.
L'aspetto non determina il ruolo
Lo stile non cambia il significato. Un pulsante può sembrare un link e un link può sembrare un pulsante, ma è l'elemento a determinare il ruolo.
L'errore comune
Si ricorre a un div o a uno span con stile, aggiungendo un gestore del clic. Sembra funzionare, ma non ha né un ruolo né il supporto per la tastiera.
<div class="btn" onclick="save()">Save</div>Inviare un modulo
Per inviare un modulo, usi un pulsante di tipo submit. È un'azione, non una navigazione, quindi in questo caso un link sarebbe errato.
<button type="submit">Sign up</button>Andare a un'altra pagina
Per portare un utente alla pagina dei contatti, usi un link. È una semplice navigazione e un pulsante trarrebbe tutti in inganno.
<a href="/contact">Contact us</a>Verifica rapida
Aggiunge un controllo che apre un menu senza lasciare la pagina. Quale elemento è adatto?
Riepilogo
I link portano da qualche parte, i pulsanti fanno qualcosa. Abbini l'elemento all'intento e otterrà il ruolo corretto, i tasti corretti e utenti soddisfatti. 🎉
Impara HTML con un tutor IA — gratis
Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.
- Corsi
- 30
- Lezioni
- 120
Domande Frequenti
La lezione «I link portano da qualche parte, i pulsanti fanno qualcosa» è gratuita?
Sì — il testo completo di «I link portano da qualche parte, i pulsanti fanno qualcosa» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Web Accessibility Academy, passa a CoddyKit PRO. Il corso Web Accessibility Academy include 4 lezioni in totale.
Cosa imparerò in «I link portano da qualche parte, i pulsanti fanno qualcosa»?
L'unica regola che risolve quasi ogni caso. Eserciti Web Accessibility Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Web Accessibility Academy?
Non è richiesta alcuna esperienza precedente. Web Accessibility Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.
Quanto tempo richiede la lezione «I link portano da qualche parte, i pulsanti fanno qualcosa»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Web Accessibility Academy?
Sì. Ogni lezione Web Accessibility Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- I link portano da qualche parte, i pulsanti fanno qualcosa
- Testo dei link comprensibile anche fuori contesto
- Pulsanti che annunciano la propria azione
- L'anti-pattern dell'ancora senza href