Come ottenere punti 100 / 100 su Google Pagespeed per il tuo sito Web WordPress

0
998
intuizioni pagina di velocità

Google Pagespeed Insights è il noto strumento per siti Web con cui è possibile verificare e ottimizzare tutti i parametri rilevanti per il motore di ricerca. Puoi fare clic sul link sopra, o di solito vedere nel sistema di gestione, un valore aggiornato quotidianamente della tua pagina.

In questa guida, ti mostreremo quanto è facile Punteggio di velocità della pagina di 100 / 100 per raggiungere. Puoi farlo anche tu.

Per il nostro esempio, abbiamo utilizzato un sito Web demo con tutti i tipi di contenuti e un tema ben noto, che include anche i soliti plugin. Quindi, esattamente cosa creare buoni siti Web.

super-cibo-homepage

Siamo qui per il tema The7 deciso. Non importa quale tema utilizzi. La cosa principale è aggiornata e offre alcune opzioni di impostazione per la creazione del sito Web.

Questo è quello che ti serve per un sito web veloce.

  1. un host web veloce con esperienza
  2. un WordPress attuale pulito
  3. le giuste impostazioni per il web server
  4. uno strumento per ottimizzazioni e memorizzazione nella cache

Usiamo in questo esempio WP Rocket, Tutti questi strumenti fanno lo stesso. Comprimi i file di testo, comprimi il codice ed eventualmente crea una pagina statica come copia.

Ciò consente al visitatore di accedere rapidamente alla pagina.

Le pagine statiche ricordano il codice html di allora. I siti web che consistono solo in semplici codici HTML e immagini sono ancora i più veloci. Ma non dinamico. Ma con questi plugin, la cache viene sempre ricreata non appena qualcosa nella pagina è cambiato.

Suggerimento: disabilitare il WordPress Cronjob, Non è davvero un cronjob nel vero senso del termine, viene sempre chiamato quando un visitatore arriva alla pagina. Come farlo ti mostriamo in un altro articolo.

Google Pagespeed Insights

Inserisci il tuo sito Web corrente su google e guarda lo spettacolo.

Normalmente si ottengono i primi valori nell'area gialla, quindi fino a 85 se Webhoster ha un buon server.

Nella nostra installazione predefinita, PSI ci ha mostrato 85 / 100 nella vista desktop.

Installazione PSI standard di WordPress

Un po 'fuorviante, tuttavia, è l'affermazione che il server ha risposto lentamente. Qui si intende il tempo al primo byte che viene trasmesso.

Ci sono molti fattori che interagiscono qui. Spesso ridurrete il cosiddetto TTFB (Time to First Byte), se risolvete tutti gli altri punti.

Convenientemente, Google offre il codice ottimizzato da scaricare per molti punti. A questo punto, tuttavia, in genere raccomando solo di incorporare immagini precedentemente ottimizzate nel sito Web.

Puoi persino farlo gratuitamente con il Panda Tinypng fare.

tinypng-image-compressione
Tinypng.com Panda alimenta i byte ridondanti.

Tuttavia, la maggior parte dei temi crea anche le proprie immagini in diverse dimensioni, in modo che ritorni sempre a nuove esigenze di ottimizzazione.

È quindi consigliabile occasionalmente semplicemente riottimizzare e sovrascrivere tutti i file di immagine che risiedono sul web server.

Pingdom, GTMetrix and Co.

Naturalmente ci sono altre pagine di test. Qui, tuttavia, c'è spesso il problema che la chiamata è dall'estero e quindi non abbastanza significativa per simulare il solito visitatore dalla Germania. È anche importante sapere che alcuni programmi di test non sono in grado di gestire http / xnumx e ignorare esattamente il vantaggio di http / s, ovvero la trasmissione parallela di dati su una connessione e interpretarli negativamente.

GTmetrix
Rapporto sulle prestazioni GTMetrix

TTFB o tempo di caricamento totale?

Fondamentalmente, il risultato del tempo di ricarica totale conta. Il primo byte dipende da molti fattori che si possono influenzare solo male. Una pagina che non è compressa di solito ha un valore TTFB molto basso rispetto a una pagina perfettamente compressa. Ma il tempo di caricamento totale con la compressione è ovviamente più veloce su una pagina con molti contenuti. In che modo Google valuta che alla fine è nebuloso. Abbiamo anche pagine che si caricano perché il software è obsoleto e un valore PSI di 68. Con le parole chiave organiche di 28K, ma circa i visitatori di 1000 arrivano al sito un giorno. Ma per siti comparabili, la pagina con i valori migliori verrà sicuramente elencata più in alto.

