Imagen generada automáticamente por Lorem Pixum

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 Pixum

Lorem Pixum 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://lorempixum.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://lorempixum.com/500/500/food

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

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

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

http://lorempixum.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 similares

• Placekitten 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/
• Placehold.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/
• Ipsum 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:

• RandomText, generador aleatorio de Lorem Ipsum y textos de muestra.
  http://www.randomtext.me/
• Lorem ipsum for webdesigners. Generador de textos aleatorios a partir de obras literarias de autores conocidos.
  http://www.blindtextgenerator.com/lorem-ipsum
• Quijotipsum, generador de texto basado en El Quijote de Cervantes: http://www.quijotipsum.com/

Desde sus inicios la web se ha ido desarrollando muy rápidamente hasta convertirse en algo imprescindible en nuestras vidas, pero a pesar de que la historia de Internet y el diseño web es muy corta (la primera página web se publicó hace 20 años), es difícil imaginarse cómo serán los próximos 20 años y qué avances tecnológicos iran apareciendo.

Este gráfico creado por KISSmetrics muestra esta evolución y cómo ha ido cambiando el diseño web a partir de las diferentes tecnologías que lo hacen posible.

Desde hace tiempo, la manera de anunciar en una web la disponibilidad de contenido en versión RSS me parece absurda y, sobre todo, poco clara para quien aun no sabe muy bien en qué consiste este sistema de avisos.

Cada vez es más frecuente encontrar páginas web que ofrecen sus contenidos por RSS, pero generalmente la manera de comunicárselo al usuario es pésima. ¿Quién pretendemos que entienda cosas como “Sindicación de contenidos RSS“, “Suscribirse a entradas Atom“, “Fuente de alimentación RSS” o simplemente “RSS 2.0“?

Internet está lleno de páginas que intentan explicar al usuario medio qué es RSS y por qué es tan útil. Pero además de explicarlo, los que creamos páginas webs tenemos que mejorar y adaptar nuestra manera de comunicar este tipo de mensajes.

Sugiero algo más descriptivo, que no asuste al usuario. Palabras como “sindicación”, “suscripción”, “fuente de información”, “Atom” o “RSS” las entendemos los que vivimos y nos movemos desde hace tiempo en internet, pero la gran mayoría de personas no solo no lo entiende, sino que a veces asocia la suscripción con un pago mensual (procedente del mundo de las revistas, periódicos y publicaciones en papel).

Estas son mis sugerencias:

• Actualizaciones gratuitas
• Actualizaciones RSS
• Seguimiento de contenidos por RSS
• Suscripción gratuita
• Recibe nuestros contenidos por RSS o por email
• Recibe nuestras noticias gratuitamente

Ni siquiera intento traducir “feed”. No me parece necesario en español (especialmente porque nunca he encontrado ninguna palabra que me parezca adecuada; tal vez “hilo” es la que más posibilidades podría tener)

El diseño de páginas web y su desarrollo no consiste solo en que todo se vea muy bonito y profesional. Ni siquiera en que todo funcione a la perfección. Hay que ir un paso más allá y ponerse en la piel de la persona que va a utilizar esa web, el usuario que pulsará los botones y enlaces que hemos creado. Hay que hacer un ejercicio de empatía y ver si realmente la usabilidad está bien planteada.

Le he tenido que explicar a tanta gente lo que es RSS que estoy convencido de que la inmensa mayoría está perdida, no lo entiende, y con frases como las que comentaba más arriba, los que creamos páginas web no ayudamos lo más mínimo.

Esta es una pequeña recopilación de libros que he leído últimamente sobre diseño web, CSS, WordPress, ExpressionEngine y tecnología e internet en general. Eso sí, prácticamente todos son en inglés. La mayoría de libros sobre diseño web y tecnologías ni siquiera llegan a traducirse al español, pero como siempre digo, si alguien quiere aprender diseño web, lo primero que tiene que hacer es aprender inglés.

Iré ampliando esta lista según vaya comprando y leyendo más libros.

Libros sobre CSS

• CSS Mastery: Advanced Web Standards Solutions. Andy Budd, Simon Collison & Cameron Moll / Friends of ED
• Transcending CSS: The Fine Art of Web Design. Andy Clarke, Molly E. Holzschlag, Aaron Gustafson & Mark Boulton / New Riders Press
• The Zen of CSS Design. Visual enlightenment for the web. Dave Shea & Molly E. Holzschlag / New Riders
• Designing CSS web pages. Christopher Schmitt / New Riders
• CSS Práctico. Richard York. Anaya Multimedia/Wrox

Libros sobre diseño web y diseño en general

