Qual è la giusta dimensione di un'immagine?

[umberto.croft]

Qual è la giusta dimensione di un'immagine?

Ciao a tutti, sto affrontando un tema abbastanza ostico per me, i core web vitals.

Al momento uno dei miei più grandi problemi sono le immagini.

Anche se dispongo di immagini che pesano più o meno 150 kb in png, riscontro parecchi problemi.

È anche vero che nelle pagine più corpose ho molte immagini.

Ho sempre usato (forse ingenuamente) la dimensione 2000x2000 px.

Voi mi consigliate di ridurle la metà (1000x1000 px) o c'è uno standard da non superare?

[g.lanzi]

Ciao @umberto-croft,
Personalmente non penso in px, ma kb.
Quando sistemo le immagini io ragiono così:

• 75dpi, sono più che sufficienti
• dimensioni in px: 1200 sul lato lungo massimo
• se non ci sono trasparenze assolutamente jpeg, al 75% di qualità, se ci sono trasparenze, ovviamente png.

In questo modo, solitamente, una jpg elaborata pesa circa 80-90kb, una png 150kb.
Se puoi imposta un lazy load. Di più, non puoi fare se non togliere delle immagini, a mio avviso.

P.S.
Ovviamente valuta di portare la dimensione anche al di sotto di 1200px, se sono immagini che non devono coprire grandi aree della pagina.

[umberto.croft]

Ciao @glanzi , grazie per i tuoi preziosi consigli.

Ho deciso di scaricare tutto in JPG e convertirli in WebP.

Hai qualche consiglio anche per gli embed di YouTube?

Credo che influiscano sulle velocità del sito.

[g.lanzi]

@umberto-croft
Ottima scelta quella di usare solo JPG e i WebP, a mio avviso.

Per gli embed di youtube, purtroppo non credo che tu possa farci molto, il video è quello che è.
Che metodo useresti per embedderali, Tag iframe o usi una funzione di un CMS?

[umberto.croft]

@glanzi uso esclusivamente Elementor, quindi tutto da lì.

[g.lanzi]

@umberto-croft
Ottimo, ci sto registrando un corso sopra
Fai così: aggiungi il link del video e un'immagine di copertina specifica nel campo apposito. In questo modo Elementor caricherà l'immagine e solo una volta che viene richiesto, caricherà il video. Per l'immagine valgono gli stessi parametri che ti ho detto prima, ovviamente. Anzi, in questo caso, puoi tranquillamente tenere le dimensioni intorno agli 800 pixel. Di solito la preview di un video su una pagina è ben più piccola.

Così non dovresti avere problemi di sorta.

Se poi hai delle statistiche che dicono che i video appesantiscono il caricamento, possiamo vedere nello specifico quale sia il motivo.

P.S.
Se stai cercando di migliorare la velocità del tuo sito su PageSpeed Insight, dovrai fare ben di più che ottimizzare le immagini. Considera AMPforWP come plugin per la versione amp e un ottimizzatore di JS, CSS, tipo W3TC o WP Autoptimizer.

[umberto.croft]

@glanzi ti ringrazio molto.

Attualmente sto usando WP Rocket.

[g.lanzi]

@umberto-croft Personalmente non l'ho mai usato, ma ne ho sentito parlare bene!

[umberto.croft]

@glanzi personalmente mi ci trovo bene.