Cargando

Ir a contenido


 


¿Qué formato de imágen elegir entre PNG, JPG y GIF para mi web?

¿Cual elegir entre los formatos PNG, JPG (JPEG), o GIF? Este tutorial te explica en qué consiste cada uno de estos formatos y en qué momento viene bien utilizar cada uno.


Escrito por el mar 22 2015 18:47 png jpeg gif imagenes


Los formatos JPG, PNG y GIF, son los más utilizados y populares para el uso en imágenes para páginas web, ya que son compatibles con todos los navegadores. Aquí te ayudamos a que puedas seleccionar el formato de imágen más correcto en cada caso que te vaya surgiendo.

A continuación veremos y explicaremos las diferencias que tienen entre uno y otro. Lo mejor es empezar detallando en qué consiste cada uno:

JPG (JPEG)

jpg.jpg

Ejemplo de una imágen JPG con muchos colores


Archivos de imágen JPG (JPEG) es un formato que posee una relación compresión / calidad muy buena. Teniendo un tamaño no muy grande ofrece una calidad muy buena de imágen. Tiene soporte hasta los 16,7 millones de colores, esta sería la opción perfecta cuando las imágenes o fotos tienen una calidad profunda y es necesario que se muestre con calidad a un tamaño acorde.

Nos ofrece posibilidad de compresión de la imagen en función de la calidad y/o tamaño que quereamos. La parte "negativa" es que no nos permite realización de imágenes con transparencia de background.


GIF

logo_solvetic.gif

Ejemplo de un logo GIF con pocos colores


Archivos de imágen GIF es un formato muy útil para que podamos crear archivos que no tienen mucha resolución (y ahorrar espacio en web). Ofrecen transparencia, punto importante respecto a los JPG pero la calidad como decíamos antes es muy justa (256 colores max.). Lo que ocurrirá es que al salvar una imágen a formato GIF (Y posea más de 256 colores) verás que baja la calidad de imágen de forma abrupta.

Los GIF también se comprimen, y el tamaño es pequeño.

El uso de GIF es bastante típico en iconos web, ya que no se les suele poner muchos colores, y al permitir la transparencia, pues quedarán bien en las páginas web, permitiendo mostrar los fondos, con sus colores, imágenes etc.

Otro punto interesante del formato GIF, es que es posible crear animaciones de imágen. Últimamente para la creación de estas animaciones es el mayor uso que se le dá.


PNG

png.png

Ejemplo de imágen con transparencia y mucho color


Archivos de imágen PNG contienen un formato libre de derechos. Es útil para todo tipo de imágen, con calidad pequeña (8 bits, 256 colores), para calidad grande (24 bits, 16 millones de colores), transparencia con calidad, excepto en animaciones.


Veamos ahora donde es más típico usarlos.

¿Donde uso cada formato de imágen?
GIF

Un formato de archivo GIF se utiliza principalmente para iconos y gráficos con áreas sólidas de color (Que tenga pocos colores, ya que sólo acepta 256). Para imágenes o logos con transparencias y con contados colores puede ser muy útil también. Descartado para fotos o imágenes con ciertas calidades.

JPG (JPEG)

Es perfecto el uso de este formato para imágenes, fotos con calidad y mucho colorido, nos ofrecerá una calidad muy buena y posibilidad de compresión al gusto de cada uno, sin perder mucha calidad y sin tener unos tamaños de imágen muy grandes como ocurre en otros formatos como son bmp o png.

PNG

Para imágenes que queramos mantener con muy buena calidad (sin compresión), pueden ser gráficos, mapas, imágenes con mucho texto y que no nos importe el tamaño, ya que sería más grande que comprimido en JPG. Es útil usar este formato también para imágenes que queramos mantener transparencias como pueden ser logos de páginas web, ya que le das máxima calidad y sabes que permite transparencia (Es de los usos más demandados para este formato).


¿Cual de estos formatos soléis usar vosotros?
¿Te ha gustado y ayudado este Tutorial?
Puedes premiar al autor pulsando este botón para darle un punto positivo
  • -
  • 0
10
VOTA
5
100%
4
0%
3
0%
2
0%
1
0%

  Información

  •   Publicado mar 22 2015 18:47
  •   Actualizado mar 22 2015 18:50
  •   Visitas 865
  •   Nivel
    Intermedio


Tutoriales Relacionados


1 Comentarios


Fran Pazos
mar 26 2015 09:34

Buen tutorial, para entender los formatos para Web. Yo suelo usar JPG.

No esperes más y entra en Solvetic
Deja tus comentarios y aprovecha las ventajas de la cuenta de usuario ¡Únete!


Suscribirse