Una de las funciones más importantes que ofrece Photoshop es la Guardar para Web/Dispositivos característica.
¿Por qué usarlo? Si bien podría simplemente guardar su archivo en un método estándar, como Archivo / Guardar como, la función Guardar para Web/Dispositivos hace tres cosas cruciales.
- Optimiza las dimensiones del archivo (por ejemplo: 150 px X 150 px) permitiéndole encajar en páginas web más limpias y verse mejor y menos distorsionadas.
- Optimiza el tamaño del archivo (por ejemplo: 23 kb) permitiendo que se descargue más rápido.
- Guarda en el formato RGB (o monitor) a diferencia del formato CMYK (impresión).
Esta herramienta funciona muy bien para generar íconos de Twitter, fotos de perfil de Facebook, archivos de productos, imágenes de blogs y archivos fuente para favicons.
Abra su archivo fuente
Para comenzar, deberá ir a Archivo/Abrir para abrir su archivo. Puede estar en cualquier formato: jpg, gif, psd, png u otros. Siempre que Photoshop pueda abrirlo, puede enviarlo a la web.
Guardar su archivo para la Web
Vamos a pasar directamente a guardar para la Web, suponiendo que haya realizado los ajustes necesarios. Obviamente, si necesita editar la imagen, hágalo primero y continúe con este paso más tarde.
Ir a Archivo/Guardar para Web/Dispositivos y haga clic Está aproximadamente a la mitad del menú desplegable.
Este proceso no cambia su archivo original en absoluto. Estás creando un nuevo archivo. Una vez que complete este tutorial y regrese a su imagen original en Photoshop, deberá guardar ese archivo si le ha realizado algún cambio. Es importante nombrar su nueva imagen diferente a la original. A menudo simplemente agregando _web al nombre del archivo funcionará bien. (ejemplo: nombre_archivo_web.jpg)
Ajustar la vista de comparación a 2-Up
Dependiendo de su configuración, es posible que deba ajustar la vista aquí. Lo que quieres es una comparación izquierda y derecha de tu imagen. El lado izquierdo mostrará el original, el derecho mostrará la calidad de imagen en la configuración actual.
Si observa la parte superior de la ventana, verá las siguientes opciones: Original, Optimizado, 2 en 1, 4 en 1. Para la mayoría de los propósitos, 2-Up es lo que querrá.
Establezca su tamaño de visualización al 100%
Para asegurarse de que está viendo al 100%, marque la opción en la esquina inferior izquierda de la pantalla.
Es importante recordar que si ve su imagen por encima del 100%, se verá granulada o posiblemente incluso indescifrable. Trabajar siempre con la imagen al 100%.
Elija las dimensiones del archivo
Las dimensiones para la web casi siempre están en píxeles (px). Es importante mantener las proporciones correctas. Al lado del cuadro de imagen hay una pequeña imagen de un eslabón de cadena. Lo que hace es escalar el ancho cuando ajustas la altura. Por ejemplo, una imagen de 600 px por 400 px. Si reduce el ancho a 300 px, el archivo se escalará automáticamente a una altura de 200 px. Si no está marcada, la imagen se distorsionará.
También tienes la opción de escalar la imagen por porcentajes.
Elija el tipo de archivo para exportar
En esta opción no importa el tipo de archivo original. Puedes elegir el archivo que necesites.
Nota: Para comenzar el proceso, deberá hacer clic en la imagen de la derecha. La imagen necesita ser seleccionada para ser procesada.
El más común es jpg para la web: es el formato de archivo más pequeño, lo que significa que se descarga más rápido para los visitantes de su sitio. Si tiene transparencia, elija png-24. Si no sabe qué significa transparencia, debe elegir jpg.
Elija la calidad de la imagen
Cada una de las tres opciones de jpg (Alto, Medio, Bajo) tiene configuraciones de calidad preestablecidas, que se pueden ajustar manualmente. Si está viendo al 100%, puede decidir qué calidad necesita. Para ajustar el nivel de zoom, consulte el Paso 5. La imagen se verá igual en línea que en la ventana de vista previa.
Si elige algo que no sea jpg, puede omitir este paso.
Guarde su archivo
Una vez que haya realizado los ajustes necesarios, estará listo para guardar el archivo. Haga clic en "Guardar" y elija la carpeta y el nombre de archivo que desea para esta nueva imagen.
¡Felicidades! Su nuevo archivo está listo para usarse en línea.