Avere molti CSS e JS inutilizzati nel tuo sito Web può ridurre il tempo di caricamento del tuo sito Web. Se gestisci il tuo sito web tramite a strumenti per test di velocità ad esempio PageSpeed Insight di Google, potresti ricevere un avviso per rimuovere CSS inutilizzati.
Per fortuna, c'è un modo molto semplice per farlo. Non è necessaria alcuna conoscenza tecnica speciale per poter rimuovere CSS e JS inutilizzati dal tuo sito WordPress.
Ciò è dovuto a un fantastico plugin noto come Pulizia delle risorse: aumento della velocità della pagina. Con questo plugin, rimuovere i CSS inutilizzati è facile come fare clic su alcuni pulsanti. In alternativa, se non ti dispiace spendere qualche soldo all'anno, con WP Rocket, c'è un pulsante CSS inutilizzato rimosso, basta attivarlo e il plug-in rimuoverà automaticamente tutti i CSS inutilizzati.
Checkout: I 7 migliori hosting WordPress gestiti su Google Cloud
Cos'è il CSS inutilizzato?
CSS inutilizzato è un file CSS presente in una pagina ma per lo più non è necessario per il caricamento della pagina. Quando un visitatore apre un sito Web, il browser in genere deve scaricare, analizzare ed elaborare tutti i fogli di stile esterni sulla pagina visitata prima di poter visualizzare il contenuto della pagina al visitatore. Se esiste un CSS su una pagina del genere che non viene utilizzato nella pagina, il browser perderà tempo su di esso.
Un classico esempio di ciò è la maggior parte dei plug-in dei moduli di contatto utilizzati. Questi plugin, sebbene siano usati principalmente solo nella pagina Contattaci, caricano i suoi CSS in tutto il sito web. Non importa se è la homepage in cui non viene utilizzato, il CSS verrà caricato.
Se ci sono troppi CSS che non sono necessari ma stanno caricando e rallentando il tempo del browser per leggere e visualizzare una pagina, può diventare un problema.
Oltre ai plugin, gli sviluppatori di temi scrivono molte cose in style.css che per lo più non sono necessarie. Ma che sia necessario o meno, si caricano ogni volta che viene caricato il tuo sito!
Un CSS inutilizzato potrebbe non essere un problema, ma molti CSS inutilizzati possono influire sul tempo di caricamento del tuo sito web.
Checkout: I 10 migliori temi WordPress più veloci e migliori
Come identificare i CSS inutilizzati
Trovare CSS e JS inutilizzati è una cosa molto facile da fare. Ci sono due approcci che consiglierò.
Uno è analizzare il tuo sito web tramite Google PageSpeed Insight. Controlla se il tuo sito web ha un problema di rimozione CSS inutilizzato. Cliccaci sopra e sarai in grado di identificare il componente del tuo sito responsabile.
Puoi vedere dall'alto che c'è un caso di CSS non utilizzato registrato. Sono in grado di vedere il plug-in e la posizione del CSS inutilizzato guardando questo.
La seconda opzione è ottenere un'analisi più dettagliata. Puoi ottenere questo risultato utilizzando gli strumenti di Chrome Dev.
Sul tuo browser Chrome, apri gli strumenti Chrome Dev, quindi vai alla copertura. Quindi fare clic sul pulsante di ricarica all'interno dell'area di copertura. Puoi trovare un guida completa su come farlo nello strumento Google Developers.
L'altra opzione è usare jitbit per cercare selettori CSS inutilizzati. Puoi anche usare PurificaCSS per trovare CSS inutilizzati
Come rimuovere CSS inutilizzati
Segui questi passaggi per rimuovere CSS inutilizzati da WordPress:
1. Installa la pulizia delle risorse
Vai al plugin quindi Aggiungi nuovo. Quindi digiti "Asset CleanUp" nella casella di ricerca della pagina Aggiungi nuovo plug-in. Installa e attiva il plugin.
2. Vai alle impostazioni del plugin
Per accedere alle impostazioni del plug-in, dalla dashboard di WordPress fare clic su Impostazioni quindi su Asset CleanUp.
3. Scarica CSS e JS indesiderati
Nelle impostazioni del plug-in, potrebbe essere necessario accettare di sapere come funziona il plug-in sotto lo stripping fat tap prima di iniziare.
Per scaricare CSS e JS fare clic su CSS e JSS manager. Da lì puoi rimuovere qualsiasi CSS e JS che non ti serve. Puoi rimuoverlo solo per la home page, per l'intero sito o per un URL specifico. Puoi anche rimuovere post, pagine o categorie.
Un esempio è scaricare qualsiasi modulo di contatto dal caricamento per l'intero sito ad eccezione della pagina Contattaci
Prenditi il tuo tempo e scarica tutti i CSS e JS che sai non sono necessari. Assicurati di testare il tuo sito dopo aver finito per assicurarti che tutto sia a posto.
Rimuovere i plugin CSS WordPress inutilizzati
Ecco alcuni plugin che puoi utilizzare per rimuovere CSS inutilizzati in WordpPress:
1. Pulizia delle risorse: aumento della velocità della pagina
Pulizia delle risorse: aumento della velocità della pagina semplifica la rimozione di CSS e JSin WordPress inutilizzati anche per i principianti. Tutto quello che devi fare è disattivare un particolare CSS che non è necessario per una determinata pagina.
Puoi anche disattivare solo per i singoli post. Con la versione premium, puoi disattivare i CSS/JS non utilizzati tramite plugin.
Questo plugin è un plugin completo per le prestazioni con molte altre opzioni per velocizzare WordPress. La rimozione di CSS/JS inutilizzati è solo una parte di esso.
In questo post, ho usato questo plugin ha una guida.
2. WP Rocket
WP Rocket è il plugin numero uno per le prestazioni premium di WordPress. Se sei un principiante, voglio dire se non hai esperienza o non ti senti a tuo agio con WordPress, allora WP Rocket è il modo più semplice per rimuovere CSS inutilizzati.
Devi acquistare il plug-in, una volta fatto, puoi scaricarlo dal tuo account o controllare la tua e-mail per un link per il download.
Installa il plugin tramite Dashboard>plugin>Aggiungi nuovo>Carica.
Basta accedere alle impostazioni di WP Rocket, quindi fare clic sulla scheda "Ottimizzazione file". Quindi scorri verso il basso e vedrai "Rimuovi CSS inutilizzati", seleziona la casella, salva e svuota la cache.
3. Perfmatters
Perfmatters è un plugin premium sviluppato da Brian Jackson e suo fratello, Brett Jackson. Questo plugin può aiutare a rimuovere i CSS inutilizzati molto facilmente.
Innanzitutto, è necessario acquistare il plug-in. Quindi installalo. Attiva licenza. Quando accedi alle impostazioni, attiva la gestione degli script.
Vai su qualsiasi pagina o pubblica un post sul tuo sito web, vedrai l'icona di script manager nel menu della dashboard, fai clic su di essa. Sarai in grado di rimuovere CSS e JS inutilizzati dalla pagina o globalmente.
Questo plugin è un plugin per le prestazioni, viene fornito con molte altre opzioni per velocizzare WordPress. La rimozione di CSS/JS non utilizzati ne fa parte.
4. Gestore JS CSS
Gestore CSS JS può rimuovere specificamente CSS o JS da dispositivi mobili o desktop. A seconda di cosa vuoi ottenere.
Questo plugin può anche posticipare il caricamento di file CSS o JS.
Conclusione
Se hai molti CSS e JS inutilizzati, noterai un grande miglioramento nei punteggi di velocità e prestazioni.
Potrebbe essere impossibile rimuovere tutti i CSS inutilizzati ma puoi ridurli al minimo. Uso Asset CleanUp per rimuovere CSS inutilizzati per ObiettivoTendenza.
Ricorda, ottimizza ma non essere troppo ossessionato, a meno che tu non voglia che il tuo sito assomigli il sito web più veloce del mondo.
Leggi anche:
Come eliminare le risorse che bloccano il rendering in WordPress
Grazie per aver condiviso queste informazioni. Fammi provare sul mio blog
Grazie per le buone informazioni. Lo userò sul mio sito çekici.
Buona lista. La pulizia delle risorse non è abbastanza buona per la maggior parte dei temi perché non riesco a rimuovere il file CSS principale. Di solito anche il file CSS principale è molto grande.
L'unico plugin gratuito che lo fa senza un abbonamento a un servizio esterno è Debloat. Potresti volerlo considerare: https://wordpress.org/plugins/debloat/