Passa al contingut principal

Comprimir fotografies per mostrar al web

Comprimir fotografies per mostrar al web:
Els porquets fan de bon comprimir?Jo no diria que el tema d’aquesta entrada sigui veritablement “fotogràfic” però, sense cap dubte, forma part dels coneixements i habilitats que qualsevol fotògraf que vol mostrar la seva feina a internet ha d’adquirir sense remei.
Alguns consideren innecessari preocupar-se gaire per la correcta compressió de les imatges abans d’enviar-les a internet. De fet, també es dona el cas de fotògrafs que ni tan sols saben que això es pot fer; molt menys que en realitat és imprescindible fer-ho. L’excusa que les connexions actuals són prou ràpides com per que el pes d’una imatge no faci gaire diferència no és sostenible; no sabem qui veurà les nostres fotos, des d’on ho fa ni com es connecta a internet. Si considerem l’actual popularització dels anomenats smartphones (iPhone, basats en Android, etc), que cada cop s’utilitzen més per navegar per internet, encara es fa més evident que no fem cap favor al visitant, ni a nosaltres mateixos, negligint la correcta compressió de les nostres fotografies.
Dit de manera breu i cconcisa: mai s’han de pujar les fotografies tal com la nostra càmera ens les entrega (si disparem directament en JPG) o tal com resulten de la conversió a JPG. No té cap sentit penjar en el nostre fotobloc una imatge de 3.200×2.400 píxels i 3MB de pes. Ho diré ben clar: és una absoluta barbaritat!
Evidentment molts de vosaltres ja ho teniu prou clar, tot això. Però sempre hi ha gent que s’inicia, que tot just comença, o d’altres que actuen mal informats o des del desconeixement, encara que faci temps que roden. Per això he pensat que estaria bé explicar de manera senzilla i ràpida com s’ha de fer per comprimir correctament les fotografies que volem mostrar a internet.

Parlem de Photoshop

