Seleziona una pagina

Errori Gtmetrix

Errori GTmetrix

Errori GTmetrix

Deferring parsing of JavaScript

Ci sono diversi plugin che permettono di risolvere il problema del parsing.

Personalmente preferisco intervenire direttamente nel file function.php del tema, anche se ho notato incompatibilità nel backend tra questa funzione e il plugin Yoast by SEO.

Con questa funzione, infatti, probabilmente su alcuni siti vi sarà impossibile agire sull’ottimizzazione SEO della singola pagina.

Ecco il codice da inserire nella parte inferiore del file functions.php del tema:

function defer_parsing_of_js ( $url ) {
if ( FALSE === strpos( $url, '.js' ) ) return $url;
if ( strpos( $url, 'jquery.js' ) ) return $url;
return "$url' defer ";
}
add_filter( 'clean_url', 'defer_parsing_of_js', 11, 1 );

Se con questo codice non risolvete non resta che testare gli altri metodi che esistono.

Il plugin W3 Total Cache nella sezione Minify forse potrà aiutarvi a sistemare l’errore.

Basterà abilitare il minify e poi impostare il minify di tipo “Non blocking using “defer”” su prima del tag head.

Se noti che nemmeno questo metodo risolve il tuo errore c’è un terzo sistema che uso spesso e che ha fatto salire lo score dei miei siti web.

Si tratta della combo dei 2 plugin Autoptimize + Async.

Sono plugin dello stesso sviluppatore che bloccano i file js e css: dopo averli installati vi basteranno 2 click per configurarli.

Alcuni utilizzano anche un quarto sistema, ma io ancora non l’ho sperimentato.

Si tratta del plugin gratuito Scripts To Footer.

Serve scaled images

Segui i consigli per ottimizzare le singole immagini a cui fa riferimento GTMetrix.

Ci sono 2 sistemi:

  • dal backend WordPress alla voce “Media”, fai click sull’immagine incriminata e poi su “Modifica”: apparirà una schermata in cui potrai ridimensionare l’immagine con le misure consigliate da GTmetrix.
  • con il plugin gratuito Smush

Inoltre: pensa di utilizzare un plugin tipo EWWW Image Optimizer per evitare questo errore in futuro.

Specify Image dimensions

Questo errore significa che nel vostor sito ci sono delle immagini che mancano degli attributi di altezza e larghezza impostati col CSS.

Prima esisteva un plugin chiamato Specify Image Dimensions, ma adesso non è aggiornato da tempo.

Per risolvere potete provare ad inserire questo codice nel vostro file functions.php:

add_action( 'plugins_loaded', 'factmaven_spcimg_buffer', 10, 1 );

function factmaven_spcimg_buffer() { // Enable output buffering for our function
    ob_start( 'factmaven_spcimg_specify_image_dimensions' );
}

function factmaven_spcimg_specify_image_dimensions( $content ) { // Automatically insert width and height attributes
    if ( is_admin() && ( ! defined( 'DOING_AJAX' ) || ! DOING_AJAX ) ) { // Don't run the function in the admin panel
        return $content;
    }

    preg_match_all( '/<img[^>]+>/i', $content, $images );
    if ( count( $images ) < 1 ) { // Don't change content if there are no images
        return $content;
    }

    foreach ( $images[0] as $image ) {
        preg_match_all( '/(src|alt|title|class|id|width|height)=("[^"]*")/i', $image, $img );
        if ( !in_array( 'src', $img[1] ) ) {
            continue;
        }
        if ( !in_array( 'width', $img[1] ) || !in_array( 'height', $img[1] ) ) {
            $src = $img[2][array_search( 'src', $img[1] )];
            $alt = in_array( 'alt', $img[1] ) ? ' alt=' . $img[2][array_search( 'alt', $img[1] )] : '';
            $title = in_array( 'title', $img[1] ) ? ' title=' . $img[2][array_search( 'title', $img[1] )] : '';
            $class = in_array( 'class', $img[1] ) ? ' class=' . $img[2][array_search( 'class', $img[1] )] : '';
            $id = in_array( 'id', $img[1] ) ? ' id=' . $img[2][array_search( 'id', $img[1] )] : '';
            list( $width, $height, $type, $attr ) = getimagesize( str_replace( "\"", "" , $src ) );

            $image_tag = sprintf( '<img src=%s%s%s%s%s width="%d" height="%d" />', $src, $alt, $title, $class, $id, $width, $height );
            $content = str_replace( $image, $image_tag, $content );
        }
    }
    return $content;
}

