Resolución y puntos por pulgada

El concepto resolución es un concepto muchas veces mal interpretado, en buena medida porque es un concepto que se aplica a diversos escenarios, pero en cada escenario tiene un significado un poco diferente.

Revisemos el siguiente panorama; digamos que cambias de casa y compras una espectacular mansión a las afueras de la ciudad, esta casa tiene un baño inmenso y deseas colocar los azulejos para formar una imagen en las paredes de ese baño. Si cada azulejo es de 20 x 20 cms es posible que la imagen que deseas no se vea tan definida como quieres, como no deseamos aumentar el tamaño físico del baño entonces otra opción sería que los azulejos sean de menor tamaño 10 x 10 cms con lo que aumentamos la definición de la imagen mostrada. Esta es una forma sencilla de entender el concepto resolución, a mayor cantidad de puntos en un área mayor definición, dicho esto revisemos la siguiente imagen.

Imagen simulada - Entre más pequeños los azulejos, más definición encontraremos a simple vista, ello implica que si usamos más cantidad de azules en el mismo espacio, la definición será mayor, de manera contraria, si usamos azulejos más grandes, la imagen perderá definición

Dicho de otra manera, la resolución de imagen está dada por la cantidad de puntos por pulgada (es la medida común, pero puedes pasar las medidas a cm, pero no es un estándar) y la "calidad de impresion" estaría dada también por la cantidad de puntos usados al imprimir en un área.

Resolución de imagen, resolución de pantalla y de impresión.

Una imagen digital posee un atributo llamado resolución de imagen, medida normalmente en puntos por pulgada (dpi dot per inch en inglés) que significa la cantidad de puntos que existen por cada pulgada de su tamaño físico de imagen.

Nota: una pulgada es equivalente a 2,54 cm

Pensemos lo siguiente, digamos que tenemos una imagen de 2.000 pixeles de ancho por 1.500 pixeles de alto, estaríamos determinando la cantidad de pixeles que componen la imagen - si realizas la multiplicación simple, te dará 3.000.000 de pixeles usados, recuerda que 1 millón de pixeles se denomina como 1Mp o un mega pixel, estaríamos hablando de una imagen de 3 Mp en términos de puntos que la componen.

Por otro lado, el computador para mostrar la imagen utiliza los pixeles, un pixel es la unidad más pequeña de luz que compone una imagen mostrada en una pantalla, es decir, nuestro monitor está dividido en miles y miles de pixeles que de acuerdo a lo que tengan que mostrar estarán activos con algún color. Esto es independiente del tamaño físico de tu pantalla que para nuestro ejemplo digamos que es de 20 pulgadas.

Digamos que quisiéramos mostrar una imagen en tu pantalla de 20 pulgadas de ancho x 15 pulgadas de alto, pero cada pixel fuera de 1x1 pulgada de ancho, entonces es posible que solo pudieras visualizar 20 pixeles de ancho por unos 15 de alto, en total 300 cuadros para mostrar tu imagen. Afortunadamente los pixeles son minúsculos y están muy pegados entre sí, más o menos podrías tener casi 72 pixeles por pulgada ya que es la resolución típica de un monitor. Dicho esto, entonces si multiplicamos los 72 pixeles x 20 pulgadas de ancho podríamos ver entonces 1440 pixeles de ancho y teniendo en cuenta las 15 pulgadas de alto 1080 pixeles, con lo cual, sin usar zoom y en pantalla completa, nuestro monito de 20 pulgadas estaría mostrando en una relación 1 a 1 imágenes de 1440*1080 pixeles.

Nota: En el mercado ya es común encontrar pantallas, monitores y equivalentes con un estándar de 96 pixeles por pulgada, salvo el famoso "retina display" que multiplica la densidad de pixeles en el área, sin embargo, nos centraremos en los estándares.

Como vimos en la imagen del baño, entre más pequeños sean los puntos que componen la imagen, mayor definida se verá. Adicionalmente existe la opción de cambiar la cantidad de puntos representados en la pantalla (en el escritorio de tu Windows puedes dar clic derecho y configurar las propiedades de pantalla para aumentar la resolución) y verás tamaños como 800x600, 1024x768, 1200x1024 y así hasta 1900x1200 por citar algunas configuraciones conocidas - ten en cuenta que estás permitiendo ver más puntos por pulgada, pero que tu monitor no crecerá en tamaño, dicho de otra manera, al ver más puntos por pulgada los puntos estarán más unidos, parecerá que son mas pequeños, pero en realidad no han cambiado su tamaño en pixeles.

