Placeholder html

¿Qué es?

Placeholder es un atributo nuevo que se ha incluído en HTML5, pensado para ser usado en los formularios, ya que su fin es el de dar una pista al usuario que está rellenando un formulario para que sepa lo que tiene que introducir en un campo concreto sin necesidad de leer mucho más.

Por lo tanto el placeholder html aparece en los campos de un formulario en los cuales se especifique. Esta especificación puede ser un ejemplo de lo que haya que introducir en el campo, una breve descripción o lo que cada uno deseé.

El texto que le indiquemos al atributo placeholder html se mostrará hasta que el usuario comience a introducir datos en el campo, por lo tanto, cuando se haga foco en el campo, el placeholder aún se mostrará. Hacer foco quiere decir poner el cursor en un campo para comenzar a escribir en él.

¿Dónde usarlo?

Este nuevo atributo de HTML5 se puede utilizar en los siguientes tipos de campo: texto, búsqueda, url, teléfono, email y contraseña.

La versión de los buscadores que soportan el atributo placeholder, así como toda la información relevante de placeholder html puedes encontrarlo en la correspondiente página de W3School pinchando aquí, o en la tabla a continuación:

Soporte de navegadores placeholder html

¿Cómo usarlo?

Para usar un placeholder basta con indicarlo a modo de atributo como el id o la clase de cualquier etiqueta html. Por lo tanto un ejemplo sería el siguiente:

<input type="text" placeholder="Texto placeholder">

Más sobre placeholder html

Para saber más sobre placeholder html, visita mi post sobre estilo placeholder con css en el cual explico cómo darle estilo al texto del placeholder, ya que podemos querer que tome un estilo parecido al usado en la plantilla, en el formulario o en la página actual.

Por último, espero que este post te haya parecido interesante, te invito a compartir, comentar y puntuar.