Presupuestos de imágenes para sitios editoriales

Un presupuesto de imágenes editoriales debe limitar lo que entrega la página, no solamente lo que sube un editor. Defina límites para imágenes principales, miniaturas y galerías, y después pruebe la página real en dispositivos representativos. Un archivo pequeño puede distribuirse mal; una compresión excesiva puede borrar la información que justifica publicar una fotografía.

Defina límites según la imagen y la plantilla

Empiece con la plantilla de artículo y la portada de sección. Cuente las imágenes de la carga inicial e inspeccione los archivos que solicita el navegador. Registre dimensiones de presentación, bytes transferidos, formato y utilidad de cada imagen para la lectura.

Una miniatura y una fotografía documental a todo el ancho necesitan criterios diferentes. Un límite único de carga no expresa esa diferencia. Conserve el original en un archivo adecuado y genere variantes de distribución, en vez de pedir que el editor sobrescriba su única fuente utilizable.

El CMS debe advertir en términos editoriales: “Esta imagen principal supera el presupuesto de la plantilla” permite actuar. Un porcentaje de compresión aislado no. Ofrezca una vista previa y un mecanismo para solicitar una excepción justificada.

Deje las decisiones de distribución en la plantilla

Genere variantes acordes con el diseño. La guía de imágenes adaptables de web.dev explica que srcset ofrece archivos candidatos y sizes describe el tamaño de presentación. Compruebe cuál solicita realmente el navegador; generar variantes no demuestra que la plantilla las utilice.

La estrategia de carga también importa. web.dev desaconseja la carga diferida de la imagen LCP, porque retrasa el descubrimiento y la carga de un posible elemento visible principal. Las imágenes más abajo en el artículo pueden seguir otra estrategia. No aplique el mismo atributo de carga a todas las fotografías por defecto.

Separe la comprobación de rendimiento de la revisión editorial. Una imagen puede cumplir el límite de bytes y aun así cortar al sujeto o volver ilegible un gráfico. Los pies, créditos y alternativas textuales pertinentes siguen siendo requisitos de publicación.

Ejemplo hipotético para una revista digital

Supongamos que una revista propone estos límites iniciales. Todas las cifras son ejemplos hipotéticos, no recomendaciones universales ni resultados de 5e Labs.

Elemento entregado	Límite de ejemplo	Excepción editorial
Imagen principal móvil	180 KB	Detalle documental importante
Miniatura de sección	45 KB	Texto o gráfico que necesita otro tratamiento
Imágenes de la carga inicial	300 KB	Ensayo fotográfico revisado

Si la imagen principal pesa 160 KB y otras cuatro imágenes cargadas de inmediato pesan 60 KB cada una, el total inicial es 400 KB. Cada archivo podría parecer razonable por separado, pero la página supera el límite propuesto. Quizá convenga diferir las imágenes secundarias, en vez de deteriorarlas todas con más compresión.

Compare la imagen comprimida con su fuente al tamaño en que se mostrará. Si el rostro del sujeto pierde calidad visible, pruebe otro encuadre o codificación antes de autorizar una excepción sin límites.

Revise las excepciones cuando cambie la plantilla

Registre quién autorizó cada excepción, por qué importaba el detalle y a qué página o plantilla corresponde. Reevalúe los presupuestos cuando cambien diseños, anuncios o dispositivos del público. Mida páginas utilizadas por editores, no solo una plantilla vacía de demostración.

Empiece con un artículo publicado: inspeccione las imágenes entregadas y proponga un presupuesto basado en esa evidencia. Una revisión de desarrollo web con 5e Labs puede convertirlo en procesamiento de archivos y reglas de plantilla que los editores no deban administrar manualmente.