Imagen simulada - Arvind Balaraman - El tamaño del objeto no cambia, pero se puede aumentar la cantidad de puntos que lo componen, necesariamente se verá mayor definición.

Es obvio que aumentando estas resoluciones no estamos aumentando el tamaño físico de tu pantalla, volviendo los puntos más pequeños podremos mostrar muchos más. Esta es la razón por la cual cuando aumentamos la resolución de pantalla los objetos parecen más pequeños – porque los puntos que los representan son más pequeños – pero debemos caer en cuenta que los objetos no han perdido pixeles, es decir, la imagen de 1.000 pixeles de ancho seguirá teniendo los mismos 1.000 pixeles, solo que se verá más pequeña.

En cuanto al mundo impreso el asunto no deja de ser más interesante, siguiendo con nuestro ejemplo de imagen (2.000 pixeles de ancho por 1.500 de alto) debemos pensar entonces en qué resolución manejar para que cuando sea impresa se vea definida lo suficiente como para que se vean los detalles de esta imagen.

Ocurre que en el mundo impreso, la resolución utilizada por las impresoras va comúnmente desde los 60 puntos por pulgada - veamos que ya no son pixeles sino puntos impresos – hasta los 300 puntos por pulgada, esta última es considerada una excelente resolución impresa, se utiliza en impresos de alta calidad, aunque existen modelos de impresoras que llegan hasta los 1.200 puntos por pulgada - aclarando que muchos autores consideramos que después de 300 dpi (dot per inch - puntos por pulgada) no tiene mucho sentido aumentar la salida de impresión, incluso aunque sea "calidad fotográfica".

Presentado el panorama en impresos, si deseamos imprimir nuestra imagen de 2.000 pixeles de ancho x 1.500 pixeles de alto a una resolución de 100 puntos por pulgada nuestra imagen sería impresa en 2.000 pixeles ancho / 100 puntos por pulgada = 20 pulgadas de ancho impreso = 50,8 cms (recordar el cambio de pulgadas a centímetros). De igual manera para el alto, 1.500 pixeles a 100 puntos por pulgada son 15 pulgadas de impresión física y esto es igual a 38,1 cms, con lo cual, nuestra imagen impresa a esa resolución no cabría en una medida estándar de papel disponible en Colombia como papel carta.

Miremos el siguiente ejemplo de una letra R impresa:

Imagen - Ejemplo resolución, tomado de Wikipedia - http://es.wikipedia.org/wiki/Resolución_de_imagen - aumentando la resolución de puntos por salida, la letra se verá mucho mejor, aunque con una media de 50 puntos por pulgada impresa ya se usaba anteriormente para impresos de calidad baja.

Si tenemos un solo cuadro para representar la imagen se vería tal como la primer imagen, si vamos incrementando la cantidad de puntos para representar la imagen, esta se verá cada vez con más detalla, más nítida, menos pixelada.

Recordando la resolución base que teníamos en nuestro monitor de 20 pulgadas de ancho x 15 de alto, decíamos que podíamos tener entonces a una resolución mediana/alta 96 pixeles por pulgada, realizando la multiplicación podríamos mostrar máximo una imagen de 20 pulgadas * 96 puntos y de 15 pulgadas * 96 puntos, es decir, una imagen de 1920 * 1440 pixeles en total (siempre se determina el valor de ancho, posteriormente el alto).

Ahora, digamos que deseamos tomar una foto para convertirla en fondo de pantalla (wallpaper), para saber qué capacidad requerimos por parte de nuestra cámara fotográfica, multiplicamos estos números 1920 * 1440 , ello nos dá 2.764.800 pixeles que equivalen a que al menos nuestra cámara debería ser de 3 Mp, recordemos que cada Mp equivale a 1.024.000 pixeles y una de 2.5 Mp no alcanzaría a captar la cantidad requerida ¿conclusión? necesitamos una cámara de al menos 3 Mp.

En el panorama de las cámaras digitales, como el término millón se define como Mega en informática, podríamos decir que tenemos una cámara con una resolución de 3 Megapixeles. Es claro que con las nuevas cámaras disponibles la cantidad de puntos ha crecido considerablemente, es normal encontrar archivos de 3.600 pixeles de ancho por 2.700 pixeles de alto, aproximadamente en una cámara de 10 Mp y ya tenemos celulares que prometen 20 y 30 Mp - dicho de otra forma, generamos imágenes con un tamaño superior al requerido.

Análisis de requerimiento

