Recursos para diseñadores web: fotos aleatorias de muestra

Lorem Pixel y otros generadores automáticos de imágenes para maquetación web

Imagen generada automáticamente por Lorem Pixel

Imagen generada automáticamente por Lorem Pixel

De la misma manera que existen generadores de textos de muestra (a partir del conocido Lorem Ipsum o de otros textos), también existen generadores de fotos aleatorias y de espacios para imágenes (placeholders).

Por ejemplo, la imagen que ves aquí al lado está generada automáticamente. Lo único que se ha especificado es que mida 350 x 230 pixels.

Este tipo de servicios son perfectos a la hora de empezar a maquetar una web, evitándonos tener que recurrir a fotos de stock o imágenes de relleno que podamos tener preparadas en nuestro cajón de recursos.

Lorem Pixel (antes Lorem Pixum)

Lorem Pixel es un servicio de generación automática de imágenes gratuito y muy fácil de utilizar. Solo tenemos que apuntar la URL de la imagen a este servicio, especificando las dimensiones que necesitamos, y nos incrustará una foto automáticamente. En el ejemplo anterior la URL sería:

http://lorempixel.com/350/230/

Podemos seleccionar cualquier tamaño, es decir, no estamos limitados a tamaños estándar. Funcionará igualmente bien tanto si pedimos una foto de 300 x 200 pixels, como cualquier otra proporción caprichosa que necesitemos, por ejemplo 206 x 191. Eso sí, el límite, tanto del ancho como del alto, es de 1920 pixels, el perfil de color siempre será RGB o escala de grises y la resolución, 72 ppp.

Lorem Pixum nos permite seleccionar fotos de entre 11 temas o categorías: fotos abstractas, de animales, urbanas, de comida, nocturnas, moda, gente, naturaleza, deportes, técnicas y transportes.

Esto nos puede venir muy bien, por ejemplo, si estamos montando una web para un restaurante y todavía no nos han enviado las fotos de los platos del menú. Podríamos utilizar las fotos de Lorem Pixum especificando que sólo queremos fotos cuadradas de exactamente 500 x 500 pixels y únicamente de la categoría “Comida”. Así:

http://lorempixel.com/500/500/food

Si queremos recibir siempre la misma foto, basta añadir el número detrás de la categoría:

http://lorempixel.com/400/200/sports/1/

También es posible añadir un pequeño texto vertical sobre la foto:

http://lorempixel.com/400/300/technics/3/Ubuntu/

Utilizar un servicio como este tiene dos ventajas más: no tenemos que preocuparnos por los derechos de las fotos (siempre y cuando las utilicemos únicamente para maquetación web o de imprenta) y que, al no estar alojadas las fotos en nuestro servidor, tampoco tenemos que subir ni copiar nada, ni preocuparnos por el ancho de banda (en otras palabras, estamos haciendo “hotlinking“, pero en este caso está permitido).

Lógicamente, podemos utilizar este servicio tanto desde las plantillas HTML o CSS, como directamente desde WordPress o cualquier otro editor de contenidos que estemos utilizando.

Lorem Pixum se está haciendo bastante popular. De hecho, ahora mismo llevan servidas casi 22 millones de fotos desde que pusieron en marcha el servicio en abril de 2011.

Sinceramente, cuando lo conocí pensé que sería una curiosidad más, algo que desechas rápidamente porque no te soluciona o facilita nada en el día a día. Pero no es así. Por ejemplo, es mucho más rápido generar una imagen con un tamaño específico a partir de Lorem Pixum, que abrir una foto en Photoshop, recortarla y guardarla para web. Si estamos maquetando una web, es más fácil y mucho más rápido probar diferentes tamaños de una foto cambiando sólo la URL, que tener que crear todos los tamaños previamente.

Si te ha convencido, puedes probar esta herramienta visitando: http://lorempixum.com/

Otros servicios de generación de imágenes similares

  • Foto generada automáticamente por Placeimg.complace IMG sirve fotos automáticamente desde 500px y Flickr. Su funcionamiento es muy similar a Lorem Pixel: podemos elegir un tema (animales, arquitectura, naturaleza, tecnología…) y también un efecto (fotos en blanco y negro o sepia). Además, cuenta con plugins disponibles para ExpressionEngine, Drupal y WordPress, entre otros.
    http://placeimg.com/
  • Foto generada automáticamente por PlacekittenPlacekitten es otro generador de fotos parecido a Lorem Pixum pero con la particularidad de que únicamente nos entrega fotos sobre un tema: gatos
    http://placekitten.com/
  • Foto generada automáticamente por Placehold.itPlacehold.it es diferente a los dos servicios anteriores. En este caso, se trata de un generador de espacios para imágenes (los típicos cuadros grises tan frecuentes en maquetación). Podemos seleccionar el formato, texto, color y tamaño de los recuadros.
    http://placehold.it/
  • Foto generada automáticamente por Ipsum ImageIpsum Image es otro generador de espacios para imágenes. Además del tamaño, nos permite seleccionar el color de fondo, el texto que queremos que aparezca sobre la foto (incluido el tamaño y el color de ese texto) y el formato (PNG, JPG o JPEG)
    http://ipsumimage.appspot.com/

Generadores de textos de muestra

Si lo que buscas son generadores de textos de muestra (dummy text), aquí tienes algunas herramientas útiles:

Y tú qué opinas?

Las URLs se convertirán en enlaces automáticamente. Tu dirección de email no se publicará ni se utilizará para enviar ningún tipo de información. Los mensajes que no aporten nada al tema que se trata en esta entrada se borrarán. Las imágenes que aparecen al lado de cada autor utilizan el servicio de Gravatar. Recuerda que puedes usar etiquetas HTML como <a href>, <code>, <em> o <strong> en los comentarios.

(necesario)

(opcional)