Los elementos y atributos para
formularios en HTML5 proveen un mayor grado de marcado semántico que en HTML4 y
eliminan gran parte del tedioso trabajo de programar y diseñar que se
necesitaba en HTML4. Las funcionalidades de los formularios en HTML5 brindan
una experiencia mejor para los usuarios al permitir que los formularios tengan
un comportamiento más consistente entre diferentes sitios web y al darle una
devolución inmediata acerca de la información ingresada. También proveen esta
experiencia a los usuarios que han deshabilitado javascript en sus navegadores.
Ejemplo:
<div id="contact-form">
<h1>¡Contáctate con
nosotros!</h1>
<h2>Usa el
formulario para acercarnos tu mensaje.</h2>
<p id="failure">Oops...
Algo anduvo mal.</p>
<p id="success">Gracias,
tu mensaje ha sido enviado correctamente.</p>
<form method="post" action="emailForm.php">
<label for="name">Name: <span class="required">*</span></label>
<input type="text" id="name" name="name" value=""placeholder="Your
name" required="required" autofocus="autofocus" />
<label for="email">Email
Address: <span class="required">*</span></label>
<input type="email" id="email" name="email" value=""placeholder="your@email.com" required="required" />
<label for="website">Website: </label>
<input type="web" id="webstie" name="website" value="" />
<label for="subject">Subject: </label>
<select id="subject" name="subject">
<option value="hello">I just want to say hello
=]</option>
<option value="quote">I'd
like a quote</option>
<option value="general">General</option>
</select>
<label for="message">Message: <span class="required">*</span></label>
<textarea id="message" name="message" placeholder="Write
your message here, please." required="required"></textarea>
<input type="submit" value="Send
away!" id="submit" />
</form>
</div>
No hay comentarios:
Publicar un comentario