Serve resources from a consistent URL

Si ha questo errore quando una risorsa viene chiamata da 2 differenti URL.

Ad esempio, immagina che due plugin totalmente non correlati utilizzino lo stesso carattere sul tuo sito Web WordPress. Ognuno di loro invierà richieste separate per utilizzare quel determinato carattere e questo porterà traffico non necessario al tuo HTTP e, di conseguenza, il tuo sito web si caricherà più lentamente.

Per risolvere questo problema, è necessario controllare il codice utilizzato nei plug-in, i temi e anche gli URL utilizzati nel sito Web. Devi essere paziente e controllare ogni URL uno per uno.

Se vedi due URL diversi per un file, eliminane uno immediatamente. Possono essere per file Js, immagini o persino file CSS. Il nostro obiettivo è eliminare gli URL non necessari che richiedono un file dal server.

Minify e Inline

Tutte le voci che riguardano l’ottimizzazione “Minify” possono essere risolte facilmente con una corretta configurazione di W3 Total Cache o altri plugin similari come Wp Rocket o Autoptimize.

Ho creato una guida apparte.

Pingdom: errori comuni

Con Pingdom gli errori che mi sono trovata più spesso ad affrontare sono:

Pingdom errori comuni

Pingdom errori comuni

Diminuire le richieste HTTP in “Make fewer HTTP requests”

L’errore in questa voce significa che il vostro sito web fa troppe richieste al server.

Non è una cosa molto semplice da risolvere e non ci basterà un plugin e qualche riga di codice perchè la colpa potrebbe essere di file tuoi o di terze parti.

Per scoprire la causa del problema vai su Website Grader, inserisci  l’URL del tuo sito e la tua email per ricevere un report gratuito di perfomance

Nel report cerca di identificare il problema guardando bene le 3 voci: Page Size, Page Requests e Page Speed.

Se, ad esempio, hai poche richieste ma dimensione pagina elevata potrebbe essere colpa dei media inseriti quindi probabilmente avete troppi file.

Per scoprire bene a fondo il problema dovrai utilizzare lo strumento per sviluppatori di Google andando sui 3 puntini in alto a destra di Chrome e poi su Altri strumenti > Strumenti per sviluppatori.

Vai alla voce “Network“, ricarica la pagina e controlla gli elementi che creano più richieste HTTP soffermandoti su quelli che hanno valori maggiori di pesantezza e tempo.

Tieni conto che le immagini dovrebbero pesare meno di 100 KB, mai MB.

Se trovi molti file di tipo stylesheet e script significa che devi minimizzarli per ridurre le richieste (abbiamo già parlato del “minify” dei file javascript, CSS e Html ti ricordi?).

Facendo click sulla singola riga della richiesta a sinistra troverai ulteriori dettagli.

Soffermati nella sezione “Header” e controlla “age” e il dominio di appartenza.

Se non riguardano il tuo dominio ma quello di qualche plugin indispensabile che utilizzi non puoi farci niente purtroppo.

Permettere i cookie per risorse statiche “Use cookie-free domains”

Un’errore in questa voce ti sta dicendo “Ehi man, utilizza i cookie per le risorse statiche”.

