Guía · 8 min
Calidad y dimensiones: elegir el tamaño correcto para la web
Cómo equilibrar nitidez, peso y encuadre según el lugar donde aparecerá cada imagen.
Actualizada el
Empieza por el espacio de destino
El tamaño correcto nace del componente, no de la cámara. Si una tarjeta nunca supera 640 píxeles de ancho, publicar un archivo de 4000 píxeles obliga al visitante a descargar datos que no verá. Mide el ancho máximo del componente y considera pantallas de alta densidad cuando la imagen lo requiera.
Una regla de trabajo razonable consiste en exportar hasta el doble del ancho CSS para imágenes importantes en pantallas densas. No siempre hace falta: miniaturas, fondos con poco detalle y conexiones lentas pueden beneficiarse de variantes más pequeñas.
Calidad no significa porcentaje visual
El control de calidad de un codificador representa un compromiso interno; 80 no equivale a conservar exactamente el 80% de la información. Dos imágenes exportadas con el mismo valor pueden tener resultados muy distintos. Una foto con follaje, cabello o grano necesita más información que un fondo plano.
Empieza alto, observa y baja en pasos pequeños. Detente cuando el ahorro adicional introduce defectos visibles en el tamaño de uso. Guarda la configuración junto al tipo de contenido, no como norma para toda la biblioteca.
Recorte, proporción y deformación
Cambiar la relación de aspecto exige recortar o añadir espacio; alterar solo ancho o alto deforma el contenido. Para productos, protege la silueta y deja margen coherente. Para retratos, comprueba rostro y mirada. ZoePic recorta desde el centro en los modos que requieren una proporción, de modo que debes revisar sujetos fuera del centro.
- Original: conserva proporción y dimensiones.
- Tamaño popular: crea una salida exacta y puede recortar.
- Relación de aspecto: adapta el encuadre sin ampliar imágenes pequeñas.
- Personalizado: usa ancho y alto exactos; comprueba el recorte.
Ejemplo de decisión
Una fotografía de producto de 3000 × 2000 px que se mostrará a 720 px puede exportarse a 1440 × 960 px para pantallas densas. Si la tarjeta usa una proporción 4:5, conviene preparar ese recorte de forma consciente y revisar que el producto no quede cortado. Después se compara calidad y peso.
Registra el ancho, proporción y calidad usados para que el siguiente lote mantenga consistencia. La optimización profesional se parece más a una receta por componente que a pulsar un botón universal.
Ponlo en práctica
Abre el conversor, procesa un lote pequeño y compara cada resultado antes de publicar.
Abrir conversor