Si te gusta, compártelo :)Tweet about this on Twitter56Share on Facebook36Share on Google+4Share on LinkedIn1Pin on Pinterest2Email this to someone

En el artículo de hoy vamos a hablar del concepto de la resolución de una imagen y cómo tenerla en cuenta en relación a la resolución de la pantalla o pantallas en las que se vaya a visualizar.

Como se puede ver en el artículo de Wikipedia del enlace anterior, según el medio, el concepto de resolución se entiende de diferentes formas, pero en todas ellas se trata en definitiva del grado de detalle con el que se aprecia la imagen.

Esto en una imagen digital se traduce básicamente a cuántos puntos se visualizan en qué espacio y se mide habitualmente con la medida de puntos por pulgada.

Resoluciones de pantalla típicas y tipos de resolución

En el caso de las imágenes digitales se relaciona estrechamente con las dimensiones, cuanto mayores sean, mayor podrá será el detalle de la imagen sobre una misma superficie, de hecho es habitual que los términos de resolución y dimensiones se utilicen indistintamente.

resoluciones de pantalla de ordenador

Resoluciones habituales en monitores de ordenador y sus diferencias relativas – hacer clic para ampliar la imagen

En una pantalla de ordenador o televisión la idea es similar, existe además una larga serie de dimensiones estándar de resolución de pantalla entre las cuales habría que destacar los formatos de 1024×768, 1280×1024 y 1366×768 puntos como formatos de pantalla de ordenador más habituales y los formatos de televisión de alta definición (1280×720 en el caso de HDready y 1920×1080 en el caso de Full-HD). En los smartphones actuales son muy habituales dimensiones de pantalla de 320×240 (gama media/baja), 800×480 (muy típico en Android) y 960×640 (IPhone 4). En combinación con el tamaño de la pantalla en pulgadas determinará la resolución de la misma.

Lo que determinará nuestra percepción subjetiva de la calidad de la imagen será la relación entre las dimensiones o resolución de la imagen, la resolución de la pantalla utilizada y el tamaño con el que se muestra la imagen.

En la imagen inferior podemos ver como se visualiza la letra “R” primero con una resolución muy mala. Esto es porque se visualiza una imagen con unas dimensiones muy pequeñas, 20×20, sobre una superficie grande en la pantalla. Es decir, en el espacio que ocupa la imagen la pantalla es capaz de visualizar hasta 100×100 puntos, pero la imagen tan sólo tiene 20×20, se está visualizando demasiado grande para sus reducidas dimensiones, resultado en una nefasta resolución, el resultado es que vemos literalmente cada uno de sus puntos, con un resultado estético malo y desagradable.

resolución de una imagenLa siguiente imagen aún es bastante pobre, aunque ya queda mucho mejor que la anterior. Pero todavía no queda fina del todo porque aún no aprovecha las posibilidades de la pantalla. Sin embargo, la última aprovecha plenamente la resolución de la pantalla porque tiene unas dimensiones de 100×100 y ocupa exactamente 100×100 puntos en la pantalla por tanto utiliza la máxima la calidad que la pantalla puede ofrecer.

Si hubiésemos puesto una imagen más, de 200×200 puntos la calidad (el detalle) en la pantalla quedaría exactamente igual porque la pantalla no es capaz de visualizar más de los 100×100 puntos de los que dispone en ese espacio. La imagen ocuparía 4 veces más y se vería igual, un resultado absurdo.

¿Te gusta lo que estás leyendo?

¡Pues únete a una comunidad de +6.000 suscriptores!

Recibirás contenidos exclusivos para suscriptores + una copia gratis de este eBook de técnicas y trucos para hacer tus contenidos irresistibles.

×
¡Buenas! ¿Me dices tu nombre?

Un placer conocerte :-)

Apuntáte aquí y recibirás gratis una copia del eBook.

Además, (sólo si lo deseas) podrás configurar tu suscripción para: recibir también trucos & consejos exclusivos, avisos de nuevos posts, invitaciones a webinars gratuitos y avisos de nuevos cursos.

El problema de la fotografía digital

Una de las consecuencias de la gran evolución de fotografía digital ha sido la mala práctica de utilizar imágenes de altísimas resoluciones tal cual en Internet, con todo lo que eso implica.

Una cámara digital de gama media como lo puede ser, por ejemplo, la CanonEOS 550D, llega a resoluciones de hasta 5184×3456 puntos (18 megapixels), muchísimo más de lo que cualquier pantalla de ordenador o teléfono móvil es capaz de visualizar.

Una pantalla plana típica de ordenador portátil de 1366×768 pixels tiene una resolución de aproximadamente un megapixel (1366*768 = 1049088 puntos), por tanto, una imagen de esta cámara sería 18 veces mayor de lo que esta pantalla puede visualizar, desperdiciando de manera absurda recursos de almacenamiento y ancho de banda de acceso a Internet.