Salgamos del contexto y pensemos en una página web, digamos que nos han contratado para hacer una tienda virtual y el cliente desea que se muestren 3 tipos de imágenes, un tamaño mini, un tamaño mediano para ser mostrado en una galería y un gran tamaño para pantalla completa (digamos para resoluciones de 1920*1080 - el famoso formato HD)

Wireframe básico - en azul, componentes web, en verde el tamaño medio de imágen, en amarillo, las imágenes miniatura y la intención es que una vez que el usuario haga clic en alguna de estas imágenes, se vea en pantalla completa, en este punto no tendremos en cuenta las opciones para impresión, lo común es integrarlas en un documento PDF o similar.

Nuestra imagen máxima a mostrar (no máxima para tomar la foto) es de 1920x1080, la multiplicación nos dará 2.073.600, una imagen de 2Mp máximo en pantalla, los otros tamaños podrían ser simplemente la misma imagen en tamaño diferente, por ejemplo 1/4 del tamaño original para la imagen media, es decir 480 * 270 y 1/16 para la miniatura, es decir, 120 x 68 pixeles.

Ahora, digamos que deseamos dejar un PDF para descarga de cada producto, deseamos que tenga calidad alta, es decir, que esté listo para impresión a 300 dpi, ello implica que nuestra imagen de 1920x1080 terminaría impreso en 6.4 pulgadas x 3.6 pulgadas, o su equivalente en centrímetros, 16.3 cm de ancho 9.1 cm de alto es decir, nuestra mayor imagen disponible hasta el momento, ocuparía poco más de la mitad del tamaño de una hoja tamaño carta.

En este punto podemos entonces determinar (suponiendo que deseamos que la imagen de más alta calidad en impresos debería ser mostrada del ancho total del papel carta - 21 x 29 cm) debemos entonces capturar o generar imágenes con más cantidad de pixeles.

Pasemos el tamaño carta a pulgadas, 8.3 x 11.7 pulgadas, deseamos imprimir a 300 dpi, nuestra multiplicación de 8.3 x 300 (sólo el ancho por ahora) 2.490 pixeles de ancho y debido a la relación de tamaño (puedes hacer una regla simple de 3) el alto será 1.393 pixeles, para saber entonces cuantos pixeles tenemos en total, multiplicamos y obtenemos 3.469.068 pixeles, como 1.024.000 es Mp no sería suficiente con una cámara de 3 Mp, sino al menos de 4Mp (3.5 Mp no es ofrecido por el mercado)

Llegamos al punto de desición y hemos concluido que si tenemos una cámara de 4 Mp al menos - nada difícil teniendo en cuenta la oferta del mercado y los costos - ya podríamos iniciar este proyecto. No necesitaríamos teóricamente invertir en una super cámara costosa.

¿Por qué entonces tenemos cámaras con 10, 20, 30 y 50 Mp en el mercado? - simple, porque si tienes más Mp disponibles, a los artistas de edición gráfica en mapas de bits que usan herramientas como Photoshop o sus equivalentes, les quedará más fácil realizar ajustes, retoques, etc. Pero vale la pena recalcar, para la web, finalmente en nuestro proyecto, incluyendo impresión en alta calidad, sería suficiente la versión de 4Mp.

Resoluciones recomendadas

En este punto es bueno entonces recomendar algunas de las resoluciones comunes, para que sepas que acciones tomar de acuerdo a los estándares utilizados.

Hemos determinado que la cantidad de pixeles de una imagen no es alterada por la resolución, los puntos que la componen siempre son iguales, lo que varía es la resolución a la que es mostrada o impresa, lo que hace que se vea más pixelada o más detallada. Es deber entonces del usuario utilizar una correcta resolución de salida buscando el mejor resultado, no siempre es necesario tener la mayor resolución para lograr este efecto.

Comencemos entonces por las pantallas convencionales, por los contenidos que deben ser mostrados en la web o en dispositivos móviles, video proyectores, tablets, etc. La teoría nos dice que la resolución recomendada es de 72 pixeles y que si se desea alta calidad en pantallas entonces subiremos a 96 pixeles por pulgada.

Generar imágenes más grandes de lo necesario generará archivos con mayor peso, si trabajarás para la web o deseas imágenes optimizadas para una aplicación o móviles, lo mejor será entregar imágenes acordes al tamaño requerido para su uso.