CDN e moduli di accelerazione

Esistono anche moduli che memorizzano dati statici su altri server e li distribuiscono in base alla posizione del visitatore. Ciò riduce il numero di connessioni al server e riduce il cosiddetto TTFB. Le cache di akamai, cloudflare o incapsula sono disponibili qui che offrono anche compressione e ottimizzazione a seconda del servizio prenotato. Una piccola protezione Dos (D) è inclusa anche se la connessione viene effettuata interamente tramite questi provider.

CloudFlare-web-traffico-Uebersicht
Analisi del traffico Cloudflare

Speedkit per Plesk

Ad esempio, esiste un plug-in per Plesk, che può rendere il sito Web più veloce con pochi clic. Nel mio test, tuttavia, è stato esattamente il contrario. Il problema principale con tali plug-in è il fatto che la cache inizia solo quando il visitatore visualizza la pagina una seconda volta o si collega per la prima volta al sistema.

Il vantaggio è che puoi attivarlo facilmente senza apportare modifiche al tuo sistema. Ma lo svantaggio è piuttosto la mancanza di velocità con i visitatori di 1 View. Per questo motivo, non puoi vedere alcun cambiamento con i soliti programmi di test, perché visitano sempre il sito senza cache come un nuovo utente.

Speedkit-sito-acceleratore-Plesk
Speedkit per Plesk è progettato per rendere più veloci le pagine Web. Ma probabilmente non sempre funziona.

Poiché la maggior parte dei visitatori arriva spesso al sito solo tramite un link da un motore di ricerca, non vi è alcun vantaggio in termini di velocità per questi visitatori. Con i mezzi di bordo si va d'accordo senza cache esterne. In termini di protezione dei dati, in particolare DSGVO e l'imminente regolamento e-privacy, l'uso di tali servizi non è adatto. Manca un contratto per l'elaborazione dei dati dell'ordine al momento dell'ordine di questi servizi.

Quindi rendi il sito più veloce.

Il punto più importante: l'host web giusto.

Visto dall'esterno, lo fanno tutti Provider di hosting Web lo stesso. Ma la differenza è così spesso nascosta.

Esistono webhost che pubblicizzano con core e risorse dedicate, ma tutto ciò funziona solo su hardware molto debole. Un piccolo core AMD da un server 10 vecchio non è lo stesso di un core su un Intel Platinum Xeon l'ultima versione.

vmware_cluster
Un esempio di cluster VMWare

La maggior parte dei provider oggi virtualizza anche l'intera infrastruttura. Spesso su strane strutture come i sistemi container in cui i clienti prenotavano i core venivano prenotati da 20 altri clienti. Buono e costoso a causa dei costi di licenza del software, i fornitori utilizzano giusti sistemi di virtualizzazione come vmware o KVM, di solito denominati cloud.

kvm_cluster
Un piccolo cluster KVM

Spesso è sufficiente una condivisione Hosting fuori. Noi stessi abbiamo creato siti Web con decine di migliaia di visitatori al mese. Esse funzionano anche in un piccolo account di hosting, poiché le macchine di web hosting sono generalmente dimensionate dal provider già molto grandi, quindi possono servire centinaia di siti Web.

virtuozzo_cluster
Vista di un nodo Virtuozzo 7

Tuttavia, la maggior parte dei siti non avrà bisogno dei servizi prenotati, quindi rimane sempre molta energia.

Quando si sceglie il webhoster, basta cercare un account di prova e giocare al tuo sito Web senza impegno. Di solito puoi raggiungerli tramite un sottodominio e testare la velocità. Se non è nulla, passa a un altro provider.

In questo esempio, la pagina demo è su una Server SEO la webhoster.de AG dove si ottiene un account rivenditore Plesk con indirizzi IP 10 per i propri progetti.

L'hardware utilizzato è un server Dell R740 con SSD del server MLC come array RAID.

L'interfaccia di gestione è Plesk Onyx nella versione attuale.

È stato installato un WordPress standard con i seguenti plugin attivi:

  • Affiliato Amazon per WordPress
  • NextScripts: SNAP Pro Upgrade Helper
  • NextScripts: Social Networks Auto-Poster
  • SEO intelligente Links Affari
  • shortcodes finale
  • Sommario More
  • The7 Elements
  • Componenti aggiuntivi definitivi per WPBakery Page Builder
  • WPBakery Page Builder
  • Yoast SEO Premium
  • WP Rocket

