Muse CC: Responsive webs

Exportación de imágenes a formato png

¡Prueba gratis durante 10 días

nuestros 1144 cursos !

Prueba gratis Mostrar modalidades de suscripción
El formato png reproduce millones de colores y tiene un muy buen soporte para transparencias en las imágenes. Como desventaja, los archivos resultantes suelen ser más pesados que los archivos jpg y gif.
03:34

Transcripción

El tercer formato típico de optimización de imágenes para web es el formato PNG. Tengo en este momento un archivo que se llama 'twitter.psd' y dentro del panel Capas voy a activar los Efectos. El único efecto que tenemos actualmente es el efecto de sombra paralela o "drop shadow". Voy también a desmarcar esta opción de Fondo. Vamos, bajo el menú Archivo, seleccionamos el submenú Exportar y la opción Exportar como. Yo necesito exportar esta imagen pero manteniendo la transición de esta sombra. Vamos a seleccionar la opción de JPG y lo primero que vamos a encontrar, si queremos optimizar esta imagen como formato JPG, es que este formato no soporta transparencias. Por lo tanto, lo que quiero no se puede realizar con el formato JPG. Recuerden, quiero mantener esta sombra como una sombra con una transición suave, pero a la vez quiero mantener la transparencia de esta imagen. Así que vamos a pasar al formato GIF. El formato GIF tiene un soporte parcial de transparencias. Observen que en estas áreas mantenemos las transparencias, pero en el área de transición de grises, que tiene la sombra, no existe esa transparencia. Por lo tanto, tampoco es posible utilizar el formato GIF en este caso. Vamos a seleccionar entonces el formato PNG. Al seleccionar el formato PNG, nos damos cuenta que cumple exactamente con lo que necesitamos en esta imagen: se mantienen las transparencias en estas áreas y también se mantienen en el área de transición de grises que existe en la sombra. Esto permite que posteriormente nosotros podamos tomar esta imagen y la podamos ubicar sobre cualquier otro elemento, ya sea un fondo, ya sea una imagen... y la sombra se va a fundir correctamente con los elementos que queden en la parte inferior. Una desventaja que podemos encontrar al utilizar el formato PNG es que normalmente el tamaño de archivo es mayor que el formato GIF o el formato JPG, dependiendo por supuesto del nivel de compresión que le apliquemos a ese JPG. Tenemos una opción más hacia la parte inferior que dice Archivo más pequeño 8 bits. Si nosotros marcamos esta casilla, observen como de 22.6 KB el tamaño baja a a 19.9 KB. La diferencia entre el tamaño con la casilla desmarcada y la casilla marcada va a depender de las características de la imagen. En muchos casos, al marcar esta casilla, nosotros podemos ahorrarnos bastante espacio. En este caso, el cambio no fue muy grande. Pero también, dependiendo de los detalles que tenga la imagen, al marcar esa casilla, esos detalles se pueden ver afectados. En este caso en particular no hay una afectación importante de esos detalles, así que podemos dejar esa casilla marcada y estamos ahorrando algo de espacio. Hacemos clic en el botón Exportar todo, guardamos la imagen 'twitter.png' dentro de la carpeta 'tmp' y aquí tenemos nuestro archivo optimizado en formato PNG. Recuerden, las dos principales características del formato PNG es que puede reproducir detalles fotográficos y a la vez también tiene un muy buen soporte para transparencias.

Muse CC: Responsive webs

Crea una web responsive sin escribir una sola línea de código gracias a Adobe Muse CC, la aplicación de la familia Adobe que te permite diseñar tu página de forma gráfica.

3:10 horas (41 Videos)
Actualmente no hay comentarios.
 
Software:
Formadores:
Fecha de publicación:15/09/2016
Duración:3:10 horas (41 Videos)

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.