Si bien una imagen dice más que mil palabras, una imagen de mala calidad dirá mucho de ti como diseñador y por ende el proyecto de diseño tendrá poco éxito, pero eso lo puedes evitar si aplicas los principios básicos al formatear tus fotografías.
Notas relacionadas
3 tips sobre teoría del color para un diseño digital
Cómo sacar al genio creativo que llevas dentro: 25 formas
20 mentiras que los diseñadores les dicen a sus clientes
Canva publicó una serie de consejos que resultan ser útiles para hacer que se vea bien el diseño web al guardar correctamente las fotografías.
1. Optimiza
El rendimiento de la página web está en relación con el tamaño de las fotografías, es decir, su peso en megabytes o kilobytes. Así entre más grande sea una imagen, el sitio tardará más en cargar y los usuarios —como seguramente te ha sucedido— no son personas pacientes.
Por ello es importante encontrar el punto medio entre el tamaño real y la resolución o calidad de la imagen. .
2. La resolución
Este relaciona con el anterior. Se trata del número de píxeles que se ven en pantalla, pues ocupan un espacio (píxeles por pulgada o PPI o DPI). Las pantallas de los dispositivos actuales tienen resoluciones predeterminadas, por lo que simplifican el proceso. Se recomienda una resolución de 72 PPI y hasta 120 PPI .
Se debe evitar pixelar, es decir, que se vea borrosa, distorsionada o se pierda la calidad. Esto pasa al estirar una imagen que no está adaptada para la proporción que se utilizará en pantalla
3. Compresión
Comprimir una imagen en un programa de edición de fotos es una manera de ajustar el tamaño de resolución y archivo. En Photoshop está la opción Guardar para web y dispositivos y lo hace en JPG (bajo, medio, alto, muy alto, y el máximo), o ajustar la calidad entre 0 (baja) y 100 (máximo). La compresión reduce el tiempo de carga en una página, pero también la calidad visual.
4. Punto focal
En muchas ocasiones, el punto focal no está enfocado, para ello se debe utilizar la herramienta de Reocrte o Crop. Esto permite mejorar el enfoque deseado o lo que se quiere transmitir. Se recomienda hacerlo con imágenes en alta resolución, de lo contrario se puede pixelear la imagen.
5. Composición
El encuadre ideal debe suceder al tomar una fotografía, se deben tomar en cuenta las las reglas tradicionales de la composición que los pintores, fotógrafos, diseñadores y otros artistas consideran:
La “regla de los tercios” que busca lograr el equilibrio y enfoque al organizar los elementos en grupos de tres. Otra es la repetición, que destaca los elementos visuales interesantes como líneas y patrones al hacer buen uso del espacio positivo y negativo, entre otras.
6. Formato de archivo incorrecto
Es de suma importancia que conozcas las diferencias entre los tipos de archivos, pues no todos son iguales y cada uno tiene sus usos específicos, ventajas y desventajas.
JPG (o JPEG). Principalmente para las fotos (o ilustraciones muy detalladas / de colores y gráficos); es precisa y representa el color de amplio espectro; no es bueno para las imágenes con texto
PNG. Alta calidad de imagen y una buena representación de los colores; soporta la transparencia / opacidad; produce líneas y bordes afilados, por lo que funciona bien para cosas como gráficos, logotipos, gráficos, etcétera. No pierde calidad en el comprimido a diferencia del JPG.
GIF. Soporta la animación; apto para gráficos simples (tamaño de archivo bajo no afecta negativamente a velocidades de carga de la página); capacidades de color no tan bueno como JPG (256 colores o menos, por lo que no es apropiado para las fotos)
SVG. Formato de vector con resolución y zoom independiente.
PDF. Conserva el contenido original y la apariencia de un archivo, es mejor para la visualización de documentos completos en línea, como por ejemplo un folleto / guía / manual, libro electrónico, etcétera.
TIFF. Es de alta calidad de imagen, pero el tamaño de archivo muy grande, por lo que no son aptos para uso en la web; es común en la entrega de documentos para imprimir.
Para proyectos web es recomendable usar archivos JPG y PDF, además guardarlos en colores RGB, pues CMYK se verán extraños.
7. Calibra
Si trabajas con imágenes digitales, es importante que los colores se muestran en la pantalla sean los correctos, pues al editar querrás ver los colores que se verán en línea y estos deben verse de forma exacta. Para ello se debe calibrar la pantalla: que el brillo se encuentre entre 90 y 120 cd / m2.