Asignar perfiles de color y publicar en la web con Photoshop - page 1 - Otros - Foto Gran Canaria

Técnica, equipo, software, manuales y pruebas de equipo fotográfico > Otros

Asignar perfiles de color y publicar en la web con Photoshop

(1/2) > >>

FotoGranCanaria:
En este tutorial os vamos a explicar, muy brevemente, como asignar un perfil de color y como hacer para publicar en la web con Photoshop.Con otros programas se hace de forma muy similar. Lo importante es comprender el cómo y el por qué y extrapolarlo a los programas de vuestra elección.
Primer paso: abrimos la imagen a la que queremos asignar un determinado perfil de color en Photoshop.

Abrimos el menú “Edición” y hacemos clic en el submenú “Convertir en perfil…”
Se abrirá la siguiente ventana y nos permitirá escoger entre varios perfiles de color. En el caso que nos ocupa, vamos a elegir el perfil “sRGB” (small RGB), por ser el que mejor se ajusta a la interpretación de colores en la web, por parte de los diferentes navegadores existentes.

Activar y desactivar la previsualización nos mostrará en que sentido van a cambiar parte de los colores de la imagen. A veces el cambio es tan sutil que no se nota. Otras veces se nota un cambio fuerte, pero es la única forma de que las fotos se vean igual (o casi) en cualquier navegador. El nombre completo del perfil escogido es “sRGB IEC61966-2.1”.
*Nota importante: Aunque el perfil de color “RGB” (Adobe RGB 1998) es capaz de mostrar más colores y de forma más fiel, no es recomendable usarlo en la web, porque los navegadores no son capaces de mostrar toda la gama. El resultado será una imagen con un contraste, saturación y luminosidad inferiores al sRGB.
En esta captura puede verse cuales son los otros perfiles disponibles en el momento de redactar este tutorial:

Bien, una vez escogido el perfil de color adecuado, pulsamos el botón “OK” y el perfil de origen del archivo será cambiado al perfil escogido en el cuadro de diálogo que vimos antes. Es decir, hemos convertido el perfil de color de la imagen.
El paso siguiente será optimizar la imagen para guardarla en la web. Para ello os recomiendo cambiar la resolución de la imagen a 72 ó 96 ppp (puntos por pulgada), o dpi (dots per inch) en inglés, si vuestro programa no estuviese en español. Esto debe hacerse con las casillas “Restringir proporciones” y “Remuestrear la imagen” marcadas, como en el ejemplo. Esto hará que la imagen no se distorsione.
Guardamos el cambio y ahora que tenemos un archivo de peso más reducido, pero con un reescalado de calidad vamos a optimizarlo para la web.
*Nota: El paso anterior no siempre es necesario, pues el que veremos a continuación puede reescalar la imagen. Pero la ventaja de hacerlo siempre es que en equipos con poca memoria RAM y con archivos muy grandes, no siempre se puede hacer directamente con la opción de “Guardar para la web”.
Vamos al menú “Archivo”, submenú “Guardar para Web…”

Nos saldrá una ventana como esta y la vamos a interpretar de arriba hacia abajo:
Paso 1: Formato de imagen, calidad y método de carga en web.Para mostrar imágenes en web con la mejor calidad debemos escoger JPG (JPEG), pues si bien el formato PNG es mejor, también ocupa un tamaño algo mayor y penalizaría la carga de imágenes, especialmente en sitios con muchas de ellas (Caso de galerías fotográficas). El formato GIF debemos descartarlo para fotografía. Calidad máxima = mayor tamaño. Calidad media = tamaño relativamente pequeño. Esto se deja a la elección de cada uno.El método de carga en la web depende de cómo queremos que se muestre la imagen mientras es cargada; el modo progresivo nos va mostrando la imagen con poca calidad al principio y con la máxima cuando el archivo ha sido descargado en la caché del navegador. Si no marcamos esta opción, la imagen no será mostrada hasta que esté completamente descargada en la caché del navegador web.
Paso 2: Si no lo habéis hecho antes, podéis convertir en este cuadro de diálogo el perfil a modo sRGB
Paso 3: Si queréis que los sitios como Flickr, 500px o la galería de Foto Gran Canaria interpreten los datos EXIF de la imagen (siempre que no se hayan eliminado por cualquier otro método antes de llegar a este paso), debéis seleccionar la pestaña “Todo”.
Paso 4: Aquí podemos especificar el tamaño del lado más largo o más corto de la imagen. En la captura del ejemplo está ajustado para que la imagen sea publicada en los foros de Foto Gran Canaria, es decir, a 800 píxeles de lado mayor.En este apartado también existe otro ajuste de calidad, pero sólo si hacemos ampliaciones o reducciones con respecto al archivo original.



