Sezione "come funziona" a passi (HTML e CSS)
Scrivi un passo per riga. Su smartphone la versione orizzontale diventa verticale da sola.
Come si usaTre passi e il cliente capisce
Disponibile in: 
Sezione "come funziona" a passi (HTML e CSS): a cosa serve
Una sezione con tre o quattro passi spiega in pochi secondi come ordinare, richiedere o prenotare, e toglie il dubbio che fa andare via il visitatore. Scrivi un passo per riga e scegli la disposizione: orizzontale con una linea tratteggiata che unisce i numeri, verticale con la linea di lato o a schede.
Il codice usa una lista ordinata (ol) e i contatori CSS per i numeri, che vengono letti correttamente dai lettori di schermo, diventa verticale su smartphone e può finire con un pulsante di invito all’azione, come il link a WhatsApp.
Come si usa
- Scrivi i passi, uno per riga.
- Scegli la disposizione, il colore e il pulsante.
- Copia il codice nel sito.
Quando usarlo
- Come ordinare un servizio.
- Come fare un ordine.
- Come funziona un’app o un corso.
Domande frequenti
Quanti passi usare?
Tre o quattro è l’ideale: il visitatore dà un’occhiata e capisce il processo. Se il tuo ha più passaggi, unisci quelli simili; i dettagli possono andare in una pagina di domande frequenti.
Perché il codice usa una lista ordinata?
I passi hanno un ordine, e la lista ordinata (ol) lo comunica ai lettori di schermo, che annunciano «elenco di 3 elementi» e il numero di ciascuno. I numeri grandi sono disegnati dal CSS con i contatori, senza ripetere il numero nel testo.
Posso mettere un pulsante alla fine?
Sì, ed è consigliato: dopo aver spiegato come funziona, proponi il passo successivo. Compila il testo e il link del pulsante e comparirà sotto i passi.
È davvero gratis?
Sì, 100% gratis. Senza registrazione, senza abbonamento e senza limiti d’uso. Tutti gli strumenti di Tools123 sono gratuiti.