Los navegadores web modernos y los sistemas de administración de contenido optimizan las imágenes para mostrarlas en cualquier entorno. Sin embargo, es mejor preparar imágenes que estén optimizadas para cada posible factor de forma y ubicación en la que puede aparecer una imagen. Concéntrese en tres cosas: resolución de imagen, tamaño y espacio de color.
Espacio de color en las imágenes
Los diseñadores gráficos se basan en dos espacios de color primarios. Un espacio de color es un método mediante el cual los colores primarios se combinan para formar complejos arcoíris de color.
Utilice el modo RGB cuando prepare imágenes para dispositivos móviles. Las pantallas de los monitores de computadora y los teléfonos inteligentes se basan en una combinación de píxeles rojos, azules y verdes. Esta imagen RGB está optimizada para reproducir con precisión los colores previstos en una pantalla.
Para la impresión, los diseñadores utilizan un proceso de cuatro colores, donde cada color se destila en una combinación de cian, magenta, amarillo y negro. A veces, las imágenes de cuatro colores se denominan imágenes CMYK por este motivo.
Resolución de imagen
Las imágenes, especialmente en plataformas móviles, deben tener el tamaño más pequeño posible para equilibrar la calidad con la velocidad de descarga en las redes móviles y el tamaño del archivo con los límites de datos móviles.
La mayoría de los programas, incluidas las aplicaciones Adobe Creative Cloud, admiten una herramienta Exportar para Web que muestra la imagen en varias combinaciones de resolución y compresión. Elija la imagen de mejor calidad con el tamaño total más bajo.
Tamaño de imagen en píxeles
Cada imagen debe tener el tamaño adecuado para el propósito previsto. Estos son algunos tamaños de imagen de ejemplo para usos web populares:
- Los anuncios publicitarios de Internet suelen tener 468 píxeles por 60 píxeles.
- Las imágenes de portada de Facebook deben tener 851 píxeles por 315 píxeles.
- Las fotos de perfil de Twitter deben tener 400 píxeles por 400 píxeles.
- Las imágenes para enlaces compartidos deben tener 1200 píxeles por 630 píxeles.
Cuando trabaje con fotos para propósitos específicos, verifique el lugar donde aparecerá esa foto (como un sitio de redes sociales o un blog) para verificar las dimensiones óptimas de la imagen y luego ajuste el tamaño en consecuencia para evitar estirar o recortar la imagen.
Para evitar la pixelación, apunte al tamaño real de la pantalla. Incluso si una imagen tiene las dimensiones adecuadas, si no tiene el tamaño correcto, el producto resultante puede verse pixelado si la imagen debe ampliarse para cumplir con el espacio disponible.
Acerca de las imágenes vectoriales
Las imágenes vectoriales (imágenes que calcula y dibuja el dispositivo) suelen ser más eficientes y de mayor calidad que las imágenes rasterizadas (imágenes dibujadas un píxel a la vez) porque se pueden ampliar y reducir sin afectar la calidad de la imagen. Para logotipos, dibujos lineales y gráficos simples, una versión vectorial es ideal. Los formatos vectoriales no se utilizan para las fotos.