Qué saber
- Abrir una imagen en Photoshop. Seleccione Imagen > Tamaño de imagen. Ingrese un nuevo ancho y luego seleccione Pixels > OK.
- Seleccione Archivo > Guardar para web y dispositivos. Elija la pestaña 2-Up para ver las imágenes originales y optimizadas una al lado de la otra.
- Cambie el valor de Calidad y vea los resultados. Realice ajustes en el tamaño o el tipo de archivo si es necesario. Seleccione Guardar y asigne un nombre a la nueva imagen.
Este artículo explica cómo usar la herramienta Guardar para Web de Photoshop para optimizar las imágenes para su uso en la Web. Esta información se aplica a Photoshop 20.0.10 y versiones posteriores. Los comandos y las opciones de menú pueden diferir entre versiones.
Cómo guardar para Web en Photoshop
Los diseñadores gráficos, los diseñadores web y otros que crean contenido para la web también crean imágenes listas para la web, como fotos para sitios web y anuncios publicitarios. Antes de cargar estas imágenes, optimizan las imágenes para descargarlas y mostrarlas rápidamente en un navegador web.
Aquí se explica cómo utilizar la herramienta Guardar para Web en Photoshop para obtener el equilibrio adecuado entre calidad de imagen y tamaño de archivo para sus imágenes.
- Abra la imagen que desea guardar en Photoshop.
-
Seleccione Imagen > Tamaño de imagen. O, para PC, presione Alt+Ctrl+I, para macOS, presione Comando+Opción+I en el teclado.
Image -
En el campo Ancho, ingrese un nuevo ancho, seleccione Píxeles, luego seleccione OK.
Cambie el tamaño de la foto a un tamaño pequeño que pueda usarse en un sitio web.
Image -
Seleccione Archivo > Exportar > Guardar para web (heredado). O utilice el método abreviado de teclado: Alt/Opción+Comando+Mayús+S.
En otras versiones de Photoshop, la ruta es Archivo > Exportar > Guardar para Web. El elemento puede llamarse Guardar para Web o Guardar para Web y dispositivos.
Image -
En la ventana Guardar para Web, vaya a Original, Optimizado,pestañas 2-Up, y 4-Up. Estas pestañas alternan entre una vista de la foto original, la foto optimizada con la configuración Guardar para Web aplicada o una comparación de dos o cuatro versiones de la foto.
Elija 2-Up para comparar la foto original con la foto optimizada. Esto muestra copias de la imagen una al lado de la otra.
Image -
Cambie el valor de Calidad. A medida que baja la calidad, la imagen se ve más borrosa y el tamaño del archivo disminuye. Los archivos más pequeños significan que las páginas web se cargan más rápido.
Encuentre un término medio entre el tamaño y la calidad del archivo. Una calidad entre 40 y 60 es un buen rango. Utilice los niveles de calidad predeterminados (JPEG medio, por ejemplo) para ahorrar tiempo.
Image -
Cambie el tipo de archivo, si es necesario, a JPEG, GIF, PNG-8, PNG-24 o WBMP.
Image -
Cambia el tamaño de la imagen, si es necesario. Ingrese un ancho o alto, o escálelo por un porcentaje.
Haga clic en el icono eslabón de la cadena para cambiar la proporción de la imagen. De lo contrario, ingrese un ancho o alto diferente para cambiar el otro valor en proporción.
Image -
Los valores debajo de la vista previa de la imagen muestran el tipo de archivo, el tamaño y el tiempo que tardará la imagen en abrirse en un sitio web. Estos números se actualizan a medida que realiza cambios.
Image -
Cuando esté satisfecho con la foto, seleccione Guardar.
Image -
Escriba un nombre para la foto, luego haga clic en Guardar.
Image
¿Qué hace que un gráfico esté listo para la Web?
La mayoría de los gráficos listos para la web comparten características comunes:
- La resolución es de 72 ppp.
- El modo de color es RGB.
-
Los archivos se reducen en tamaño para que las páginas web se carguen más rápido.