Imagino que Photoshop és el programa d’edició d’imatges que feu servir la majoria. Per això el trio per explicar com resoldre aquesta tasca. Si sou usuaris d’alguna altre eina, com per exemple el Gimp, segurament ja sabeu com es fa tot això. En qualsevol cas, probablement el procés deu ser ben similar doncs els conceptes i la tasca a resoldre són en essència els mateixos.
La funció que farem servir és l’anomenada “Guardar para la web y dispositivos”. Abans, però, hem hagut de reduir la imatge a les seves dimensions finals i li hem aplicat un increment de l’enfocament, si ho considerem necessari, amb el nostre procediment favorit. Quines dimensions s’escauen per mostrar fotografies a internet? És molt relatiu i no hi ha una resposta única. Diguem que hem de procurar que les imatges llueixin prou però que càpiguen a la pantalla, per tal que es pugui veure sencera sense haver de fer desplaçaments. Amb l’ajut de Mr. Google no és difícil trobar estadístiques que ens indiquin quines són les resolucions de pantalla més populars avui dia. Per exemple, la que es mostra a screenresolution.org. Examinant la taula, jo triaria unes mides màximes de 960 píxels per l’amplada i 700 píxels per l’alçada.
Un cop la imatge ja te les dimensions correctes, podem fer la compressió. Per començar, despleguem el menú “Archivo” i triem “Guardar para web y dispositivos”. Això fa que s’obri una finestra de treball on podrem controlar els paràmetres de la compressió.
Finestra de "Guardar para la web y dispositivos"
Si examineu la finestra, veureu que també us permet establir les mides finals de la imatge. Jo us recomano que ho feu abans, per que “Guardar para la web…” té certes limitacions quant a les dimensions i pes de les imatges que pot manegar (al menys així era fins el Photoshop CS5). A més, des d’aquí no podreu aplicar els vostres sistemes favorits d’enfocament. En resum: primer reduir, després enfocar i finalment comprimir.
El primer que farem és activar la pestanya “Optimizado”, que ens mostra una pre-visualització de quin serà el resultat en aplicar la compressió, amb els paràmetres establerts (format d’arxiu, nivell de compressió, etc). Les altres dues pestanyes (“2 copias” y “4 copias”) permeten comparar 2 o 4 versions de la mateixa imatge, cada una d’elles amb diferents paràmetres. Això pot ser útil per decidir les condicions de la compressió final, comparant el impacte que podria tenir en cada cas.
"Guardar para la web..." amb quatre versions de la imatge comparades
El primer que hem de fer és establir el format de l’arxiu final. Tractant-se de fotografies, no hi ha cap dubte: en el desplegable hem de triar “JPEG” i cap altre més. Els altres formats són adequats per situacions que a nosaltres en principi no ens han de preocupar. Repeteixo: JPEG i res més!
El següent pas és triar el nivell de compressió. Ho podem fer de diverses maneres: amb el menú desplegable que ens dona una sèrie de valors per defecte (“Baja”, “Mediana”, “Alta”, “Muy alta”, “Máxima”), amb el control lliscant o senzillament escrivint un valor numèric entre 0 i 100. Aquest valor expressa la “qualitat” que volem preservar, de manera que valors baixos impliquen una gran compressió i valors alts poca compressió. En tot moment podem veure quin és l’efecte sobre la imatge i veure quina pèrdua de qualitat provoquem amb diferents nivells de compressió. Per fer-ho, us recomano que fixeu l’augment (zoom) al 100%.
A la imatge anterior podeu veure com una imatge inicialment de 1,05MB (massa per la web!) es queda en 49,21KB, sense que es produeixi una pèrdua de qualitat apreciable. Segurament encara la podríem aprimar una mica més…
Hi han dos controls addicionals, “Desenfoque” y “Halo”. Pel cas que ens ocupa, mostrar les nostres fotografies al web, recomano fixar el primer a 0 (cero) i deixar el segon buit o triar “Ninguno”.
És convenient establir certs paràmetres addicionals per tal d’optimitzar al màxim el pes de l’arxiu final. Amb aquesta idea, desmarcarem les caselles “Progresivo” y “Incrustar perfil de color” però marcarem la casella “Optimizado”.
Per tal d’estalviar encara més, no incrustarem el perfil de color a la imatge. Per tant, ens hem d’assegurar que l’espai de color de sortida és el correcte: hem de marcar la casella “Convertir en sRGB”. També ho podem fer convertint la imatge a sRGB abans d’iniciar la compressió, però des d’aquí resulta molt fàcil i ens estalviem un pas previ.
Triem sRGB per que és el perfil de color que assumeixen per defecte tots els navegadors. Com que no podrem saber si el navegador amb el que veuran les nostres imatges suporta la gestió de perfils de color, així anem sobre segur.
Un altre paràmetre a triar és la informació que volem incrustar a la imatge final. Personalment, jo sempre trio “Ninguna”, descartant totes les dades addicionals sobre copyright, contacte, EXIF, etc. La decisió és vostra, en qualsevol cas. Només cal considerar que quanta més informació hi afegiu més creixerà l’arxiu. Vosaltres mateixos podeu comprovar quin efecte té en el pes de la imatge final i decidir en conseqüència.
Finalment, només cal fer clic al botó “Guardar” per tal de desar la imatge final, convenientment comprimida, en el nostre disc. Felicitats, ara ja la podem enviar al nostres bloc, per email, al Flickr o allà on ens vingui de gust.

Per què algunes imatges es comprimeixen més que d’altres?