Se utilizzi W3 Total Cache ti basterà andare in Browser Cache > General e disabilitare la voce Don’t set cookies for static files (Removes Set-Cookie header for responses).

Se non funziona aggiungi questo codice al tuo file functions.php:

// Remove Query Strings from Static Resources

function remove_cssjs_ver( $src ) {
 if( strpos( $src, '?ver=' ) )
 $src = remove_query_arg( 'ver', $src );
 return $src;
}
add_filter( 'style_loader_src', 'remove_cssjs_ver', 10, 2 );
add_filter( 'script_loader_src', 'remove_cssjs_ver', 10, 2 );

Se utilizzi il CDN Cloudfare questo errore significa che devi bypassare il cookie _cfduid di Cloudflare per le risorse statiche.

Sistemare la voce “Add Expires headers”

Hai impostato la scadenza giusta per la cache?

Se hai riscontrato questo errore in Pingdom ti conviene leggere la guida su come velocizzare il tuo sito WordPress.

Se utilizzi il plugin W3 Total Cache per la cache del browser fai attenzione a non duplicare le regole nel tuo file .htaccess.

Compress components with gzip

Abilitare la compressione gzip è di fondamentale importanza per la velocità del tuo sito web.

Abbiamo parlato nella guida su come velocizzare il tuo sito web, se l’hai abilitata su W3 Total Cache e continui ad avere un errore allora potrebbe esserti utile questo codice da inserire in .htaccess:

<IfModule mod_headers.c>
  <FilesMatch ". (Js | css | xml | gz | html) $">
    Intestazione append Vary: Accept-Encoding
  </ FilesMatch>
</ IfModule>

Google Page Speed Insight: errori risolvibili

Errori PageSpeed Insight Google

Errori PageSpeed Insight Google

Rimanda immagini fuori schermo

Lo so, non si capisce bene cosa vorrebbe dirti Google.

Si sta riferendo al lazy loading per il caricamente lento delle immagini che sono fuori dallo schermo visibile.

Hai installato un plugin per il lazy loading?

Pubblica immagini in formati più recenti

Hai troppe immagini png rispetto a jpeg?

Non preoccuparti, anche se hai migliaia di immagini, esiste un plugin che può convertire per te i tuoi media da un formato all’altro.

Puoi utilizzare Smush o EWWW Image Optimizer nelle loro verisoni gratuite. Scegline uno e installalo: ti sarà utile anche per il lazy loading!

Riduci i tempi di risposta del server (TTFB)

TTFB è l’acronimo di time to first byte (tempo al primo byte). In parole semplici, è la misura di quanto deve aspettare il browser prima di ricevere il primo byte di dati dal server.

Maggiore è il tempo necessario a ricevere questi dati, maggiore sarà il tempo necessario a visualizzare la tua pagina.

Le domande da farti in questo caso sono:

  • I tuoi DNS puntano correttamente all’IP del server?
  • Hai installato troppi Plugin?
  • Il tuo hosting utilizza un sistema di cache integrato?

Se i tuoi DNS puntano correttamente e non hai istallato molti plugin, probabilmente è un problema di scelta dell’Hosting.

Se hai Siteground come hosting attiva la Supercache: sicuramente non avrai questo errore.

Solitamente un buon TTFB dovrebbe essere inferiore ai 200 millesecondi.

Misura questo valore con la massima precisione inserendo l’URL del tuo sito in Geekflare: è gratis!

Elimina le risorse di blocco della visualizzazione

Se rilevate questo errore probabilmente ci sono troppi file JS e CSS che vengono caricati prima dei contenuti della tua pagina.

Per eliminare questo errore ci sono due modi:

  • Installa WP Rocket (a pagamento)
  • Autoptimize + Adync Javascript (combinazione gratuita di 2 plugin)

Ritestare le modifiche

Quando correggi gli errori prima di ritestare il tuo sito web ricordati di eliminare la cache, aspettare qualche minuto e accedere in modalità in incognito!