Una de las cosas nuevas que nos trae HTML5 es la capacidad de crear marcadores de posición o más conocidos dentro de la especificación HTML5 como placeholder.
Pero, ¿qué es un placeholder o marcador de posición? Para resumirlo podemos decir que es el texto que aparece dentro de un campo de texto antes de que se inserte un contenido. De esta manera podemos indicar al usuario qué queremos que inserte en ese campo. Es algo parecido a los labels, pero dentro de propio recuadro de texto.
La utilización de placeholder no exime el uso de labels. La W3C recomienda siempre el uso de un label junto con los inputs. Aunque estemos utilizando un placeholder.
Pero vamos a ponernos manos a la obra. Lo primero será crear un input de tipo text.
Para crear el placeholder simplemente tenemos que utilizar el atributo placeholder del elemento input. El valor que asignemos al atributo será el que aparezca en el marcado de posición.
Veamos como sería el código:
Y cual sería el resultado…
Aunque lo mejor es que cargues tu mismo la página web.
Hay que tener en cuenta una cosa, y es que el placeholder es un atributo de HTML5 y que solo está soportado por los últimos navegadores web. Así que no podremos tomarlo como algo obligatorio, si no opcional al usuario que entre con un navegador de última generación.