Resolución frente a rendimiento para imágenes de portafolio

Las guías genéricas aún hablan como si WebP fuera exótico. Para fotografía y stills de alto detalle, AVIF suele quedar notablemente más pequeño que WebP a calidad visual comparable; WebP sigue siendo el default moderno amplio cuando AVIF no está disponible. JPEG es para clientes incómodos y bordes legacy, no para tu cuadrícula pública primaria.

En ArtInStack, Cloudflare Image Resizing sirve `format=auto` para que el edge elija AVIF o WebP desde un master, no una carpeta de variantes de códec exportadas a mano. Los encoders cambian año a año; trata las afirmaciones de «30–50% más pequeño» como orientativas. Lo que importa para un portafolio es la calidad perceptual con un presupuesto de bytes que la página pueda permitirse.

El ancho de layout son píxeles CSS. La nitidez del sensor en el dispositivo se acerca a ancho CSS × devicePixelRatio. Ejemplo: una columna de galería de teléfono a 375 CSS px y DPR 2 debería respaldarse con un asset cerca de 750 px en el lado largo para ese slot, no tu master de 2400 px volcado en cada etiqueta img.

Por eso un «export retina» que solo existe como un JPEG enorme falla dos veces: desperdicia ancho de banda en thumbs y aún no se describe al navegador como un set responsive. srcset / sizes (o un equivalente de plataforma) es cómo se elige el candidato correcto.

Los blogs de desarrolladores citan un solo número de héroe. Los portafolios necesitan una matriz pequeña. Usa estas como bandas de planificación y deja que ArtInStack genere variantes. No mantengas cinco carpetas a mano para siempre.

Las grids densas y los lightboxes tienen curvas de coste distintas. Un ajuste «comprimir a JPEG 80%» no puede servir con honestidad a ambos.

ArtInStack parte el trabajo a propósito: las grids de portafolio prefieren un thumbnail generado (una imagen eficiente por mosaico) para que una página de 40 imágenes se quede barata y rápida. Cuando un visitante abre un frame, las vistas de lightbox y detalle de foto tirán del master mediante Cloudflare Image Resizing (formatos modernos vía `format=auto`, con candidatos de ancho responsive). La nitidez aparece donde alguien mira de verdad.

ArtInStack extrae y almacena EXIF (incluido GPS cuando está presente) para funciones de Media y mapas. La visualización pública de ubicación es una política de publicación (redactar u ocultar por portafolio), no una promesa de que cada derivado CDN borre en silencio la huella.

Las ubicaciones de sesión de cliente en tags GPS siguen siendo un problema de privacidad para páginas públicas. Decide qué deben ver los visitantes. La accesibilidad pertenece al alt text que escribes, no a metadatos de cámara sobrantes. Copyright no es «lo que del EXIF sobrevivió al hop». Pon la atribución en créditos visibles, watermarks que elegiste y términos legales.

Subes un master en el que confías. ArtInStack conserva ese master, genera un thumb ligero para escanear la cuadrícula y usa transformación de imagen de Cloudflare desde el master cuando un visitante abre el trabajo. Jerarquía en una página pública: mosaicos de grid → thumb primero; lightbox / detalle de foto → candidatos Cloudflare desde el master. Tú sigues eligiendo la calidad del master y la intención de recorte. No deberías mantener tres carpetas de export a mano.

Bueno: derivar assets públicos más ligeros desde un master del que aún eres dueño. Malo: un host recomprime tu subida en un «JPEG web» suave, lo llama optimización y aún envía ese mismo archivo a cada celda de la cuadrícula. Eso es ahorro de disco disfrazado de rendimiento. Ver El mito del almacenamiento ilimitado.

Para cómo Cloudflare Image Resizing mide transformaciones únicas (y cómo los thumbs de grid evitan quemar el precipicio del plan gratuito), lee Cloudflare Images explicado. Para elecciones de layout que cambian cuán grande es un mosaico en la página, lee La trampa del layout: relaciones de aspecto y CSS Grid. Para cuán pesada puede volverse una biblioteca en disco, usa el Estimador de almacenamiento en la nube y costes para fotografía.