Per pubblicare foto ad alta risoluzione (HR) su WordPress senza rallentare il sito, ridimensiona il lato lungo a massimo 1200-1920 pixel e mantieni il peso del file sotto i 200-300 KB.
Converti le immagini in formato WebP o JPEG e usa una compressione bilanciata prima di caricarle nella libreria
Regole per il Ridimensionamento
Larghezza massima:
Imposta il lato lungo tra 1200 px (per contenuti standard nel testo) e 1920 px (per sfondi o immagini hero a schermo intero).
[ Inizio Pagina ]
Rapporto di forma:
Formati per Banner e Blog
Usa formati comuni come 16:9 per i banner o 3:2 per le foto dei blog.
[ Inizio Pagina ]
Risoluzione:
Imposta il valore a 72 PPI (pixel per pollice), lo standard ideale per il web.Strumenti e
[ Inizio Pagina ]
Ottimizzazione Compressione preventiva:
Riduci il peso del file tramite tool online gratuiti come TinyPNG prima di procedere con l’upload.
[ Inizio Pagina ]
Plugin WordPress:
Installa strumenti automatici come Imagify o ShortPixel per comprimere e convertire le immagini in WebP direttamente in fase di caricamento.Vuoi procedere con:Una guida per configurare un plugin di compressione automaticoI parametri esatti di esportazione da usare in Photoshop
[ Inizio Pagina ]
Titolo Immagine
L’utente visualizzerà il titolo immagine quando passerà sulla foto con il mouse;
Non è corretto non inserire alcun “Titolo”.
Alcuni Fotografi hanno questa errata convinzione: La Foto “E’ senza Titolo”.
Tuttavia, per tutte le regole di “Usabilità, Accessibilità, SEO, Funzionamento del Motore di Ricerca Google, etc.” la mancanza del Titolo è considerata un Grave Errore e penalizza la Funzionalità di Google e del SEO
Ci sono modalità che possono “Aiutare”, esempio: Nome e Cognome dell’Autore, Data, Località el’eventuale apparteneza ad una “Galleria” o “Raccolta” che dir si voglia
Come inserire il titolo immagine?
Puoi aggiungere gli attributi del titolo dell’immagine in WordPress tramite la tua Libreria multimediale.
Dal menu di sinistra del pannello di controllo clicca su Media>Libreria
Testo alternativo Immagine
Il testo alternativo viene utilizzato dai browser che non sostengono la visualizzazione
[ Inizio Pagina ]
Aggiungere il testo alt alle immagini
Il testo ALT si riferisce all’attributo ALT o al testo alternativo applicato alle immagini del sito. I tag ALT sono utilizzati dai lettori di schermo per gli utenti ipovedenti e forniscono un contesto aggiuntivo alle immagini. Anche i motori di ricerca li utilizzano per capire meglio il contenuto delle immagini e la loro relazione con i contenuti che le circondano.
Ad esempio, se qualcuno utilizza il software Dragon Naturally Speaking, il testo ALT potrebbe aiutarlo a navigare meglio nella pagina. Quando visualizzate l’HTML del sito, potete individuare gli attributi alt all’interno dei tag , in questo modo:
Dovreste sempre aggiungere il testo ALT alle immagini. Se non l’avete ancora fatto, potete tornare indietro e farlo ora.
Come inserire il tag ALT immagine?
Dal menu di sinistra del pannello di controllo clicca su Media>Libreria
Vedrai quindi le immagini del tuo sito. Cliccando su un anteprima dell’immagine vedrai una schermata che alla sua destra riassume gli attributi testuali dell’immagine. Modifica il testo: Testo alternativo.
Didascalia Immagine
La didascalia non è nient’altro che un piccolo testo che sarà visualizzato sotto la foto;
Come inserire il tag Didascalia immagine?
Dal menu di sinistra del pannello di controllo clicca su Media>Libreria
Vedrai quindi le immagini del tuo sito. Cliccando su un anteprima dell’immagine vedrai una schermata che alla sua destra riassume gli attributi testuali dell’immagine. Modifica il testo: Didascalia.
[ Inizio Pagina ]
Descrizione Immagine
la descrizione sarà visualizzata nelle pagine degli allegati pubblici, nel momento in cui l’utente fa click su un media per visualizzarlo nella versione originale.
[ Inizio Pagina ]
Come inserire il tag Descrizione immagine?
Dal menu di sinistra del pannello di controllo clicca su Media>Libreria
Vedrai quindi le immagini del tuo sito. Cliccando su un anteprima dell’immagine vedrai una schermata che alla sua destra riassume gli attributi testuali dell’immagine. Modifica il testo: Descrizione.
[ Inizio Pagina ]
Dare il nome giusto ai file immagine
Questa è una cosa che molti proprietari di siti web sbagliano. I nomi dei file delle immagini sono importanti! Con alcune buone pratiche SEO corrette, potrete ottenere un buon incremento sia nelle SERP che nella Ricerca Immagini di Google.
Alcune linee guida includono:
- Prima di caricare i file di immagine, assegnargli sempre un nome che contenga le parole che si riferiscono al contenuto. Ad esempio, invece di DC0000.jpg, nominate l’immagine seo-tips.jpg.
- Includere sempre i trattini tra le parole nei nomi dei file immagine. Ad esempio, se chiamate un file seo_tips.jpg o seotips.jpg, Google non sarà in grado di leggerlo. Legge solo i file con i trattini che contengono le singole parole, quindi dovrete nominare l’immagine seo-tips.jpg.
- Se possibile, includere la parola chiave principale, almeno per l’immagine in primo piano. Noi utilizziamo sempre le nostre parole chiave principali nelle immagini in evidenza dei nostri blog post.
- Mantenere i nomi dei file in minuscolo. In questo modo gli URL delle immagini rimarranno puliti e uniformi per tutti gli URL.
Queste sono regole piuttosto semplici da implementare per i futuri caricamenti di file.
[ Inizio Pagina ]
[ Inizio Pagina ]
Qual È la Dimensione Ideale dell’Immagine di Header di WordPress?
Analogamente alle immagini in evidenza, le immagini di header possono dare a chi legge un’anteprima del tema e dell’atmosfera della pagina. Anche se non sono predisposte per essere condivise nelle pagine dei risultati di ricerca o nei feed dei social media, è comunque importante che abbiano le dimensioni giuste per una questione di velocità e integrità del sito.
Poiché le immagini di header dipendono spesso dal design del sito, le loro dimensioni possono variare notevolmente. Non esiste uno scenario “uguale per tutte le situazioni”, quindi è meglio prendere in considerazione il design e la reattività del sito prima di scegliere le dimensioni dell’immagine di header di WordPress.
Detto questo, chi sviluppa temi raccomanda che le immagini dell’header di WordPress si attengano a un rapporto di 16:9, come per esempio:
1920 × 1080 pixels
1280 × 720 pixels
1152 × 648 pixels
Come per le immagini in primo piano, WordPress non stabilisce una dimensione predefinita per le immagini di header. Tuttavia, il vostro tema potrebbe avere un’opzione per personalizzare le dimensioni dell’header attraverso le impostazioni del tema, nel menu Aspetto.
Se il tema scelto non offre un’opzione per modificare le dimensioni dell’immagine dell’header di WordPress, potete comunque regolarle da voi. Vediamo come fare più avanti.
[ Inizio Pagina ]
Ottimizzare le Vostre Immagini
Nessuna guida sulle immagini è completa senza un riferimento all’ottimizzazione delle immagini. Anche se abbiamo già parlato dell’ottimizzazione delle immagini dettagliatamente, certamente non farà male aggiungere qui alcuni suggerimenti.
Dopo tutto, quando si aggiungono dimensioni personalizzate delle immagini, è necessario sapere come ottimizzarle in modo da essere certi che non influenzino le prestazioni del sito o consumino più risorse del server del necessario.
Detto questo, ecco alcuni suggerimenti veloci per iniziare con l’ottimizzazione delle immagini.
[ Inizio Pagina ]
Scegliere il Tipo di File
Potete ridurre le dimensioni delle immagini in modo significativo semplicemente scegliendo il giusto tipo di file. Anche se ci sono molti tipi di file immagine, la maggior parte delle immagini sono JPEG o PNG.
JPEG è il formato più adatto alle immagini colorate. In più, è possibile comprimere i file JPEG per ridurne la dimensione con una piccola riduzione della qualità (se lo fate bene).
PNG di solito è una soluzione migliore per i disegni, il testo, la maggior parte delle schermate e la grafica.
[ Inizio Pagina ]
Ridimensionare le Immagini
Ridimensionare le immagini è un modo semplice e veloce per ridurre la dimensione dei file. Come regola generale, dovreste assicurarvi che tutte le immagini sul vostro sito siano grandi solo quanto necessario.
Se la larghezza massima del vostro sito web è di 1200px, non ha senso avere una sola immagine con una larghezza maggiore di quella massima.
Abbiamo anche parlato dell’importanza di non creare nuove dimensioni di immagini personalizzate a meno che non sia necessario, quindi ricordate anche questo.
[ Inizio Pagina ]
Salva per Web con PhotoShop
Scopri come utilizzare l’opzione di esportazione in Adobe Photoshop per salvare immagini pronte per il web mantenendo il file PSD originale.
Segui la Procedura sul Sito PhotoShop [Italiano]
[ Inizio Pagina ]
Lascia un commento