* El método “Por aproximación“ usa un algoritmo rápido que conserva los bordes de la imagen definidos, aunque no es muy preciso.
* El método “Bilineal” conserva los degradados de forma más suave, teniendo en cuenta los 4 píxeles adyacentes entre sí.
* El método “Bicúbico” conserva degradados suaves teniendo en cuenta los 16 píxeles alrededor de sí mismos.
* El método “Bicúbico más suavizada” se usa para mantener los degradados suaves si ampliamos la imagen.
* El método “Bicúbico más enfocada” es óptimo para reducciones de imagen, manteniendo los degradados suaves también.
Antes de guardar la imagen, debemos fijarnos en la información que aparece debajo de la previsualización de ésta (JPEG, 175,4 KB, etc.)El dato más importante es el peso de la imagen: 174,4 KB con estos ajustes. Recordad que el foro admite imágenes de hasta 500 KB.
Paso 5: Al pulsar el botón “Guardar”, Photoshop nos preguntará dónde y con qué nombre de archivo queremos guardar la imagen. Recordad que no se pueden usar tildes, símbolos extraños, ni la letra “ñ”, pues no son reconocidos, en la mayoría de los casos, por los servidores de internet.
Paso 6: Si no queremos guardar aún el archivo, por querer hacerle alguna modificación, al pulsar el botón “Hecho”, cerraremos la ventana de ajustes. Ojo, darle a este botón antes de guardar, no nos guarda la imagen. Parece una tontería, pero esto puede confundir al principio a los usuarios noveles.
Esperamos que este tutorial os aclare muchas dudas y os sea de interés.

Suso:
Muy buen tuto, lo aplaudo.

Por añadir como lo hago para enriquecer el hilo.

En mi caso una vez que ya le tengo el perfil del color cambiado y reducida la foto, voy a --> Archivo -->  Guardar como .....

He notado que hay mascalidad de salida y sigo manteniendo los 300ppp.

El archivo pesa mas, pero se ve mejor.

Gracias por exponerlo. Es de gran ayuda.

jsuarez:
Buen aporte, Gracias¡¡

FotoGranCanaria:

--- Cita de: Suso en 27 de Octubre de 2013, 01:15:31 am ---En mi caso una vez que ya le tengo el perfil del color cambiado y reducida la foto, voy a --> Archivo --> Guardar como .....

He notado que hay mascalidad de salida y sigo manteniendo los 300ppp.

El archivo pesa mas, pero se ve mejor.

Gracias por exponerlo. Es de gran ayuda.

--- Fin de la cita ---

En efecto, Suso, pero hay que tener en cuenta dos cosas:

* Más calidad al verlo en el monitor no quiere decir que vaya a tener más calidad al verlo en la web; muchos sitios recodifican los JPG para que no pesen tanto en la web (algo parecido a la recodificación de vídeo en Youtube), así que al final la última palabra la tienen esos sitios.
* En caso de no haber reescalado (es posible que ImageShack no lo haga, aunque no podemos asegurarlo) te vas a encontrar con imágenes de peso considerable. 4 MB es una exageración para colgar una imagen en web y tarda muchísimo en cargar en dispositivos móviles o con redes lentas.
Imagina que en tu galería tienes 25 imágenes para mostrar de una vez. Y que cada una de esas imágenes pese, sin irnos muy arriba, unos 2 MB cada una. 25 x 2 = 50MB para cargar.
Cuando alguien visita tu fotoblog desde un ordenador con una ADSL normalita de 3 ó 6 MB, la página tarda un ratito en cargar todas las imágenes. Un poco incómodo, pero aceptable.

Ahora imagina que intentas verla con una tableta desde una red 3G -saturada- (el 99% del tiempo lo están). Un minuto para cargar 2 fotos. A la tercera es posible que la persona que intente ver tu galería se desespere y abandone. Un abandono en términos de sitios web es un desastre; la persona que obtiene una impresión negativa de una web no vuelve a visitarla, independientemente de la calidad de su contenido. Y todo por querer mostrar “más calidad”.

En este tutorial hemos hablado de “optimizar para la web”. Optimizar quiere decir lograr un compromiso aceptable y real entre calidad y peso de imagen.
Realmente se pueden conseguir resultados espectaculares con menos de 500 KB y a 1280 píxeles, como en nuestra galería de Foto Gran Canaria. El problema está en que muchas veces el usuario no sabe (o no se ha preocupado) en optimizar las imágenes para ser vistas en web. Y culpa de su frustración a los sitios donde publica. Craso error.

El ejemplo anterior con imágenes optimizadas: un fotoblog que muestra 25 imágenes de 400 KB cada una, a 1280 píxeles de lado mayor. 25 x 0,390625 KB = 9,76 MB.
Con una ADSL de 6 MB se tardará menos de 1 minuto en descargar todas las imágenes.
25 imágenes de 180 KB a 800 píxeles de lado mayor. 25 x 0,17578125 = 4,4 MB.
Rapidísimo. Muy aceptable para móviles y tabletas.

El “truco” está en adaptar la galería o fotoblog al público que esperas que lo visite. Una imagen de entre 800 y 1280 píxeles de lado mayor es algo más que aceptable para ser visto en internet. Y optimizado, mejor.

Fco. Javier García Segura:
Muchas gracias por este tutorial y el trabajo que ha supuesto.  clap)

Navegación

[0] Índice de Mensajes

[#] Página Siguiente

Ir a la versión completa