Los mejores placeholders para desarrolladores web

Aqu? tienes una lista de algunos de los mejores placeholders que puedes encontrar. Para los que no saben lo que es, les explico, cuando estas dise?ando un nuevo sitio web y creas un espacio para un banner o para colocar contenido necesitas poner algo mientras tanto para que aparente lo que ser?a cuando est? terminado. Bueno, aqu? te muestro como utilizar algunos servicios web que permiten generar placeholders con im?genes aleatorias o que siguen un patr?n, en algunos puedes indicar el texto que aparecer? en la imagen, etc.

Placehold.it

Placehold.it

Aqu? puedes generar placeholders que indican el ancho y el alto que poseen, indicar el texto, los colores y hasta el tipo de imagen.

Este yo lo usar?a mas para la generaci?n de espacios para banners y cosas as?, aunque cada quien le dar? el uso que encuentra apropiado.

<!-- Generando una imagen que indica su ancho y alto -->
<img?src="http://placehold.it/300x250">
<!-- Aqu? ves como modificarle los colores que trae por defecto -->
<img?src="http://placehold.it/300x250/292929/e3e3e3">
<!-- Tambi?n puedes indicar el texto -->
<img?src="http://placehold.it/300x250&text=Banner+350x200">
<!-- Hasta puedes indicar el tipo de imagen -->
<img?src="http://placehold.it/300x250.jpg">
<img?src="http://placehold.it/300x250.gif"

FlickHoldr

FlickHoldr

Puedes utilizar Flickr como motor para generar im?genes aleatorias que est?n relacionadas con el sitio que estas desarrollando, ya que FlickHoldr adem?s de permitirte utilizar im?genes desde Flickr te permite indicar el tama?o y los tags de las im?genes que deseas mostrar.

<!-- Forma de uso simple -->
<img?src="http://flickholdr.com/468/60">
<!-- Utilizando tags -->
<img?src="http://flickholdr.com/120/600/sea,sun">
<!-- Por si lo deseas en blanco y negro -->
<img?src="http://flickholdr.com/120/600/sea,sun/bw">

Griddle.it

Griddle.it

Griddle.it es ?nico en comparaci?n con sus compa?eros debido a que su atenci?n se centra en la creaci?n de lo que ser?an columnas para delinear una plantilla. Una forma limpia y sencilla para ayudar a alinear los dise?os.

La forma de uso es la siguiente: http://griddle.it/[ancho total]-[numero de columnas]-[espacio entre columnas].

/* Genera un grid con un ancho de 960px, con 12 columnas y 30px de ancho entre cada columna */
body { 
  background: url(http://griddle.it/960-12-30) repeat-y center top; 
}
Compartir Twitter Facebook Google+ Pinterest LinkedIn Flipboard Delicious Addthis