Ridurre pagina di WordPress larghezza di hosting

Vuoi accelerare il vostro sito WordPress? Vuoi conoscere i trucchi di ottimizzazione di WordPress che possono aiutare a ridurre il tempo di caricamento del sito? In questo articolo, vi mostreremo come velocizzare WordPress condividendo quanto abbiamo ottimizzato il nostro sito List25 per migliorare le prestazioni.

Velocità WordPress Probabilmente avete sentito è importante per il SEO. Un sito più veloce ha coinvolgimento più utenti, più pagine visualizzate, e le vendite migliori. In uno studio caso strangeloop, hanno scoperto che un secondo di ritardo può costare il 7% del fatturato, l'11% in meno di pagine visualizzate, e il 16% diminuzione nella soddisfazione del cliente.

Quindi, come si fa realmente velocizzare WordPress?

Bene, invece di condividere un elenco di suggerimenti di velocità, abbiamo deciso di fare un caso di studio completo per visualizzare i risultati dal nostro sito List25 insieme a come abbiamo realizzato il tutto.

List25 è un blog intrattenimento iniziato dal nostro fondatore Syed Balkhi. Il sito ha oltre 1,5 milioni di abbonati, e il canale di YouTube ha oltre trimestre miliardi di visualizzazioni.

Il contenuto del sito è per lo più immagini e video che riprende terabyte di banda, in modo ottimizzazione globale di velocità è stato fondamentale per noi mantenere bassi i costi, ridurre pagina abbandono e migliorare il tempo sul posto.

Prima di iniziare l'ottimizzazione, il nostro sito ha preso 2,21 secondi per caricare in base al Pingdom. Dopo ci hanno fatto, il nostro tempo di caricamento della pagina è sceso a 1,21 secondi (

Durante questa ottimizzazione, siamo stati in grado di accelerare il nostro tempo di risposta del server, di migliorare il nostro punteggio prestazioni di velocità pagina, ridurre il numero di richiesta di totale, e migliorare il tempo complessivo di caricamento.

Diamo uno sguardo alle tecniche di ottimizzazione che ci hanno aiutato accelerare il nostro sito WordPress.

Avere un buon host web è fondamentale per la velocità di sito web. Come il nostro sito è diventato più popolare, abbiamo semplicemente diventato troppo grande per la nostra azienda di hosting precedente (HostGator).

I loro server semplicemente non in grado di gestire un sito di queste dimensioni perché List25 riceve decine di milioni di pagine visualizzate. HostGator è grande per i siti più piccoli, ma non per qualcosa di questa portata.

Abbiamo esaminato varie opzioni di WordPress di hosting gestito, e alla fine finito per usare SiteGround per ospitare List25 perché hanno offerto il miglior valore complessivo di questo sito.

Si può vedere il miglioramento nel nostro tempo di risposta del server immediatamente. Siamo passati da max 442ms a 172ms tempo di risposta. Questo è un miglioramento del 256%.

Siteground ha costruito booster prestazioni per piattaforme specifiche come WordPress, Joomla e Magento. Basato sulla piattaforma del vostro sito, appositamente ottimizzare i server che si traduce in una migliore performance complessiva.

Abbiamo scritto un articolo su quando si dovrebbe cambiare il vostro hosting web che parla dei 7 indicatori chiave.

Ridurre pagina di WordPress larghezza di hosting per ridurre

Se stai cercando di passare da host, quindi sicuramente dare SiteGround una prova. gli utenti WPBeginner ottenere un esclusivo sconto del 60% su hosting + dominio gratuito.

Quando si tratta di accelerare WordPress, il caching è il secondo fattore più importante dopo il vostro web hosting.

Normalmente, quando un visitatore accede al sito WordPress, il server passa la richiesta PHP per database MySQL che trova la pagina che si sta richiesto, genera al volo, e vederlo al visitatore. Questo richiede un sacco di risorse. Quando si dispone di caching, consente di risparmiare tempo e risorse.