Conclusiones

Como regla general se puede decir que no tiene sentido utilizar imágenes con una resolución mayor de 1 megapixel en Internet. Si estamos usando imágenes que superan este tamaño deberíamos reducirlas antes de subirlas a ninguna parte en Internet.

Descargar, por ejemplo, una imagen de 10 megapixels (pongamos que ocupa 5 megabytes) por una línea ADSL con un ancho de banda (velocidad) de 10 mega bit por segundo en la práctica tardaría como mínimo unos 10 segundos.

Parece una cifra razonable, pero ¿qué pasaría si estamos navegando por una página con decenas de fotos de ese tamaño? Imaginemos, por ejemplo, un hilo de discusión en un foro de aficionados del motor que intercambian fotos de sus coches, se podría llegar a tardar minutos en cargar la página con las fotos y eso se vuelve insoportable.

En definitiva, trabajar con resoluciones altas tiene sentido, sobre todo, para los profesionales y para conservar imágenes importantes (de acontecimientos familiares, etc.) con un máximo de calidad, por ejemplo, para su impresión en tamaños grandes o para un posterior tratamiento profesional de las mismas.

Pero no tiene sentido utilizar estas resoluciones tan altas en Internet y utilizarlas puede crear muchas molestias por la lentitud que provocan.


Actualización (30/06/2012): Después de publicar este artículo publicamos también en nuestro canal YouTube, Ciudadano 2.0 TV, este vídeo-tutorial que te enseña cómo puedes reducir el tamaño de una imagen o incluso, de una tacada, de un lote de imágenes.


http://youtu.be/fHlKnob0no0

Si te gusta, compártelo :)Tweet about this on Twitter56Share on Facebook36Share on Google+4Share on LinkedIn1Pin on Pinterest2Email this to someone
Raquel Rubín

Raquel Rubín

Soy confundadora y autora de este blog al que me dedico como hobby. Aunque no soy una experta en nuevas tecnologías, siempre me ha gustado la formación y difusión, y me ilusionan los proyectos como ésto que es la principal razón para la creación de este blog. En este sentido, aparte de publicar puntualmente posts, en este blog me ocupo sobre todo, de la gestión, la revisión de los contenidos y el trabajo de backoffice.
Raquel Rubín

¿Te ha gustado esta lectura?

¡Pues únete a una comunidad de +6.000 suscriptores!

Recibirás contenidos exclusivos para suscriptores + una copia gratis de este eBook de técnicas y trucos para hacer tus contenidos irresistibles.

×
¡Buenas! ¿Me dices tu nombre?

Un placer conocerte :-)

Apuntáte aquí y recibirás gratis una copia del eBook.

Además, (sólo si lo deseas) podrás configurar tu suscripción para: recibir también trucos & consejos exclusivos, avisos de nuevos posts, invitaciones a webinars gratuitos y avisos de nuevos cursos.

La gente agradece los buenos contenidos, comparte este post con tus amigos:

Una respuesta a Usar las resoluciones adecuadas para tus fotos e imágenes

  1. Pequeños grandes detalles que mejoran la vista, agilizan la navegación y permiten mas visitantes a nuestras páginas. Gracias Raquel Rubin

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

Importante: Usa como nombre tu nombre personal, no el de tu web o tu empresa. Si quieres promocionar tu web, dispones del campo de sitio web para ello.

*

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

Current ye@r *

 

Cláusula de privacidad:

En cumplimiento de lo establecido en la Ley Orgánica 15/1999, el 13 de diciembre, de Protección de Datos de Carácter Personal, te informamos que mediante la cumplimentación del presente formulario estás dando el consentimiento expreso a que sus datos personales queden incorporados y sean tratados en un fichero de Ciudadano 2.0 con la finalidad de poder gestionar tu solicitud. El fichero será gestionado por el responsable de fichero que se indica en nuestro documento de aviso legal y política de privacidad.

Asimismo, salvo que manifiestes expresamente lo contrario, se podrán utilizar tus datos personales para mantenerte informado de noticias y novedades relacionadas con nuestros servicios.

Te garantizamos que bajo ningún concepto, estos datos serán compartidos o cedidos a terceros y te informamos de la posibilidad de que ejerzas los derechos de acceso, rectificación, cancelación y oposición a la recogida de tus datos de carácter personal mediante correo electrónico o bien directamente mediante los enlaces de baja automática contenidos en todas las comunicaciones enviadas por Ciudadano 2.0, o bien, mediante el formulario de contacto de nuestra web.

Estadísticas de tráfico de Ciudadano 2.0