Placeholders en formularios HTML5


       Uno de los nuevos atributos de los elementos de formulario en HTML5 es placeholder. Con este atributo podemos especificar un texto a mostrar en los elementos de tipo texto o similares, a modo de información y que desaparece cuando comenzamos a escribir.

       Me parece muy útil para poner consejos, un ejemplo o requisitos en los campos a modo de ayuda. Por ejemplo el típico “dd/mm/aaaa” en un campo de fecha, o un “usuario@ejemplo.com” en un campo de correo electrónico.

       Eso sí, para ser consecuentes, si usamos placeholders deberíamos hacerlo en todos los campos de un formulario.

       El código es muy sencillo:

<input id=”fecha” name=”fecha” type=”text” placeholder=”dd/mm/aaaa” />

       Y aquí un ejemplo de formulario con varios placeholders:






       Los placeholders están soportados desde Firefox 4, Chrome 4, Safari 5, Opera 11.6, IOS y Android. El explorer lo hará en su versión 10. Al ser una ayuda adicional, si el navegador no lo soporta tampoco es un drama. Pero si se quiere conseguir que funcione en cualquier navegador, se puede acudir a complementos de Jquery que hagan la misma función, como por ejemplo Jquery-placeholder