Il modello di progettazione

Il tema è The7.

Il design della pagina è costituito da modelli del tema o del generatore di pagine. Le sottopagine di solito hanno parole 2500-3000 e molte immagini e tabelle.

Pertanto, è sempre importante controllare non solo la pagina iniziale, ma anche le pagine secondarie.

Il nostro sito demo si chiama www.super-food.de ed è anche sotto questo Dominio realizzabile. Quindi puoi verificare tu stesso tutti i test. In un altro articolo, mostriamo come costruire un grande sito Web con poche risorse in pochissimo tempo. Forse è qualcosa anche per te. Il sito Web viene talvolta copiato su altri sistemi a scopo di test per creare test comparativi.

Come impostare il web server tramite Plesk

Innanzitutto, il server Web deve essere impostato tramite Plesk. Ci sono sempre consigli per usare nginx come un puro web server. Non lo facciamo perché essenzialmente non sono supportati file .htaccess e la maggior parte delle funzioni di WordPress dei plugin può essere convertita solo con maggiore sforzo, altrimenti sono inefficaci. Non vi è inoltre alcun vantaggio in termini di velocità.

plesk-cruscotto-dominio
La dashboard di Plesk per il dominio

Impostazioni PHP in Plesk

Usiamo l'attuale versione php 7.2.9 con le impostazioni predefinite. Sotto la voce di menu Impostazioni PHP, di solito puoi impostare tu stesso le opzioni. In caso contrario, il provider di hosting web deve farlo.

plesk-php-versione-set-apache-con
Impostazioni PHP nel menu di Plesk. PHP FPM con server web Apache.

Impostazioni per Apache e nginx

Nel caso delle impostazioni per nginx o Apache, impostiamo solo i valori già preparati dal provider. Quindi niente di speciale. Qui i collegamenti simbolici sono disattivati ​​e la compressione standard è attivata solo per motivi di sicurezza.

impostazioni nginx come proxy nel menu di Plesk

Useremo nginx come server proxy solo con l'elaborazione intelligente dei file statici. Fondamentalmente, puoi completamente fare a meno di nginx. Quindi http / 2 non funziona più e si verificano altri problemi. Quindi lasciamolo ai valori predefiniti.

WordPress Dashboard

Il nostro sito demo funziona già abbastanza bene. Ma per raggiungere 100 / 100 abbiamo bisogno di alcune modifiche come la Minificazione, quindi il riepilogo di CSS e Javascript come consigliato da Google.

Questo di solito non può copiare tutto insieme, quindi ci sono utili aiutanti che fanno il lavoro.

In questa recensione stiamo usando il plugin WP-Rocket. Ma molti altri possono.

wp-rocket-prenotazione
Il cruscotto WP-Rocket

Nella sezione Preferenze, nella sezione Ottimizzazione file, faremo semplicemente clic su tutti gli elementi tranne quelli dannosi per http / 2. Questi sono i file CSS il "Minimizza CSS"E"Ottimizza la presentazione CSS".

css Minify
WP Rocket CSS Minification

Con le impostazioni javascript devi modificare le impostazioni "Riduci a icona Javascript"E"Javascript ha ritardato il caricamento"Così come il"Modalità provvisoria per jQuery (consigliato) ".

Minimizza JavaScript
Impostazioni Javascript WP Rocket

È quasi tutto. Con il plugin, la pagina con il valore PSI aumenta a 94 / 100. Ora mancano solo alcune piccole ottimizzazioni dei file di immagine o del codice CSS, che in qualche modo non sono state compresse nel cosiddetto tema figlio. Convenientemente, google fornisce questi file ma ottimizzati, in modo da poterli facilmente sostituire con il file manager.

In questo caso siamo stati in grado di scambiare le immagini modificate dal tema e posizionare un file CSS e Javascript nel tema figlio.
Quindi, dopo aver eseguito tutte le ottimizzazioni, è stato eseguito solo un piccolo ricaricamento dell'100 / 100 desiderato.

intuizioni pagina di velocità

Pagina-velocità-100-100
Google Pagespeed Insights con 100 / 100 superato.

Speriamo che il nostro piccolo tutorial ti abbia aiutato con l'ottimizzazione. Quindi tutto è possibile. Ma le cose cambiano anche ogni giorno. Ecco perché devi mantenere aggiornato WordPress, altrimenti le nuove funzionalità non saranno più supportate.

Presto troverai un video completo sul nostro canale YouTube.

Lasciare una risposta

Inserisci il tuo commento!
Inserisci qui il tuo nome