Avui us parlarem de la importància de tenir imatges optimitzades en el nostre disseny web.
És un aspecte clau a l’hora de definir el disseny d’una pàgina web, ja que en depenen factors tan rellevants com el temps de càrrega i possibles penalitzacions, tant directes com indirectes, per part dels clients, els usuaris i fins i tot Google.
Així que, si estàs pensant a contactar-nos perquè et fem una pàgina web, et mostrarem alguns trucs essencials per maximitzar la relació entre imatge, qualitat i pes.
1. Aprendre a optimitzar les imatges sense perdre qualitat en el nostre disseny web
Aquest és el mínim imprescindible: encara que no facis res més de la llista, aquest pas és fonamental. Només cal utilitzar un d’aquests dos programes: ImageOptim per a OS X o FileOptimizer per a Windows i Linux, que automatitzen l’optimització d’imatges.
Només heu d’arrossegar les vostres imatges dins l’aplicació mentre us preneu un bon Cola Cao.
És un procés rapidíssim i sense complicacions, i el resultat són imatges perfectament optimitzades.
2. Mida adequada
Fer servir imatges amb dimensions incorrectes és un error molt habitual i pot tenir conseqüències greus.
Sovint pensem que, si veiem la imatge bé a la pantalla, ja està tot correcte, però pot ser que el navegador estigui carregant una imatge molt més gran del necessari, amb el pes que això comporta, i només n’estigui mostrant una versió reduïda.
Per això, les dimensions de la imatge han de coincidir exactament amb l’espai que ocuparan al web, ni més ni menys.
3. Desa per a web
Aquesta opció segur que ja la coneixeu si sou professionals del disseny web, i pot estalviar molt de temps si s’incorpora correctament al vostre flux de treball.
Consisteix simplement a desar les imatges amb què treballeu en format web, és a dir, optimitzades.
Aquí teniu una comparativa: de dreta a esquerra, una imatge desada per a web al 100, 70, 50 i 20 %. Segons la mida original, la diferència pot ser més o menys apreciable.
Hi ha moltes teories sobre el percentatge de qualitat ideal, però el millor és que feu servir la vostra intuïció: proveu, deseu, feu zoom, compareu… el que calgui. És la millor manera d’entrenar la vostra mirada i aconseguir un resultat òptim.
4. Necessito realment aquestes imatges al meu disseny web?
És una pregunta clau que, juntament amb d’altres, forma part de l’anàlisi del projecte web. Un bon disseny web parteix d’una anàlisi de necessitats, així que no es tracta de posar-hi més imatges perquè sí, sinó de valorar-ne la necessitat real.
5. Utilitza el format adequat
Hi ha diferents formats d’imatge, cadascun amb les seves particularitats, avantatges i inconvenients.
Conèixer-los t’ajudarà a aplicar el format més adequat en cada cas.
Si tens qualsevol dubte, truca’ns a l’estudi de Barcelona i t’ajudarem en tot el que calgui.