Això ho observarem amb freqüència: el pes dels arxius és variable i algunes fotografies no les podem comprimir gaire, per molt que reduïm la qualitat. En canvi, altres es queden en gairebé res, inclús  mantenint una qualitat molt alta, és a dir, comprimint-es ben poc.
Això és degut a la manera com funciona la compressió JPG/JPEG. Per començar, a diferència del PNG i GIF per exemple, es tracta d’un sistema amb pèrdua de qualitat: quan més comprimim més degradem la imatge. Per tant, el que perseguim és un compromís ideal entre el pes mínim de l’arxiu i una pèrdua de qualitat inapreciable o com a mínim acceptable.
Explicat de manera molt bàsica, el primer que fa el sistema de compressió JPG és cercar patrons de repetició a la imatge. És a dir, que si tenim una gran extensió de cel blau, no l’enregistra com una successió de valors RGB per cada píxel; ho codifica amb un valor inicial i enregistra les vegades que es repeteix en la mateixa “línia” de píxels. Òbviament, és més curt escriure “3399ccx200″ que escriue 200 vegades “3399cc”.
Considerant aquesta estratègia, és lògic pensar que una fotografia del desert, amb les seves dunes i un cel blau sense núvols, és molt més “fàcil” de comprimir que la foto de les branques d’un ametller florit; en el segon cas serà molt difícil trobar patrons de repetició per tal de “resumir” la imatge.
Si teniu interès per saber més detalls sobre l’algorisme de compressió JPG/JPEG, ho trobareu explicat a la wikipedia. Que us faci profit!

Comentaris

Entrades populars d'aquest blog

10 alternativas a Cuevana para ver películas online

10 alternativas a Cuevana para ver películas online : Durante este último tiempo, en Cuevana se sucedieron varios “problemas” por los cuales hubo que ajustar algunas cosas antes de tiempo (como el rediseño del sitio), que dejaron a algunos usuarios ciertos problemas para acceder a las películas o series del portal. Pero realmente esto es algo que no incumbe a los usuarios y, como sabemos, existen muchas otras alternativas a Cuevana dando vueltas por Internet, que intentaremos presentar aquí mismo. Los sitios que repasaremos funcionan del mismo modo que Cuevana, mediante la instalación de un plugin que permite visualizar los videos de Megaupload o WUShare, entre otros servicios, en una calidad de imágen realmente excelente. Tal como sucede con el más popular servicio, todos ellos tienen publicidad que en algunos casos resulta insoportable, pero como dice Federico en DotPod “a caballo regalado no se le miran los dientes”. Alternativas a Cuevana 1. Moviezet Posiblemente el mejor clon d...

Learn Composition from the Photography of Henri Cartier-Bresson

“Do you see it?” This question is a photographic mantra. Myron Barnstone , my mentor, repeats this question every day with the hopes that we do “see it.” This obvious question reminds me that even though I have seen Cartier-Bresson’s prints and read his books, there are major parts of his work which remain hidden from public view. Beneath the surface of perfectly timed snap shots is a design sensibility that is rarely challenged by contemporary photographers. Henri Cartier-Bresson. © Martine Franck Words To Know 1:1.5 Ratio: The 35mm negative measures 36mm x 24mm. Mathematically it can be reduced to a 3:2 ratio. Reduced even further it will be referred to as the 1:1.5 Ratio or the 1.5 Rectangle. Eyes: The frame of an image is created by two vertical lines and two horizontal lines. The intersection of these lines is called an eye. The four corners of a negative can be called the “eyes.” This is extremely important because the diagonals connecting these lines will form the breakdown ...

Más de 50 de las mejores herramientas online para profesores

No es una exageración afirmar que hay ciento de aplicaciones educativas por ahí por la red, para todos los gustos y de todos los colores, por lo que es difícil tratar de recogerlas todas en un listado. Sin embargo, algunas destacan más que otras por su innovación y por su capacidad para conseguir adeptos, y esas son las que protagonizan la presente recopilación. Son 50 interesantes herramientas online basadas en las recopilaciones de EduArea , las muchas ya tratadas en Wwwhat’s new y las destacadas por la experiencia. 1. Dropbox : Un disco duro virtual con varios GB gratuitos y al que se accede desde casi cualquier dispositivo. Sin embargo, es muchísimo más que eso, de hecho ya comentamos 20 razones . 2. Google Drive : La evolución de Google Docs que suma a sus múltiples herramientas de creación de documentos, un considerable espacio virtual gratuito. 3. CloudMagic : Una extensión y una app multidispositivo para buscar información simultáneamente en Gmail, Twitter, Facebook, Evernote ...