Resolución

La resolución describe el nivel de detalle en una imagen digital y tiene dos significados distintos según el contexto. El primero son las dimensiones en píxeles (por ejemplo, 3840x2160 píxeles), que representan el contenido total de información. El segundo es la densidad de píxeles (PPI: Píxeles Por Pulgada, o DPI: Puntos Por Pulgada para impresión), que describe cuán densamente se empaquetan los píxeles en el espacio físico.

Mayores dimensiones en píxeles preservan más detalle al hacer zoom o recortar. Mayor densidad de píxeles significa que las mismas dimensiones se renderizan más pequeñas pero más nítidas en el dispositivo de salida.

• Uso web: Las dimensiones en píxeles son lo más importante. Servir imágenes dimensionadas apropiadamente para su contenedor de visualización evita el consumo innecesario de ancho de banda
• Uso en impresión: 300 DPI es el estándar de impresión comercial. Una página A4 (210x297mm) a 300 DPI requiere aproximadamente 2480x3508 píxeles
• Soporte Retina: Las pantallas 2x necesitan imágenes con el doble de las dimensiones CSS en píxeles, entregadas mediante srcset o image-set()

La mala configuración de resolución es un problema práctico común. Usar exportaciones web de 72 PPI para impresión produce resultados borrosos, mientras que servir imágenes de 300 DPI listas para impresión en la web causa retrasos severos de carga. La planificación adecuada de resolución para cada contexto de entrega es esencial para equilibrar calidad y rendimiento.