Ciao e benvenuto alla prima lezione del corso “Preparare le immagini per il tuo sito web”!
In questa lezione faremo una breve introduzione a diversi aspetti che riguardano le immagini, al fine di ottimizzarle nel modo giusto prima di essere caricate sul tuo sito web.
Per prima cosa ti ricordiamo l’importanza di ridimensionare sempre le immagini prima di andarle a caricare sul tuo sito web.
E’ vero… le immagini che scatti col tuo Smartphone o con la tua super tecnologica macchina fotografica producono immagini splendide che è davvero un peccato non sfruttarle.
Allo stesso tempo, questo è però sinonimo di immagini che hanno una certa dimensione e peso, avendo un’ottima risoluzione.
Nessun problema comunque: riserva un po’ di spazio sul tuo pc per le immagini in formato originale e tienile a portata di mano, perchè queste potranno essere sfruttate per più scopi, ad esempio per effettuare ed utilizzare dei ritagli differenti per la grafica delle tue pagine, oppure per essere stampate.
Le immagini che andrai ad inserire nella tua pagina web dovranno essere ottimizzate dal punto di vista della dimensione e del peso in quanto, come hai già sentito in altre lezioni, queste andranno a sovraccaricare il tuo sito e andranno di conseguenza ad aumentare la velocità di caricamento delle tue pagine web.
Inoltre anche Google, da qualche tempo, tiene conto di questo fattore e siti web non ottimizzati da questo punto di vista, vengono penalizzati nei motori di ricerca.
Quali tipi di immagine puoi sfruttare per le tue pagine web?
Puoi utilizzare 3 diversi tipi di immagini:
- jpg, sono le classiche foto che vengono prodotte dal cellulare o dalla macchina fotografica
- png, sono le immagini con sfondo trasparente e che quindi possono essere utilizzate in fotomontaggi in quanto si possono sovrapporre a a sfondi particolari
- gif, sono quelle piccole animazioni che andavano tanto di moda anni fa e che si possono usare per creare bottoni animati, icone, ecc.
Quali sono le cose più importanti che puoi fare nel lavoro di preparazione delle immagini per il tuo sito web?
- Scalare proporzionalmente l’immagine, quindi ridurre in modo proporzionale sia la larghezza che l’altezza per evitare di dare quello spiacevole effetto distorto alle tue immagini. Assolutamente da evitare 🙂
- Tagliare le parti di troppo, quindi effettuare un ritaglio nel caso l’immagine abbia dei particolari che non ti interessano
Nel video vedrai un esempio 100% pratico dei due interventi.
Attenzione: nel video ci siamo dimenticate di aggiungere una cosa importantissima!!!
Prima di scalare o tagliare la tua immagine, ricordati di fare sempre una copia e di conservare l’originale in una cartella separata.
I pixel persi NON si possono più recuperare e l’immagine originale ti potrebbe sempre servire per altri scopi, per esempio per ottenere ritagli differenti.
Oppure potresti volerla stampare e per stamparla devi utilizzare sempre il file con la massima grandezza e risoluzione.