¿Qué ocurre entonces cuando tengo una imagen a 300 pixeles por pulgada y lo visualizo en una pantalla a 96 pixeles por pulgada? Las pantallas no mostrarán cambios entre una imagen de 96 o una de 300 pixeles por pulgada, el usuario tampoco podrá ver la diferencia, esto nos lleva a deducir que si subes innecesariamente la resolución de una imagen que va a ser visualizada en un monitor, lo único que lograrás es hacer archivos con tamaños más grandes de lo requerido - dicho de otra manera, no tiene sentido aumentar la resolución más allá de 96 dpi si se va a usar en dispositivos de luz (pantallas, móviles, etc).

En cuando a impresión el asunto definitivamente si cambia, debemos saber de antemano cual es la calidad de impresión y papel que va a ser utilizado, ya que si utilizamos una resolución muy alta, pero el sistema de impresión es bajo, es posible que las imágenes impresas salgan con mucha tinta – mojadas – y por lo tanto dificultará el secado de la tinta y la impresión general.

Si deseamos trabajar con impresión de baja calidad como un volante, periódicos convencionales, la resolución a trabajar va desde los 60 puntos por pulgada hasta los 120 puntos por pulgada.

Para el caso de impresión en calidad media, como un volante a color en un buen papel hasta revistas de gama media, la resolución recomendada es de 120 a 200 puntos por pulgada.

Finalmente para brochures, catálogos a color y revistas en papel satinado y con buen gramaje (grosor) lo ideal es utilizar resoluciones desde 200 a 300 puntos por pulgada. Esto hará que la calidad sea lo suficiente para este tipo de impresiones.

Anteriormente nombrábamos proyectos especiales que podrían ser impresos hasta 1.200 puntos por pulgada, en este rango (300 a 1.200) es mejor ponerse de acuerdo con el impresor antes de subir injustificadamente una resolución de una imagen, pero se reitera que es muy poco común y que comúnmente será un gasto inecesario.

¿Qué otros aspectos debo tener en cuenta? Por lo general es mejor tener una imagen para impresión a 300 dpi (dot per inch, puntos por pulgada) y bajarla a 100 dpi porque así lo requiere el trabajo, el proceso será eliminar puntos innecesarios sin pérdida de calidad, sin embargo, el proceso inverso, subir una imagen de 100 dpi a 300 dpi es una labor de software en donde se “inventarán” pixeles de donde no hay, es decir, aunque el software lo haga muy bien, realmente se estarán creando pixeles calculados y no necesariamente el resultados será “subir la calidad”.

De igual manera, tener imágenes de menor cantidad de puntos y aumentar su tamaño generará después de un factor de tamaño, el famoso efecto "pixelado".

Y para finalizar ten en cuenta que no siempre es necesaria la mayor resolución, en el caso de un afiche de gran tamaño que va a ser visualizado a una distancia de al menos un metro, una resolución de 100 dpi será suficiente ya que el ojo humano no distinguirá la diferencia y es posible que los costos de impresión si sean menores.

Preparación de archivos, resoluciones de salida

En este punto, vamos a revisar algunos consejos claves:

Los diseños que se realicen pueden tener varios archivos de salida, por ejemplo si se toma una foto es posible que lo recibas en formato JPG o RAW (ver más adelante formatos de mapas de bits), luego tal vez utilices software como Photoshop – que posee formato PSD y soporta capas y otra información de diseño – pero al enviar el archivo a impresión tal vez sea necesario aplanar todas las capas, unirlas y entregarlas en formato TIFF o PNG o PDF.

El punto es que es importante conocer cada formato, sus limitaciones, ventajas y ámbito de uso ya que cada uno tomará importancia en un momento dado. Al tomar la foto, la cámara digital no requiere guardar capas, mientras que para tu edición es casi una obligación, pero al impresor es posible que le interese la información de los canales de la imagen (CMYK por ejemplo) o simplemente una imagen que soporte transparencia y capas como el caso de TIFF. No dudes en guardar siempre los archivos originales como copias y hacer un backup antes de pasar una imagen de un formato a otro, ya que en esa transición es posible que se elimine información que posteriormente tal vez no puedas recuperar.

En cuanto a resolución, es importante poder trabajar siempre con la imagen de mayor tamaño y resolución posible ya que la edición será mucho más sencilla sin importar si para el archivo de salida se requiera un tamaño en pixeles bajo y una resolución menor a la trabajada, la ventaja de mantener los archivos originales y en la resolución más alta disponible es que siempre podremos seguir editando y generando copias, mientras que no hay nada más frustrante que tener que editar un archivo que no tiene la calidad necesaria.