Modulo contatti ordinato e accessibile
Form con etichette, campi e pulsante di invio.
Quando si usa
Quando il visitatore deve inviare una richiesta, iscriversi o lasciare i propri dati.
Perché si usa
Etichette collegate ai campi e una disposizione verticale rendono il modulo più comprensibile e utilizzabile.
Vantaggi principali
- Label associate correttamente
- Campi adatti ai dispositivi mobili
- Struttura pronta per ASP Classic
Anteprima del risultato
Il modulo organizza i campi in modo chiaro, con etichette visibili e pulsante finale ben riconoscibile.
Codice completo
Puoi copiare il frammento e inserirlo in una pagina di prova. Prima della pubblicazione sostituisci i dati dimostrativi con quelli reali.
<form class="modulo" action="invia.asp" method="post">
<label for="nome">Nome</label>
<input type="text" id="nome" name="nome" required>
<label for="email">Email</label>
<input type="email" id="email" name="email" required>
<label for="messaggio">Messaggio</label>
<textarea id="messaggio" name="messaggio" rows="6" required></textarea>
<button type="submit">Invia richiesta</button>
</form>
<style>
.modulo{display:grid;gap:9px;max-width:620px}
.modulo input,.modulo textarea{width:100%;padding:11px;border:1px solid #b9c7d8;border-radius:7px;font:inherit}
.modulo button{justify-self:start;padding:11px 18px;border:0;border-radius:8px;background:#2463a9;color:#fff;font-weight:700}
</style>Da personalizzare: Cambia action, nomi dei campi, testi, obbligatorietà e messaggio informativo sulla privacy.
Errore da evitare: Non usare il solo placeholder al posto delle etichette e valida sempre i dati anche sul server.