Lo schema seguente evidenzia il processo. In parole povere, pensare a caching come la creazione di un collegamento sul desktop, che consente di ottenere il file più velocemente.

Per il sito List25, stiamo usando il SiteGround SuperCacher, un plugin che appositamente costruite per i loro clienti. In cima a quello, hanno aggiunto le opzioni di caching dinamiche avanzate utilizzando Vernice (parte del loro richiamo prestazioni).

Se non siete su Siteground. quindi non preoccupatevi. È possibile memorizzare nella cache l'installazione sul vostro sito WordPress utilizzando una delle tante soluzioni disponibili come W3 Total Cache o WP Super Cache.

A WPBeginner, stiamo usando W3 Total Cache, che fornisce una serie di opzioni page caching, caching del database e caching degli oggetti.

Mentre sempre più aziende di hosting sono specializzate per WordPress, vedremo più soluzioni di caching personalizzato costruito. Pagely e WPEngine offrono anche il proprio sistema di caching incorporato.

Content Delivery Networks (CDN) può aiutare a aumentare la vostra velocità di sito web. Abbiamo utilizzato MaxCDN dall'inizio del List25, quindi questa parte non è cambiato.

Abbiamo scritto un articolo completo su ciò che è una CDN e perché ne hai bisogno insieme a un'infografica.

CDN permette di servire tutti i CSS, Javascript e immagini da un Content Delivery Network. Questo funziona determinando la posizione del visitatore del sito, e servire contenuti da un server più vicino al visitatore.

Se non siete nel mercato per una soluzione premium CDN, quindi è possibile utilizzare Cloudflare.

Quando si aggiungono più plug-in, spesso aggiungono i propri file JavaScript e CSS. Ogni file supplementare è una nuova richiesta HTTP.

Abbiamo combinato questi file JavaScript e CSS in un unico file per ogni per ridurre le richieste e velocizzare il tempo di caricamento. È possibile visualizzare ulteriori dettagli su questo su come plugin WordPress influenzare il tempo di caricamento.

Mentre stiamo caricando qualche piccola funzionalità che non potremmo aver bisogno su una particolare sezione del sito, questo codice viene memorizzato nella cache del CDN, e risultati mostrano che un minor numero di richieste di file offrono prestazioni migliori rispetto al caricamento di più file JS più piccoli.

Questo è qualcosa che si deve fare su una base regolare, perché i plugin si usa il cambiamento straordinario.

Abbiamo fatto uso di una sprite un'immagine che ha unito diverse icone sociali e sito in una sola immagine:

Ogni volta che abbiamo bisogno di visualizzare un'icona particolare, avremmo usato i CSS per:

Caricare l'immagine come immagine di sfondo
Definire la larghezza e l'altezza dell'elemento abbiamo bisogno l'icona
Impostare la posizione di sfondo per la nostra immagine per caricare l'icona necessaria

Ad esempio, per caricare le icone dei media sociali della barra laterale, usiamo:

Il background-position. Larghezza e altezza CSS proprietà ci aiuta rivolgiamo la sezione specifica dell'immagine che vogliamo uscita:

Di conseguenza, solo la prima richiesta di questo file immagine sta usando la larghezza di banda. Le richieste successive alla CDN per l'immagine comporterà la versione memorizzata nella cache (tipicamente locale) viene caricato, così come solo la necessità di richiedere una singola immagine vs 6 diverse icone sociali.

Grazie alla combinazione di JavaScript, CSS e immagini insieme, abbiamo ridotto il numero di richieste in modo significativo.

Codice minification comporta la rimozione di spazi e interruzioni di riga per ridurre le dimensioni del file rendendo più veloce da caricare quando richiesto.

Per List25, usiamo SCSS, un foglio di stile la sintassi basata (Introduzione al Sass). Questo ci permette di strutturare i nostri file CSS attraverso diverse aree dello sviluppo in un layout di facile lettura:

Usiamo CodeKit per poi compilare i file SCSS in un singolo file CSS. CodeKit rimuove anche spazi bianchi e le interruzioni di riga al fine di garantire il file è più piccolo possibile:

