Aggiungi intestazioni Expires

Come aggiungo le intestazioni Expires al file .htaccess?

GTmetrix o Pingdom mostrano l’errore “Add Expires headers”?

Che cos’è l’intestazione Expires?

Quali sono i passaggi per aggiungere intestazioni scadute a .htaccess?

Quando è il momento giusto per la scadenza dei file e della cache?

Spiegato in modo comprensibile come aggiungere le intestazioni Expires al file .htaccess.

Uno dei messaggi di errore più comuni durante il test del sito Web su Pingdom o GTmetrix è: Aggiungi intestazioni Expires.

Il messaggio di errore indica di aumentare il tempo trascorso sui file (immagini, HTML, CSS e JavaScript) che rimangono nella cache del tuo sito. La memorizzazione nella cache ha un impatto diretto sul tempo di caricamento del tuo sito web. La velocità del sito web è un’ottimizzazione SEO molto importante. Google considera la velocità del sito web un fattore di ranking significativo. Gli operatori di siti web che non hanno ottimizzato la velocità di caricamento del loro sito web non otterranno un buon posizionamento nei risultati di ricerca su Google in tempi di “mobile first”. I siti web che non sono ottimizzati per i dispositivi mobili nel 2019 e non hanno tempi di caricamento rapidi difficilmente si troveranno nelle prime posizioni dei motori di ricerca.

Quando un utente visita il tuo sito web sul web, il browser scarica automaticamente una serie di file. Ognuno di questi file ha una data di scadenza e rimane nella cache per un certo periodo di tempo. Se l’utente decide di visitare nuovamente altre pagine del tuo sito web o del tuo sito web, non è necessario ricaricare tutti i file. Se il tempo di scadenza dei file è impostato su un valore troppo breve, verrà visualizzato l’errore “Aggiungi intestazioni di scadenza”.

Come funziona l’intestazione Expires?

Le intestazioni scadute danno al browser il comando per scaricare e salvare questi file. Il motivo è quello di ridurre la quantità di invio e ricezione tra il computer e il server (cioè il sito web) e di utilizzare i dati memorizzati nella cache.

Di conseguenza, il caricamento di un sito Web appena effettuato rispetto a quando viene richiamato ripetutamente richiede un po’ più di tempo. A seconda del sito web, ci sono diversi file come HTML, CSS, JavaScript, grafica, immagini, PDF e altri file che fanno parte delle funzionalità del sito web e devono essere caricati.

Quindi, ogni volta che un nuovo utente visita il tuo sito web, tutti questi file vengono richiesti dal server. Ogni richiesta (per ogni singolo file) richiede un tempo di caricamento diverso a seconda del saluto del file. Tuttavia, quando alcuni file vengono inseriti in memoria, il numero di richieste diminuisce. Questo renderà il caricamento del sito web più veloce.

# Per quanto tempo i dati devono rimanere nella cache del browser?

Per impedire agli utenti di scaricare nuovamente i file condivisi, è necessario definire una data di scadenza per questi file. La data di scadenza definita indica al browser quale file richiedere al server e quale file richiedere alla cache.

Quali file vengono memorizzati nella cache?

Il primo passaggio consiste nel determinare quali file vengono aggiornati frequentemente e quali vengono aggiornati raramente.

File che vengono aggiornati raramente:
Immagini
Video
Audio
La favicon
Caratteri web, caratteri

File che vengono aggiornati più frequentemente:
Javascript e CSS
Testo

Come posso aggiungere le intestazioni Expires al file .htaccess per evitare l’errore “add expires headers”?

Aggiungi l’intestazione Expires al file .htaccess:
Il file .htaccess è spesso un file nascosto nella directory principale. Assicurati di fare un backup di questo file prima di apportare modifiche. Se qualcosa va storto, puoi ripristinare il file salvato.

1. Scarica il tuo file .htaccess. Se il file è nascosto, attiva l’opzione Mostra file nascosti nell’FTP.

