Elementor

Widget Immagine Elementor: come inserire, ottimizzare e stilizzare le immagini

Il widget Immagine di Elementor permette di inserire immagini singole all’interno di pagine e sezioni. È uno strumento semplice, ma ha un impatto diretto su design, UX, accessibilità e performance.

Inserire un’immagine

Per usare il widget, trascinalo dentro un container e seleziona un file dalla Libreria Media di WordPress. Puoi scegliere dimensione immagine, allineamento, didascalia e link. La scelta della dimensione è importante: caricare un’immagine enorme dove serve una miniatura rallenta la pagina.

Alt text e accessibilità

Ogni immagine significativa dovrebbe avere un testo alternativo. L’alt text aiuta gli screen reader e fornisce contesto quando l’immagine non viene caricata. Non deve essere una lista di parole chiave, ma una descrizione utile.

Stile e coerenza visiva

Dal pannello Stile puoi gestire larghezza, opacità, bordi, radius e ombre. Usa questi controlli con coerenza. Se ogni immagine ha uno stile diverso, il sito perde ordine visivo.

Immagini e performance

Le immagini sono spesso una delle principali cause di pagine lente. Prima di caricarle, ridimensionale, comprimile e usa formati moderni quando possibile. Elementor ti aiuta nella gestione del layout, ma non sostituisce una buona ottimizzazione media.

Per approfondire, leggi Come ottimizzare le performance di una pagina Elementor.

Responsive

Controlla sempre come l’immagine si comporta su mobile. A volte una foto orizzontale perfetta su desktop diventa poco leggibile su smartphone. In alcuni casi conviene usare immagini diverse o modificare larghezze e spaziature per dispositivo.

Vedi anche Responsive design con Elementor.

Conclusione

Il widget Immagine è essenziale, ma va usato con criterio. Una buona immagine deve essere pertinente, leggera, accessibile e coerente con il design complessivo della pagina.