16 abril, 2014

Fotografías de calidad para diseño web y fondos

En esta entrada hablaremos sobre un excelente directorio o recopilación de fotografías gratuitas, de calidad sencillamente extraordinaria. El sitio que las recopila se llama IM Free, y básicamente reúne fotografías procedentes de Flickr (de diversos fotógrafos), generalmente descargables bajo licencia Creative Commons de atribución.

Resumiendo, el sitio IM Free lo que ha hecho es recopilar una colección de fotografías de autor realmente buenas y de diversos temas, con permiso para uso comercial. Es decir, todas estas imágenes se pueden usar en nuestros proyectos de diseño de forma totalmente gratuita, con el único requisito de mencionar a su autor (consultar en cada caso).

No es habitual encontrar fotografía de esta calidad que sea gratuita, de forma que estamos ante un gran recurso de diseño. La referencia va directa a mi sección de banco de fotografías e imágenes.

Detalle de una de las fotos de paisajes o landscapes incluidas en la colección, por Booleansplit

Uso de estas fotografías en diseño web.

Es tendencia desde hace tiempo el emplear estas grandes imágenes como fondos o background de la web, cubriendo incluso la pantalla completa.

Se usa especialmente en páginas "de aterrizaje" o landing-pages, esto es, en la página principal del sitio, aunque a menudo también en el interior. De esta forma estamos ante fotografías que han de medir al menos 1600-1900 píxeles de ancho o incluso más, para cubrir los monitores de mayor tamaño y resolución.

Sobre estos fondos basados en una sola fotografía, se suele colocar un un diseño a base de tipografía, totalmente centrado. Es decir, en el mismo centro de la pantalla, tanto vertical como horizontalmente. (esto también vale para carteles y rótulos de todo tipo).

En cuanto a la temática de las fotografías, generalmente se usan los llamados landscapes, es decir, paisajes, fotos de panorámicas, de naturaleza o urbanas, pero siempre con sensación de amplitud. No obstante también se usan de otras temáticas, como veremos.

Ejemplo de fotografía panorámica con desenfoque ideal para fondo de una landing page o web de aterrizaje.

Las páginas web que están usando grandes fotografías siempre son muy minimalistas, con muy poco texto y elementos (el diseño centrado a base de tipografía que antes comenté, o tal vez un campo de búsqueda, y poco más). No les queda otro remedio, poner mucho texto con un fondo de este tipo haría que fuera difícilmente legible.

El desenfoque o blur.

Estas fotografías de fondo a menudo están desenfocadas, parcial o incluso totalmente. Esto depende de si el diseñador quiere meramente sugerir una sensación (a través de una imagen borrosa), o apuesta en cambio por la fotografía pura, sin desenfoque. En cualquier caso la fotografía de calidad casi siempre incluye desenfoque, pues dicha técnica aporta mucha calidad artística (tanto en macros para objetos muy cercanos como en fotografía panorámica).

Ejemplo de fotografía con macro y desenfoque, ideal para un fondo moderno.

En cualquier caso, como ya vimos en otro artículo, para los fondos se están empleando tanto fotografías del tipo que estamos hablando aquí como imágenes totalmente abstractas, texturas y similares, casi siempre desenfocadas como comentamos.

La excelente colección de IM Free

Bien, no me extiendo más. Si queremos hacer un diseño con fotografía de gran formato para el fondo, en esta colección encontraremos lo que necesitamos. Se incluyen temáticas de todo tipo, no sólo los habituales landscapes.

fotografia-paisaje-lanscape-fondo-desenfocado-blur-7 fotografia-paisaje-lanscape-fondo-desenfocado-blur-3 fotografia-paisaje-lanscape-fondo-desenfocado-blur-4 fotografia-paisaje-lanscape-fondo-desenfocado-blur-5

Como puede verse, hay fotografías muy buenas de temática corporativa, música y conciertos, urbanismo... De todo. Os dejo un pequeño listado por temáticas, con sus respectivos enlaces:

Cuidado que es fácil salir del sitio y entrar en la sección de "diseño web". El sitio que aquí nos interesa es:

IM Free | (parte de imcreator.com)