2. Apri il tuo file .htaccess in un editor (Blocco note o Blocco note ++) e aggiungi il tuo codice con le date di scadenza. Questo può essere determinato individualmente in base alle vostre esigenze.

Ad esempio, utilizziamo il seguente codice, puoi copiarlo e usarlo adattato per il tuo .htaccess:

# Expires headers (for better cache control)
<ifmodule mod_expires.c>
        ExpiresActive on
        # Perhaps better to whitelist expires rules? Perhaps.
        ExpiresDefault                              "access plus 1 month"
        # cache.appcache needs re-requests in FF 3.6 (thanks Remy ~Introducing HTML5)
        ExpiresByType text/cache-manifest           "access plus 0 seconds"
        # Your document html
        ExpiresByType text/html                     "access plus 0 seconds"
        # Data
        ExpiresByType text/xml                      "access plus 0 seconds"
        ExpiresByType application/xml               "access plus 0 seconds"
        ExpiresByType application/json              "access plus 0 seconds"
        # Feed
        ExpiresByType application/rss+xml           "access plus 1 hour"
        ExpiresByType application/atom+xml          "access plus 1 hour"
        # Favicon (cannot be renamed)
        ExpiresByType image/x-icon                  "access plus 1 week"
        # Media: images, video, audio
        ExpiresByType image/gif                     "access plus 4 months"
        ExpiresByType image/png                     "access plus 4 months"
        ExpiresByType image/jpeg                    "access plus 4 months"
        ExpiresByType image/webp                    "access plus 4 months"
        ExpiresByType video/ogg                     "access plus 1 month"
        ExpiresByType audio/ogg                     "access plus 1 month"
        ExpiresByType video/mp4                     "access plus 1 month"
        ExpiresByType video/webm                    "access plus 1 month"
        # HTC files  (css3pie)
        ExpiresByType text/x-component              "access plus 1 month"
        # Webfonts
        ExpiresByType font/ttf                      "access plus 4 months"
        ExpiresByType font/otf                      "access plus 4 months"
        ExpiresByType font/woff                     "access plus 4 months"
        ExpiresByType font/woff2                    "access plus 4 months"
        ExpiresByType image/svg+xml                 "access plus 1 month"
        ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
        # CSS and JavaScript
        ExpiresByType text/css                      "access plus 1 year"
        ExpiresByType application/javascript        "access plus 1 year"
</ifmodule>
## EXPIRES END

Una breve spiegazione di questo:

< La query IfModule mod_expires.c> verifica se è installato il modulo server necessario.

ExpiresActive On attiva il modulo per il tuo sito web, seguito dalle informazioni su quali tipi di file devono essere memorizzati nella cache e per quale periodo di tempo. L’ora è specificata nel modulo “dall’ultimo accesso per il periodo X”, nell’esempio “accesso più 1 settimana”, cioè “dall’accesso per una settimana”. Una volta scaduto il periodo impostato, il file nella cache del browser verrà sostituito dalla versione corrente del tuo sito web.

Assicurati che l’ora sia sempre definita al plurale, cioè che ci sia una “s” alla fine (settimane, mesi, …). È possibile scoprire quali valori sono possibili come specifica temporale nella documentazione ufficiale del server web Apache: http://httpd.apache.org/docs/2.0/mod/mod_expires.html#AltSyn

3. Dopo aver apportato le modifiche al file .htaccess, non dimenticare di salvarlo e caricarlo nuovamente nella directory principale del tuo sito web, a meno che tu non abbia apportato una modifica diretta sul server.

Per quanto tempo deve essere impostata la scadenza dei file?

La durata della cache può essere impostata in anni, mesi, settimane, giorni, ore e persino secondi.

La data di scadenza di ciascun file deve essere impostata in base al tempo in cui viene utilizzato/richiesto.

La data di scadenza delle immagini può essere impostata su circa un anno, poiché di solito non vengono modificate e il caricamento delle immagini richiede la maggior parte del tempo.

È più probabile che HTML, CSS e JavaScript vengano aggiornati regolarmente. La data di scadenza può essere impostata su un mese o meno.