Di conseguenza, siamo stati in grado di ridurre la nostra dimensione del file CSS del 28%.

Abbiamo ottimizzato le nostre immagini in due aree: il nostro tema WordPress e contenuti caricati.

Per il nostro tema WordPress, abbiamo usato CodeKit per garantire che tutte le immagini sono state senza perdita di qualità compressi. Questo assicura che le dimensioni dei file sono il più piccolo possibile, senza alcuna perdita di qualità.

Abbiamo anche educati tutti i nostri scrittori circa l'importanza di salvare le immagini ottimizzate per il web. Vedi la nostra guida su come salvare le immagini ottimizzate per il web.

condivisione sociale per List25 è veramente importante, proprio come qualsiasi altro sito web. Tuttavia condivisione sociale plugin possono rallentare in modo significativo il vostro sito.

Mentre l'integrazione di questi quattro script rete sociale non impatto il tempo di caricamento della pagina nei nostri test, è visibilmente rallentato il sito Web durante la visualizzazione su un dispositivo mobile. pulsanti di condivisione sociale sarebbe prendere pochi secondi per comparire, nonostante gli script di carico in modo asincrono, con conseguente il contenuto del post muoversi come i pulsanti caricati in vista.

Per affrontare questo problema, ci siamo trasferiti in un (quasi) soluzione Javascript-libera. Ognuno dei pulsanti di condivisione del social network sono resi dalla nostra abitudine WordPress Plugin, e Javascript del tema viene utilizzato solo per aprire la finestra del browser web quando l'utente fa clic su un pulsante.

Tuttavia, abbiamo ancora voluto per visualizzare il numero totale di azioni un post ha avuto su tutte le reti sociali. Per fare questo, abbiamo prodotto una piccola personalizzato WordPress Plugin per recuperare e memorizzare nella cache le quote di conti sociali di ogni social network nella meta tavolo Post. Questi conteggi vengono aggiornate ogni 24 ore, assicurando che richiede tempo query non sono costantemente in esecuzione.

È possibile utilizzare un'API come Sharre o sezionare il Floating sociale barra per la personalizzazione.

Usando di Pingdom RUM (Real Monitoring User), questo nuovo plugin quota è diminuita del ‘vero’ tempo di caricamento della pagina da 6 secondi a poco più di 2 secondi. Ha anche assicurato che abbiamo ridotto il numero di richieste per gli script di terze parti.

Abbiamo migliorato significativamente la velocità del nostro sito. tempo di caricamento è passato da 2,2 secondi a 1.22 secondi.

Siamo stati in grado di ottimizzare i tempi di risposta del server in modo significativo.

Ciò ha contribuito a ridurre il tempo speso per il download di una pagina da parte di Google bot, che ha aiutato il nostro velocità di scansione.

Il nostro tasso di rimbalzo complessivo è sceso del 7%, perché il sito è stato di caricamento più veloci, e dai padroni di casa di commutazione siamo stati in grado di ridurre gli errori del server.

Come si può immaginare con la frequenza di rimbalzo più bassa, il tempo trascorso sul sito è salito così da più di 30 secondi.

Come si può vedere un sito web caricamento più veloce può migliorare il coinvolgimento dei visitatori. Le tecniche di cui abbiamo parlato hanno coperto una serie di miglioramenti di base e intermedi che è possibile implementare per ottimizzare il vostro sito WordPress.

Ci auguriamo che questo articolo ha aiutato a velocizzare il tuo sito WordPress. Si consiglia inoltre di controllare il nostro articolo su 20 deve avere plugin WordPress per il 2015.

Se ti è piaciuto questo articolo, allora per favore iscriviti al nostro canale YouTube per video tutorial WordPress. È inoltre possibile trovare su Twitter e Facebook.

Guarda questo video!

Choose Hosting

Top 3

Ridurre pagina di WordPress larghezza di hosting

Articoli Correlati