{"id":2996,"date":"2014-05-20T20:23:11","date_gmt":"2014-05-20T18:23:11","guid":{"rendered":"http:\/\/nusgrafic.com\/jpg-png-gif-quin-format-utilitzem-web-2\/"},"modified":"2018-07-04T21:50:22","modified_gmt":"2018-07-04T19:50:22","slug":"jpg-png-gif-que-formato-utilizamos-web","status":"publish","type":"post","link":"https:\/\/nusgrafic.com\/es\/jpg-png-gif-que-formato-utilizamos-web\/","title":{"rendered":"Jpg, png o gif&#8230; \u00bfQu\u00e9 formato utilizamos en web?"},"content":{"rendered":"<p style=\"text-align: justify;\">Analizaremos los tres <strong>formatos, jpg, png y gif<\/strong> para ver cu\u00e1l de estos es el m\u00e1s adecuado para utilizar en internet.<\/p>\n<h3 style=\"text-align: justify;\"><strong>JPG<\/strong><\/h3>\n<p>El <strong>m\u00e1s utilizado<\/strong>, el formato JPG. Un formato <strong>ideal para fotos<\/strong> pero debemos saber que este formato utiliza un m\u00e9todo de compresi\u00f3n que optimiza el tama\u00f1o de las fotos pero nos hace perder calidad. Entonces cuanto m\u00e1s comprimimos imagen m\u00e1s grande ser\u00e1 la p\u00e9rdida de calidad. Esto nos pasar\u00eda cuando queremos guardar la imagen en <em>photoshop -&gt; guardar para web<\/em>. A simple vista puede que no se nota, pero si ampliamos la imagen podemos observar como ha perdido calidad.<\/p>\n<p>En este ejemplo hemos tomado la misma imagen, la de 57,6 kb esta guardada en una <strong>compresi\u00f3n baja<\/strong> y la de 17,3kb en una <strong>compresi\u00f3n muy alta.<\/strong><\/p>\n<p><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone wp-image-1376 size-full\" title=\"Jpg, png o gif... Quin format utilitzem en web?\" src=\"http:\/\/nusgrafic.com\/wp-content\/uploads\/2014\/03\/jotapege.jpg\" alt=\"Jpg, png o gif... Quin format utilitzem en web?\" width=\"851\" height=\"315\" \/><\/p>\n<p style=\"text-align: justify;\"><span style=\"text-decoration: underline;\">Os detallamos los pros y contras del formato JPG.<\/span><\/p>\n<p style=\"text-align: justify;\"><strong>Pros:<\/strong> Puede guardar hasta <strong>16 millones de colores diferentes<\/strong>, gracias a los 24 bits de profundidad de color. Gracias a que se puede comprimir mucho puedes guardar im\u00e1genes que <strong>pesen muy poco y es ideal<\/strong> para publicar im\u00e1genes en p\u00e1ginas web.<\/p>\n<p><strong>Contras:<\/strong> No soporta <strong>transparencias<\/strong> y no es recomendable para la <strong>edici\u00f3n de fotos<\/strong>. Para estos casos utilizaremos el formato RAW. La <strong>p\u00e9rdida de calidad es proporcional a la compresi\u00f3n<\/strong>, y cuantas m\u00e1s veces guardamos la imagen menos calidad tendr\u00e1.<\/p>\n<h3 style=\"text-align: justify;\"><\/h3>\n<h3 style=\"text-align: justify;\"><strong>PNG<\/strong><\/h3>\n<p style=\"text-align: justify;\">El formato PNG se cre\u00f3 para sustituir el formato GIF. Actualmente para \u00a0<a href=\"http:\/\/www.w3c.es\/\" target=\"_blank\" rel=\"noopener\">W3C<\/a>\u00a0el formato PNG es el est\u00e1ndar recomendado. Dentro del PNG tenemos dos subcategor\u00edas, el PNG8 y el PNG24.<\/p>\n<p>El <strong>PNG8<\/strong>, se el equivalente al formato GIF, es un poco mejor respecto al formato GIF ya que ofrece una compresi\u00f3n y una transparencia algo m\u00e1s mejorada que el formato GIF y puede mostrar hasta 256 color por imagen. Con este formato no podemos guardar animaciones. El <strong>PNG24<\/strong>, ser\u00eda el equivalente al formato JPG, pero admite transparencias de m\u00e1s calidad que PNG8 y GIF. No pierde calidad al guardar con este formato.<\/p>\n<div id=\"nav-above\"><img decoding=\"async\" class=\"alignnone wp-image-1379 size-full\" title=\"Jpg, png o gif... Quin format utilitzem en web?\" src=\"http:\/\/nusgrafic.com\/wp-content\/uploads\/2014\/03\/penege.jpg\" alt=\"Jpg, png o gif... Quin format utilitzem en web?\" width=\"851\" height=\"315\" \/><\/div>\n<div><\/div>\n<div id=\"post-684\">\n<div style=\"text-align: justify;\">\u00a0<span style=\"text-decoration: underline;\">Los pros y contras del formato PNG.<\/span><\/div>\n<div style=\"text-align: justify;\"><strong>Pros:<\/strong> Puede guardar hasta <strong>16 millones de colores diferentes<\/strong> con una profundidad de 24 bits. Permite <strong>transparencias<\/strong> y cuando comprimimos una imagen no pierde calidad. Es ideal para iconos, transparencias, degradados, fotos peque\u00f1as &#8230;<strong>Contras:<\/strong> Como <strong>no comprime mucho<\/strong> no es muy recomendable para fotos de gran tama\u00f1o.<\/p>\n<p><strong>\u00a0<\/strong><br \/>\n<strong>GIF<\/strong><\/p>\n<p>El formato GIF se caracteriza porque en una imagen puede mostrar como m\u00e1ximo 256 colores y permite visualizar animaciones. Es uno de los formatos m\u00e1s utilizados para crear banners y otras animaciones gr\u00e1ficas.<\/p>\n<\/div>\n<\/div>\n<p style=\"text-align: justify;\"><img decoding=\"async\" class=\"alignnone wp-image-1413 size-full\" title=\"Jpg, png o gif... Quin format utilitzem en web?\" src=\"http:\/\/nusgrafic.com\/wp-content\/uploads\/2014\/05\/gif2.jpg\" alt=\"Jpg, png o gif... Quin format utilitzem en web?\" width=\"851\" height=\"315\" \/><\/p>\n<div style=\"text-align: justify;\"><span style=\"text-decoration: underline;\">Los pros y contras del formato GIF.<\/span><\/div>\n<p><strong>Pros:<\/strong> Se adecuado para im\u00e1genes grandes en mucho color y simples (ilustraciones, logotipos &#8230;) y tambi\u00e9n te permite crear transparencias pero normalmente son de baja calidad.<\/p>\n<p><strong>Contras:<\/strong> No es recomendable para guardar fotos o im\u00e1genes de colores complejas.<\/p>\n<h2>\u00bfQu\u00e9 formato debemos utilizar para cada ocasi\u00f3n?<\/h2>\n<p>Os expongo unos ejemplos para que se dif\u00edcil concretar cual es el mejor formato y cu\u00e1l va mejor para cada imagen que queremos guardar.<\/p>\n<p>Fotos, im\u00e1genes complejas y de alta calidad y transparencias -&gt; JPG y PNG24<\/p>\n<p>Im\u00e1genes en alta calidad y transparentes -&gt; PNG24<\/p>\n<p>Logotipos, textos, transparencias que no requieren mucha calidad-&gt; GIF y PNG8<\/p>\n<p><strong><em>\u00bfQu\u00e9 formato utiliza vosotros?<\/em><\/strong><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Analizaremos los tres formatos, jpg, png y gif para ver cu\u00e1l de estos es el m\u00e1s adecuado para utilizar en internet. JPG El m\u00e1s utilizado, el formato JPG. Un formato ideal para fotos pero debemos saber que este formato utiliza un m\u00e9todo de compresi\u00f3n que optimiza el tama\u00f1o de las fotos pero nos hace perder [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2569,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"page_builder":"","_joinchat":[],"footnotes":""},"categories":[149,157,160],"tags":[],"class_list":["post-2996","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-grafico","category-diseno-web-es-2","category-foto"],"_links":{"self":[{"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/posts\/2996","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/comments?post=2996"}],"version-history":[{"count":1,"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/posts\/2996\/revisions"}],"predecessor-version":[{"id":15445,"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/posts\/2996\/revisions\/15445"}],"wp:attachment":[{"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/media?parent=2996"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/categories?post=2996"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nusgrafic.com\/es\/wp-json\/wp\/v2\/tags?post=2996"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}