Fotografía de comida para tu sitio web: guía completa
Cómo crear y optimizar la fotografía de comida para el sitio web de tu restaurante. Cubre imágenes principales (hero), páginas de menú, secciones de galería, tamaño de imágenes y rendimiento de carga.
Las fotos de tu sitio web marcan el estándar
Tu sitio web de restaurante es el único canal que controlas por completo. A diferencia de las apps de delivery con diseños estandarizados y las redes sociales con feeds algorítmicos, tu sitio muestra tu marca exactamente como tú quieres. La fotografía de comida en tu sitio web fija el nivel de calidad con el que los clientes perciben tu restaurante.
Aun así, muchos restaurantes invierten en excelentes fotos para las apps de delivery mientras descuidan su sitio web —o peor aún, usan las mismas imágenes pequeñas optimizadas para delivery en un sitio que exige visuales más grandes y de mayor impacto—.
Tipos de fotos que necesita tu sitio web
Imagen principal (hero)
La imagen grande, de ancho completo, en la parte superior de tu página de inicio. Es la foto más impactante de todo tu sitio. Debería:
- Mostrar tu plato más vistoso o una mesa bellamente estilizada
- Tener al menos 1920px de ancho para pantalla completa
- Estar optimizada para una carga rápida (comprimida pero sin degradación visible)
- Comunicar de inmediato la personalidad de tu marca — informal, de alta gama, moderna, rústica
Cambia tu imagen principal según la temporada para mantener el sitio fresco.
Fotos de la página de menú
Si tu sitio web tiene una página de menú (debería), agrega fotos al menos a tus 10–15 platos principales. Lo ideal es cubrir cada plato con foto, pero prioriza:
- Platos insignia
- Platos de mayor margen
- Platos difíciles de imaginar solo por el nombre
- Especiales de temporada
En los sitios web, las fotos del menú pueden ser más grandes y detalladas que las miniaturas de las apps de delivery. Usa 800x600px como mínimo por plato.
Galería o escaparate visual
Una página o sección dedicada para mostrar tu comida, espacio y ambiente. Incluye:
- 10–20 de tus mejores fotos de comida
- 3–5 fotos del interior/ambiente
- 2–3 fotos que muestren la experiencia de comer (personas disfrutando la comida)
Esta galería cumple doble función: impresiona a los visitantes del sitio y le proporciona a Google contenido visual para tu perfil de empresa en Google.
Página Sobre nosotros y fotos del equipo
Humaniza tu marca con fotos de tu equipo, cocina e historia. Incluso una foto sencilla del chef o la persona propietaria aporta autenticidad que las imágenes de stock nunca logran.
Especificaciones de fotos para la web
Resolución y tamaño
| Caso de uso | Tamaño recomendado | Tamaño máximo del archivo |
|---|---|---|
| Hero/banner | 1920x1080px | 200-400 KB |
| Plato del menú | 800x600px | 80-150 KB |
| Galería | 1200x800px | 150-250 KB |
| Miniatura | 400x300px | 30-60 KB |
Formato
Usa WebP como formato principal: produce archivos más pequeños que JPEG con la misma calidad. Ofrece JPEG como alternativa para navegadores antiguos. PNG no es necesario para fotos de comida (está pensado para gráficos con transparencia).
Rendimiento de carga
Las imágenes grandes y sin optimizar son la causa más común de lentitud en sitios de restaurantes. Los sitios lentos pierden visitantes y posicionan peor en Google. Optimizaciones esenciales:
- Comprime todas las imágenes — Usa herramientas como Squoosh, TinyPNG o la optimización integrada de tu CMS
- Carga diferida (lazy loading) — Carga las imágenes solo cuando el usuario se desplaza hasta ellas, no todas a la vez
- Imágenes responsive — Entrega archivos más pequeños a móviles y más grandes a escritorios
- Entrega vía CDN — Sirve las imágenes desde una red de entrega de contenido para una carga rápida en todo el mundo
Texto alternativo (alt) para SEO
Cada foto de comida en tu sitio debe tener texto alternativo descriptivo. Esto ayuda a Google a entender tus imágenes y puede atraer tráfico desde Google Imágenes. Ejemplos:
- Bueno: 'Salmón a la parrilla con verduras asadas y salsa de mantequilla al limón'
- Malo: 'IMG_4532' o 'foto de comida'
- Malo: 'mejor foto de comida de restaurante deliciosa increíble salmón'
Mantén el texto alternativo descriptivo y natural. Escribe lo que aparece en la foto.
Fotos para el sitio web vs. fotos para apps de delivery
Tu sitio web y las apps de delivery sirven contextos distintos:
| Aspecto | Sitio web | App de delivery |
|---|---|---|
| Tamaño de imagen | Grande, alta resolución | Miniaturas pequeñas |
| Relación de aspecto | Flexible | Específica de la plataforma (cuadrada, 3:2) |
| Estilo | Puede ser más artístico/ambiental | Debe ser claro y apetecible en tamaños pequeños |
| Contexto | Explorando, considerando una visita | A punto de hacer un pedido ahora mismo |
| Fondo | Puede incluir accesorios y ambiente | Debe ser limpio y simple |
La estrategia ideal: fotografiar y mejorar cada plato una vez y luego exportar diferentes versiones para distintos contextos. Las herramientas de IA hacen esto eficiente: una foto fuente genera a la vez una versión optimizada para apps de delivery y otra con calidad para sitio web.
Estilo fotográfico por sección del sitio web
Página de inicio: aspiracional
Las fotos de tu página de inicio deben hacer que las personas quieran visitarte. Elige tus platos más fotogénicos, el mejor estilismo y las composiciones más fuertes. No es lugar para fotos utilitarias: aquí va tu mejor trabajo.
Página de menú: clara y precisa
Las fotos del menú deben representar con claridad cada plato tal como se sirve. Las personas las usan para decidir qué pedir. Aquí la precisión y la claridad importan más que la estética artística.
Galería: diversa y con atmósfera
Muestra variedad: platos distintos, ángulos diferentes, el espacio del restaurante y el equipo. La galería cuenta la historia completa de tu experiencia gastronómica.
Blog/noticias: contextual
Si tu sitio tiene blog o sección de noticias, usa fotos que añadan contexto: ingredientes de temporada, procesos de nuevos platos, resúmenes de eventos. Estas fotos pueden ser más casuales y tras bambalinas.
Errores comunes con las fotos del sitio web
Usar miniaturas de apps de delivery como imágenes del sitio web. Una miniatura de 400x400px recortada para DoorDash se ve pixelada y fuera de lugar en el hero de un sitio web. Tu sitio necesita sus propias exportaciones en alta resolución.
Sin fotos en la página de menú. Un menú solo de texto en un sitio web en 2026 es una oportunidad perdida. Los menús visuales generan mayor interacción y causan una impresión más fuerte.
Imágenes sin comprimir. Una sola foto de 5 MB puede hacer que tu página de inicio tarde más de 8 segundos en cargar en móvil. Comprime todo.
Estilo inconsistente. Fotos tomadas en momentos distintos, con iluminaciones y fondos diferentes, crean una experiencia dispareja. Procesa todas las fotos del sitio con el mismo tratamiento de estilo para mantener la coherencia.
Fotos de stock en lugar de comida real. Las personas lo notan. Las fotos de stock minan la confianza. Las fotos reales de tu comida, incluso si no son perfectas, siempre son mejores.
Primeros pasos
Si tu sitio web no tiene fotos de comida o están desactualizadas:
- Fotografía tus 15 platos principales usando luz natural o una sencilla configuración de fotografía
- Mejora con IA para una calidad y un estilo consistentes
- Exporta a resolución para web (1200 px o más de ancho)
- Añádelas a la imagen principal de la página de inicio, a la página de menú y a la galería
- Escribe texto alternativo descriptivo para cada imagen
- Comprime y optimiza para la velocidad de carga
Para sentar las bases completas de fotografía, consulta nuestra guía de fotografía de comida para restaurantes. Y para asegurar que las fotos de tu sitio web coincidan con tu presencia en apps de delivery y redes sociales, nuestra guía de branding para restaurantes cubre la coherencia visual multiplataforma.