• Sexy web design. Elliot Jay Stocks / Sitepoint
• Web Standards Creativity. Innovations in web design with XHTML, CSS and DOM scripting. Cameron Adams, Mark Boulton, Andy Clarke, Simon Collison, Jeff Croft… / Friends of ED
• Designing with web standards. Jeffrey Zeldman / New Riders
• Principles of beautiful web design. Jason Beaird / Sitepoint
• The Art & Science of Web Design. Jeffrey Veen / New Riders
• The laws of simplicity. Design, technology, business & life. John Maeda / The MIT Press
• Manual de producción gráfica. Recetas. Kaj Johansosn, Peter Lundberg & Robert Ryberg / Editorial Gustavo Gili
• Diseñar con y sin retícula. Comprender la estructura y la libertad en el diseño, pasando de la teoría a las aplicaciones en el mundo real. Timothy Samara / Editorial Gustavo Gili
• Web development solutions, AJAX, APIs, libraries and hosted services made easy. Christian Heilmann & Mark Norman Francis/ Friends of ED
• Hardboiled Web Design, de Andy Clarke. Five Simple Steps
• Professional Web Design, de Smashing Magazine. Smashing eBook Series

Libros sobre WordPress y ExpressionEngine

• Professional WordPress. Design and development. Hal Stern / Wrox Publishing
• ExpressionEngine 2.0: A Quick-Start Guide. Ryan Irelan / Pragmatic Bookshelf
• WordPress Plug-in Development. Vladimir Prelovac / Packt Publishing
• Building Websites with ExpressionEngine 1.6: A clear, concise, and practical guide to creating a professional ExpressionEngine website. Leonard Murphy / Packt Publishing
• WordPress Theme Design. A complete guide to creating professional WordPress themes. Tessa Blakeley Silver / Packt Publishing
• Smashing WordPress. Beyond the blog. Thord Daniel Hedengren / Smashing Magazine

Libros sobre internet y tecnología

• Todo va a cambiar. Tecnología y evolución, adaptarse o desaparecer. Enrique Dans / Ediciones Deusto
• The future of the internet – And how to stop it. Jonathan Zittrain / Yale University Press
• The world is flat. A brief history of the twenty-first century. Thomas L. Friedman / Farrar, Straus & Giroux
• The Google Story. Inside the hottest business, media and technology success of our time. David A. Vise and Mark Malseed / Delta
• Everything is miscellaneous. The power of the new digital disorder. David Weinberger / Holt

Libros sobre jQuery

• Learning jQuery 1.3. Better interaction design and web development with simple javascript techniques.. Jonathan Chaffer & Karl Swedberg / Packt Publishing

Próximos libros…

Y para acabar, estos son los libros que próximamente pasarán a formar parte de mi biblioteca (si los puedo conseguir):

• HTML5 for web designers, Jeremy Keith / A book apart
• Cognitive Surplus: Creativity and Generosity in a Connected Age, Clay Shirky / The Penguin Press HC
• Ordering Disorder: Grid Principles for Web Design: Grid Principles for Interaction Design, Khoi Vinh / Voices That Matter
• Power Friending: Demystifying Social Media to Grow Your Business, Amber Mac / Portfolio Hardcover

Como ya publicamos hace un par de días en la web que protagoniza esta entrada, el sábado pasado se celebró la ceremonia de entrega de premios del ‘Premi Web 2008‘, un concurso anual que organiza en Mallorca BalearWeb y que está patrocinado por la Dirección General de Política Lingüística, la Regiduría de Cultura, Patrimonio y Política Lingüística del Ayuntamiento de Palma y la Fundación Pilar i Joan Miró.

En esta edición, Culturapollença.com fue premiada con el primer premio absoluto, y también con el premio a la mejor web en la categoría de comunicación. No nos lo esperábamos, porque la web lleva en marcha sólo seis meses, pero parece que al jurado le ha gustado mucho nuestra idea de publicar toda la actividad cultural del municipio donde vivimos: conciertos, exposiciones, conferencias, fiestas, mercados, cursos y hasta recetas de Mallorca.

La ceremonia de entrega de premios y el acto de clausura tuvo lugar en la Fundación Pilar i Joan Miró de Palma, con la presencia de unas cien personas, además de la directora de esta Fundación, Magdalena Aguiló, la Regidora de Cultura del Ayuntamiento de Palma, Nanda Ramon, y la Directora General de Política Lingüística, Margalida Tous.

Otra web de la casa que se llevo premio fue Mondaventura.com, un proyecto para una empresa de Pollença dedicada al deporte de montaña y el turismo alternativo en Mallorca que justamente acabamos de rediseñar. El jurado del concurso premió a Mondaventura.com como la mejor web en la categoría de deportes.