Imagen Digital: píxel, resolución y formatos

Videos recomendados

¿Qué es una imagen digital?

Formatos de imagen

Teoría esencial

¿Qué es una imagen digital? Es una matriz de píxeles (cuadrícula) en la que cada píxel guarda un valor de color. A más píxeles, más detalle.

¿Qué es un píxel? La unidad mínima de una imagen. No “existen” físicamente: son datos que la pantalla traduce a luz mediante subpíxeles RGB (rojo, verde, azul).

¿Cómo “vemos” los píxeles? De lejos, el ojo promedia; de cerca, ves los bloques (efecto “serrucho” o aliasing). Las pantallas usan subpíxeles para mezclar colores.

Resolución describe cuántos píxeles hay (por ejemplo, 1920×1080) y/o cuántos caben por pulgada (PPI). DPI es de impresión (puntos de tinta por pulgada).

Relación de aspecto es la proporción ancho:alto (16:9, 4:3). Afecta encuadre y encaje del contenido.

Profundidad de color (bits) define cuántos colores se pueden representar (8 bits por canal = 24 bits RGB ≈ 16,7 millones).

Compresión puede ser con pérdida (JPEG) o sin pérdida (PNG). Con pérdida reduce tamaño sacrificando detalle fino.

Vector vs mapa de bits: el vector se escala perfecto (SVG), el mapa de bits (JPG, PNG, BMP) se pixela si lo agrandas.

Tipos de imagen (formato y uso)

Tipo/Formato Características Usos típicos
JPEG/JPG Con pérdida, 24 bits, sin transparencia. Fotos, web, tamaño pequeño.
PNG Sin pérdida, 24–32 bits, alpha (transparencia). Logos, UI, gráficos con texto.
GIF 256 colores, animación simple, transparencia 1 bit. Memes, iconos animados.
WEBP/AVIF Alta compresión, soporta transparencia y animación. Web moderno (mejor tamaño/calidad).
SVG (vector) Escala sin perder calidad, texto editable. Iconos, logos, diagramas.
BMP/TIFF Pesados, sin (o con) compresión; TIFF puede ser sin pérdida. Escaneo, archivo, imprenta.

Resolución y tamaño

Paint (básico y útil)

Color: RGB y compañía

RGB (rojo, verde, azul) es el modelo aditivo de las pantallas. CMYK (cian, magenta, amarillo, negro) es sustractivo para impresión.

Colores básicos en pantalla: R, G, B y combinaciones (rojo+verde = amarillo; rojo+azul = magenta; verde+azul = cian; los tres al máximo = blanco).

Las pantallas tienen subpíxeles RGB; variando su intensidad crean millones de colores.

Diccionario clave

Píxel
Unidad mínima de una imagen; almacena un color.
Resolución
Medida del detalle (píxeles totales) o densidad (ppi/dpi).
Mapa de bits
Imagen formada por píxeles.
Vector
Gráfico definido por fórmulas; escala perfecto.
Alias/anti-alias
Bordes en “escalera” y técnica para suavizarlos.
Profundidad de color
Bits por píxel/canal; determina cuántos colores hay.
Transparencia
Canal alfa controla opacidad.
Compresión
Algoritmo para reducir tamaño (con o sin pérdida).
Relación de aspecto
Proporción ancho:alto de una imagen o pantalla.
Metadatos
Datos incrustados (EXIF: cámara, fecha, etc.).

Ideas de actividad y proyecto

Cuestionario (10 preguntas aleatorias)

Banco de 50. Marca y envía. Te doy explicación inmediata y un resumen final.