La web está bien maquetada. El tipo funciona. El color es el del manual. Y aun así parece un tema premium: sonrisas de stock, manos en un portátil, un skyline que no es el vuestro. El problema no es el CSS. Es que no hay dirección de arte web. Hay un banco de imágenes y un recorte de última hora.
Una foto no es relleno. Es la prueba de que el negocio existe en un sitio concreto, con gente concreta, con un oficio que se puede ver. El banco sirve para un wireframe. No construye marca. Si la identidad se queda en el logo y las fotos las elige quien monta la página, la web habla en dos voces.
Este artículo marca criterios de foto, recorte y dirección de arte para una web a medida. El mismo oficio que trabajamos en Truman dentro de branding: no un moodboard bonito, sino reglas que se pueden encargar, producir y mantener.
Dirección de arte web: no es elegir fotos bonitas
Dirección de arte, en una web, es decidir qué se ve, desde dónde, con qué luz, a qué distancia del oficio y cómo se recorta cuando el layout cambia. No es un tablero de Pinterest. Es un sistema: tipos de plano, paleta de luz, lo que no se fotografía, y el formato que el componente va a exigir.
El banco de imágenes resuelve un hueco. No resuelve una marca. Las mismas fotos circulan en decenas de webs de servicios. El usuario no las reconoce una a una; reconoce el género: «esto podría ser cualquier clínica / cualquier consultora / cualquier industrial». Si tu identidad visual está bien hecha y las fotos son intercambiables, la marca se queda en el header.
En València lo vemos cada trimestre: negocios con oficio real —consulta, planta, redacción, obrador— y una home que parece un template de Dribbble. El desfase no se arregla con más saturación. Se arregla fotografiando lo que sois y recortándolo para la web que habéis diseñado, no al revés.
Criterios de foto antes de abrir el banco
Antes de buscar «equipo diverse office», escribe tres líneas de dirección: qué oficio se ve, a qué distancia, qué luz. «Cálido y humano» no es dirección. «Plano medio del tratamiento, luz de consulta, sin flash de techo, sin mirar a cámara como anuncio de dentífrico» sí lo es.
| Decisión | Señal | Qué implica |
|---|---|---|
| Gente real del negocio | Prioridad | Caras, manos, espacio. Aunque no sean «de campaña» |
| Stock como placeholder | Solo temporal | Vale en prototipo. En producción, se nota |
| Stock como sistema de marca | Evitar | La web se vuelve tema premium: cara, intercambiable |
| Foto de móvil sin criterio | Mejor que stock malo | Si hay luz y encuadre, gana a un banco genérico |
| Producción con brief de componentes | Objetivo | Se dispara para el hero, el retrato, el detalle |
Tres ejes que pedimos por escrito. Sujeto: el oficio, no el concepto («confianza», «innovación»). Distancia: cuerpo entero en el espacio, plano medio de la acción, detalle del material o del gesto. Luz: una familia. Si la consulta es luz fría y el retrato es golden hour de stock, el usuario percibe collage aunque no sepa nombrarlo.
Lo que no se fotografía también es dirección. En una clínica, no todo plano es publicable. En una planta, no todo rincón es representable. El brief dice el perímetro. Si no, el fotógrafo llena la tarjeta y el diseñador elige por «la que queda bien en el hueco». Eso no es arte. Es recorte de emergencia.
Recorte, formato y el hueco real del componente
La foto buena muere en un componente mal especificado. Encargáis 2000×1333 y el hero en móvil es 9:16 con texto encima. La cara queda bajo el H1 o fuera del frame. La dirección de arte incluye el recorte: zonas seguras, punto de interés, y variantes (horizontal, cuadrada, vertical) disparadas o previstas, no inventadas en CSS con object-fit: cover a ciegas.
El peso y el formato son parte de la dirección, no un leftover de desarrollo. Una foto de 4 MB en el hero no es «más calidad»: es un LCP peor y una imagen que el móvil recodifica. Dirección de arte web incluye exportar para pantalla: tamaño real del contenedor, srcset, y un recorte que no dependa de que el editor suba el RAW.
¿El fotógrafo ha visto el layout —o solo un moodboard— antes de disparar?
Dos oficios, la misma regla: clínica y medio
En Clínica Eleya la foto no puede ser el stock de medicina estética: modelo de agencia, piel de anuncio, sala que no es esa consulta. El paciente está decidiendo si se pone en unas manos. Quiere ver el espacio, el equipo, el trato. La dirección de arte aquí es cercanía real, no glamour prestado. Si la web parece un theme de clínica, da igual el logo.
En Eco de Teruel y Zaragoza el oficio es editorial. La foto es noticia, retrato de calle, archivo. Un banco de «periodista con portátil» insulta a una redacción. La dirección de arte de un medio no es uniformar todo a un filtro: es una jerarquía — portada, pieza, autor— y un respeto por la imagen que ya existe. La web sirve al periodismo. No lo decora con stock.
Cómo se nota una web de plantilla (también en la foto)
Las señales de una web de plantilla no son solo el menú y el slider. Son las fotos que el tema espera: un hero panorámico, tres cards con gente riéndose, un mosaico de logos. Si rellenas esos huecos con stock, la plantilla se confirma. Si los rellenas con oficio real pero sin recorte, la plantilla se nota igual: el layout no nació de vuestras imágenes.
En un proyecto a medida, el layout y la foto se diseñan juntos. A veces el hero no lleva foto de gente: lleva material, espacio o tipografía. A veces el equipo no es un grid de seis retratos iguales. La dirección de arte decide qué merece imagen y qué se resuelve con color y tipografía. Meter foto en todos los bloques es el reflejo del tema, no un criterio.
Encargar o producir sin que se desvíe
Un brief de dirección de arte web que funciona cabe en una página: lista de componentes (hero, card, retrato, detalle), ratio de cada uno, zona segura para texto, ejemplos de «sí» y «no», y el perímetro legal o de oficio. El fotógrafo no tiene que adivinar el CSS. El diseñador no tiene que adivinar el RAW.
Si no hay presupuesto de sesión, hay archivo: móvil bien usado, con la misma hora, el mismo sitio y un recorte acordado. Diez fotos coherentes ganan a cuarenta de bancos distintos. La dirección de arte es consistencia bajo restricción, no lujo.
He visto identidades cuidadas caerse en el primer scroll porque la foto era de todos y de nadie. La marca no vive solo en el logo. Vive en si reconoces el sitio y a la gente que trabaja ahí. Si no, has diseñado un tema. No una web.
Antes de dar por cerrada la imagen de la web, verifica esto
- ¿Hay un brief de sujeto, distancia y luz, o solo un tablero de referencias?
- ¿Las fotos de producción se dispararon (o recortaron) para los ratios del layout?
- ¿El hero en móvil conserva el punto de interés, no un trozo de pared?
- ¿Habéis evitado el stock como sistema —no solo como «una foto»—?
- ¿El equipo y el espacio se reconocen, o podrían ser de otra empresa?
- ¿El CMS guarda foco y formatos, o el editor sube un JPG suelto?
- ¿Cada bloque merece foto, o hay secciones que se resuelven con tipo y color?
- ¿La familia de luz es una, o cada página parece de un fotógrafo distinto?
Preguntas frecuentes sobre fotografía y dirección de arte en web
¿Qué es la dirección de arte en una web a medida?
Es el criterio que decide qué se fotografía, cómo se recorta en cada componente y qué queda fuera. No es elegir la foto más bonita del banco. Es un sistema de planos, luz y formatos alineado con la identidad y con el layout real. Sin eso, el diseñador rellena huecos.
¿Se puede hacer una web seria solo con fotos de banco?
Se puede publicar. Se nota. El banco vale para prototipar o para un recurso que no miente (un patrón, un detalle abstracto). Si el negocio tiene cara, espacio u oficio visible, el stock de personas y oficinas es la vía rápida hacia «tema premium». Mejor diez fotos propias coherentes.
¿Hace falta una sesión profesional sí o sí?
No siempre. Hace falta criterio. Una sesión bien briefeada ahorra meses de collage. Si no hay presupuesto, un archivo propio con la misma luz y los mismos recortes gana a un banco caro. Lo que no funciona es mezclar las dos lógicas en la misma home.
¿Quién recorta: el fotógrafo, el diseñador o el CMS?
Los tres, si cada uno sabe el hueco. El fotógrafo dispara con zona segura. El diseñador define el componente y el foco. El CMS permite ajustar sin romper el punto de interés. Si solo recorta el desarrollador con object-fit, la dirección de arte se ha quedado en el briefing.
