fbpx

Paripassi è il percorso di 12 mesi per imparare a gestire da sola sito e newsletter! DIMMI DI PIÙ!

Ottimizzare le immagini per siti e blog

27 Ottobre 2015Siti web

Ottimizzare immagini per siti e blog

Ottimizzazione delle immagini per il web: la mia nuova battaglia personale.
Basta con i siti che impiegano una vita a caricarsi e pesano più del Paradiso perduto di Milton!

Sabato 24 ottobre si è svolto a Torino il secondo Freelance Day organizzato da Toolbox.
Lo stesso Toolbox che è anche sponsor e (bellissima) location per i nostri mensili WordPress Meetup.
Tra i molti ed interessanti speech previsti in quella giornata spuntava anche un workshop chiamato WordPress 101, lo starter kit per farti il sito i cui relatori eravamo proprio noi, gli organizzatori del WP Meetup.
Io, emozionata oltre misura all’idea di dover parlare in pubblico, ho introdotto i freelance presenti all’uso di WordPress e, fra le altre cose, ho toccato un argomento che mi sta molto a cuore e sul quale ormai combatto una mia personale battaglia: L’OTTIMIZZAZIONE DELLE IMMAGINI PER IL WEB!

Lo ammetto, non ne posso più di vedere siti pesantissimi, che superano talvolta anche i 5GB di spazio web, perché carichi di fotografie PESANTI.
Le immagini, prima di essere caricate sul vostro sito o blog devono essere OTTIMIZZATE ovvero rese più leggere e idonee all’upload.

Perché ottimizzare le immagini per il web?

La risposta è semplice: per renderle meno pesanti e quindi per non sovraccaricare il vostro sito. Questo vi permetterà di avere un sito snello e veloce nel caricamento. Basta con i siti che impiegano anche 13 secondi (!!!) per caricare la loro homepage. Basta con le immagini da 3MB caricate nella vostra libreria media.
Non vi basta come spiegazione? Allora sappiate che lo spazio web su cui appoggiate il vostro sito lo pagate. Se riuscite a non superare i 5GB (per esempio!) risparmierete.
Inoltre la velocità di caricamento della homepage di un sito non solo influenza il lettore che, se deve aspettare troppo, si annoia e vi abbandona, ma è un fattore di cui tiene conto anche Google per indicizzarvi. Quindi non avete più scuse, ottimizzate queste immagini. Ora vi spiego come fare.

Come ottimizzare un’immagine per il web

Tre semplici regole vi aiuteranno ad ottenere immagini leggere e scattanti.

  • RISOLUZIONE: si esprime in PPI ovvero “pixel per inch” (pixel per pollice lineare) e indica quanti pixel devono starci in una linea lunga un pollice. Più pixel sono presenti più la risoluzione è alta. Per pubblicare sul web impostate serenamente la risoluzione a 72 ppi. Una fotografia a 300 ppi ha una risoluzione altissima che può essere apprezzata solo in stampa. Ma sul web non si vede la differenza in termini di qualità: sarebbe solo un inutile peso!
  • DIMENSIONE: è espressa dal numero di pixel della base per il numero di pixel dell’altezza della fotografia. Salvo casi particolari (immagini di sfondo del sito, immagini fullwidth ecc…) nelle pagine e nei post del vostro sito pubblicate immagini il cui lato maggiore sia al massimo 1200px. Non serve davvero a nulla caricare immagini da 3000px, se non ad appesantire – ancora – il sito. Siete curiosi? I fotografi che consegnano le loro foto per essere viste su dispositivi full HD le ridimensionano a 1980px. Quindi non esagerate, le dimensioni (in eccesso) non contano!
  • COMPRESSIONE: senza entrare troppo nella palude dell’entropia o della matrice, vi basti sapere che ogni immagine può essere compressa in modo che occupi meno spazio. JPEG e PNG, per esempio, sono formati compressi di immagine. Ma tutte le immagini possono essere ulteriormente compresse. Se state lavorando su una fotografia non comprimete più dell’80% (intorno al 76% di compressione appaiono le prime aberrazioni), se invece state creando una grafica con un semplice sfondo colorato, una cornicetta e una scritta (vanno molto di moda!) potete comprimere anche fino al 70%. Vedrete come diminuisce il peso della vostra immagine.

Quali programmi usare per ottimizzare le immagini per il web?

Semplice: quello con cui vi trovate meglio e con cui normalmente lavorate le vostre fotografie. Praticamente tutti i software di post produzione e grafica prevedono l’ottimizzazione per il web. A partire dai più professionali come Photoshop o Lightroom per arrivare a Gimp e tanti altri.
Per chi utilizza i sistemi Mac consiglio la leggerissima e super intuitiva app Pixer: trascinate sulla sua icona una qualunque immagine e digitate la dimensione che volete raggiungere (massimo 1200px, ve lo ricordate?). L’app – italiana al 100% – vi salverà un’immagine già ottimizzata per il web. Smart & quick.
Per chi invece lavora su Windows e desidera un programmino semplice semplice per l’ottimizzazione consiglio FastTone Photo Resizer. Un ottimo tool che oltre ad ottimizzare le immagini per il web vi permette anche di inserire watermark sulle vostre foto (ma usateli con moderazione!).

Tutto chiaro?
Ora ripetete con me: caricare immagini da 3MB (ma anche da 900KB…) su un sito non è funzionale. Ottimizziamo le fotografie e le grafiche prima di lanciarle nel web, così da mantenere in forma il nostro sito, senza rallentarlo.

Hai trovato utile questo contenuto?

Puoi offrirmi un caffè!

Ciao!

Ciao!

Sono Ljuba. Web designer freelance. Metà perfezionista e metà sognatrice. Femminista in divenire. In costante evoluzione e quasi sempre con i capelli ciclamino.
I siti che realizzo sono piacevoli da navigare, attraenti già dal primo sguardo, rispettosi delle regole di usabilità e accessibilità. Raccontano le mie clienti in tutto e per tutto, le definiscono come donne e professioniste che non hanno timore di farsi vedere per chi sono davvero. Conosciamoci meglio

4 Commenti

  1. Ale

    Grazie! Post davvero utilissimo; chiaro e semplice! 🙂

    Rispondi
  2. Gabriella

    Ciao Ljuba sono alle prime armi con WordPress e ho letto l’articolo sull’ottimizzazione delle immagini per il web.
    Appena mi metto in postazione provo il programmino che hai segnalato per Windows.
    Leggo sempre con piacere ed interesse i tuoi post. Grazie Gabriella

    Rispondi
    • Ljuba

      Ciao Gabriella, sono contenta che il post ti sia piaciuto. Fammi sapere come ti sembra il software. 🙂
      A presto, con il prossimo post.

      Rispondi
  3. yllen

    grazie per il tuo articolo!
    Ho una website davvero pesante oramai! URGE ottimizzazione!
    Adesso proveró a mettere in pratica i tuoi consigli!

    Rispondi

Trackback/Pingback

  1. Parlare in pubblico – broken spring - […] il mio piccolo grande mostro una sola volta finora, durante un brevissimo speech sull’ottimizzazione delle immagini per il web…

Invia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Creazione siti WordPress

WordPress in Pillole

Iscriviti al mio corso gratuito via mail che ti insegna a creare e gestire il tuo sito WordPress

Evviva, grazie per aver scelto di iscriverti a WordPress in Pillole. Ora devi cliccare sul link di conferma che hai ricevuto via mail.