Serve un Design minimal per realizzare un sito veloce?

Web Performance

Serve un Design minimal per realizzare un sito veloce?

Sempre più spesso sento pareri contrastanti tra chi ritiene importante le performance di caricamento di un sito web e chi invece ritiene fondamentale l’estetica e il design del sito.

In un’epoca caratterizzata da comodità e velocità la notizia dei Core Web Vitals ha influenzato parecchio la percezione delle prestazioni, che dovrebbe avere un sito internet, sia nelle aziende che negli addetti ai lavori.

Per questa ragione ho voluto avere sul mio blog un’opinione da chi lavora giornalmente con queste diatribe ed è riuscito anche a risolverle per la community di WordPress.

Ecco qui le domande che ho fatto a Jose Mortellaro che non riguardano solo il design minimal ma anche concetti più ampi come la user experience.

Quanto ritieni importanti le performance in un progetto web?

Considero le performance non come un obiettivo ma come una conseguenza del lavoro che fai quando crei un sito web. Questo non vuol dire che non le considero importanti, ma che considero più importante tutto ciò che c’è a monte del risultato finale. Quando lavoro su un sito non mi pongo l’obiettivo di avere il massimo delle performance, ma di avere il miglior rapporto possibile tra la qualità e quantità di risorse necessarie per conquistare l’attenzione dei visitatori e il consumo che tali risorse comportano.

Lavoro con mia moglie che è la designer, diciamo che lei è quella che tende a far aumentare il numeratore della frazione, e io sono quello che cerca di ridurre il denominatore, ma alla fine lavoriamo entrambi per far crescere quel rapporto. Non considero lo stile e il design come i nemici delle performance, sento invece la missione di fare tutto il possibile per permette allo stile di esprimersi nel migliore dei modi.

Mia moglie a sua volta cerca di non esagerare con i MB per facilitare il mio lavoro. Avere un ottimo rapporto tra design e consumi, porta di conseguenza ad avere buone performance. Di solito il risultato finale è un sito abbastanza performante, ma questo è solo uno degli aspetti che caratterizzano la creazione di un sito.

Perché hai creato il plugin “Freesoul Deactivate Plugins”?

Freesoul Deactivate Plugins è nato come reazione a Revolution Slider. Era il periodo in cui mia moglie voleva installare Revolution Slider in tutti i siti che stavamo facendo. Credo Revolution Slider non abbia bisogno di presentazioni, ma per chi non lo conoscesse è un plugin che ti permette di includere nella pagina delle sliders molto accattivanti, il problema è che per raggiungere i suoi scopi carica degli scripts e fogli di stile pesantissimi e lo fa in tutte le pagine anche dove non hai sliders.

Io andavo a rosicchiare il millesimo di secondo qui e là con il nostro tema, e poi è arrivato lui con le sue librerie JavaScript mandando all’aria anni di lavoro di ottimizzazione del tema. Eppure mia moglie lo voleva, dovevo decidere tra mia moglie e Revolution Slider e allora mi sono inventato Freesoul Deactivate Plugins.

Dopo la sua nascita gli slider fanno danno solo nella pagina dove sono incluse e in nessun’altra pagina. E non immagini il piacere che provo quando vado nelle impostazioni di Freesoul Deactivate Plugins e clicco per spegnere Revolution Slider ovunque tranne dove ci sono gli slider.

Con quali altri plugin di web performance si integra al meglio?

FDP disattiva plugin dove non servono, quindi non esistono plugin con cui si integra meglio o peggio, ma piuttosto situazioni più o meno indicate. Se ad esempio sul tuo sito non hai nessun plugin che riduce le performance, non avrai bisogno di FDP, al massimo ti potrà aiutare per il problem-solving. Al contrario basta già un plugin come Revolution Slider da solo che ti farà apprezzare FDP. Poi quando i plugin pesanti sono tanti, credo che lo amerai. In ogni caso consiglio di abbinare un plugin di cache o un sistema di cache fornito dal server e tutti gli altri metodi per migliorare le performance.

FDP ti aiuta a ridurre i consumi e fare pulizia di ciò che non serve. Una volta fatto questo, converrà ottimizzare ulteriormente il sito, ma cosa fare dipenderà molto da caso a caso. Se ad esempio il tuo tema o i plugin rimasti caricano risorse che bloccano il rendering, ti converrà un plugin per spostare tali risorse dopo il rendering, se invece hai già un ordine delle risorse ottimizzato, ti basterà solo un plugin per attivare la cache. I plugin per l’ottimizzazione performance sono molti e ce ne di molto validi, ma come detto dipende molto dalla singola situazione ed è impossibile consigliarne alcuni che siano perfetti in qualsiasi caso. Al massimo eviterei quei plugin che ti permettono di concatenare le risorse creando un unico file che viene caricato in tutte le pagine.

Se disattivi i plugin che non servono nelle varie pagine, ma poi metti tutto quello che non serve in un unico file e lo carichi dappertutto, allora i benefici di FDP vengono quasi annullati. Ti rimarrà solo il vantaggio di non caricare le queries al database introdotte dei plugin disattivati, ma le loro risorse te le ritroverai nei files concatenati. Senza contare il fatto che se il server offre HTTP/2 (se non addirittura HTTP/3), concatenare le risorse è praticamente inutile, corri solo il rischio di causare problemi ed errori JavaScript. Non è esattamente sempre così, ma diciamo di sì nella maggior parte dei casi in presenza di HTTP/2 e HTTP/3.

La maggior parte dei plugin per concatenare le risorse comunque tengono conto che ogni pagina ha bisogno di diverse risorse e non creano un file unico che viene caricato su tutte le pagine, bensì un file per ogni combinazione necessaria a seconda delle pagine. In questo caso puoi usare un plugin del genere insieme a FDP e ancora avere tutti i benefici dati dalla disattivazione selettiva dei plugin. Onestamente non so se anche in questo caso valga la pena concatenare. Tieni conto che se tu hai files concatenati che sono diversi da pagina a pagina, sfrutterai meno la cache del browser.

Sicuramente avrai un punteggio migliore su alcuni speed test che non sono ancora stati aggiornati in ottica HTTP/2, ma non sfruttando a pieno la cache del browser, l’esperienza del visitatore reale sarà quella di un sito meno veloce. Forse mi sono dilungato un po’. Riassumendo consiglio abbinare plugin di cache e se è il caso quei plugin che permettono di ottimizzare l’ordine di caricamento delle risorse. Consiglio di fare le proprie ricerche per capire quali di questi plugin siano più indicati alla propria situazione.

Quali saranno i vantaggi della versione PRO?

La versione free aiuta l’utente nel miglioramento delle performance e nel problem-solving del proprio sito. La versione PRO è concepita per fare la stessa cosa ma su siti di altri. Sul tuo sito sai quali plugin hai installato e cosa fanno, sul sito di altri ti ritrovi dei plugin e non hai idea di dove li puoi disattivare, e allora ecco che la versione PRO ti offre il suggerimento automatico dei plugin da disattivare. Nella version free hai questa funzione solo per l’homepage, in quella PRO ovunque.

Se usi FDP sul sito di altri, probabilmente stai facendo ottimizzazione performance, e allora ecco che la versione PRO ti offre un tool per raccogliere i report di GTMetrix con un paio di click per mostrarli al tuo cliente quando hai finito l’ottimizzazione. In più ci sono alcune funzioni come il controllo automatico dopo il salvataggio di una pagina.

Se FDP PRO si accorge che salvi una pagina dopo aver disattivato un plugin di troppo, ti avverte. Inoltre puoi far partire una registrazione per sapere quali attività Ajax vengono coinvolte quando ad esempio  invii un formulario di contatto. In questo modo anche senza conoscere i nomi di tali attività puoi decidere quali plugin spegnere, velocizzando quindi l’invio del form.

Con la versione PRO puoi anche decidere quali plugin disattivare a seconda dell’utente loggiato, se ha acquistato un prodotto, o se ha un certo ruolo o capability, una certa email. Questo può essere utile nel caso di siti di membership, corsi online e simili.

Un’altra possibilità in più che offre la versione PRO è la disattivazione di parti di plugin. A volte non vuoi disattivare l’intero plugin, ma non vuoi che alcuni dei suoi hooks girino su alcune pagine. Con la versione PRO potrai vedere gli hooks nel frontend e decidere quali disattivare. Questo può permetterti di eliminare ad esempio elementi che un certo plugin aggiunge alla pagina, ma senza disattivare tutto il plugin perché magari ti serve per altri motivi in quella pagina.

Un sito perfetto può essere il giusto connubio tra grafica minimalista e scelta accurata dei plugin?

Credo di aver risposto in parte a questa domanda. Ma vorrei precisare cosa intendo per minimalismo. Per me minimalismo vuol dire non rinunciare a nulla, ma fare a meno di tutto ciò che non ci serve. Vivere da minimalisti vuol dire fare una vita più ricca rispetto ad una vita in cui ti circondi di cose inutili, perché ti crei lo spazio per ciò  che veramente ti serve e rende felice.

Se a te piace veramente avere una vettura superpotente, non per mostrarla agli altri, ma perché ti farebbe felice anche se nessuno sapesse che hai quella vettura, ben venga quella vettura. Ma dal momento in cui ti circondi di oggetti per far vedere ad altri un valore illusorio di te stesso, allora quegli stessi oggetti si stanno mangiando parte della tua vita senza mai renderti veramente felice.

Un discorso simile si può fare per un sito web.

Per me grafica minimalista vuol dire tutta la grafica necessaria per mostrare nel migliore dei modi l’essenza del business che c’è dietro il sito. Se questo vuol dire caricare un’immagine pesantissima perché quell’immagine con la sua risoluzione pazzesca può fare la differenza, allora ben venga quell’immagine. Pensiamo ad esempio ad un sito di fotografia. Sarebbe una cattiva idea rinunciare al design di un sito del genere per avere 100% su GTMetrix invece di 92%. In tal caso meglio dare più spazio al design e chiudere un occhio sulle performance, perché il cliente ideale del sito sarà più portato ad apprezzare una bella foto che il decimo di secondo in meno durante il caricamento.

Credo sia uno sbaglio non tener conto del cliente ideale del sito.  Qualsiasi decisione dovrebbe essere fatta tenendo conto del cliente ideale. Il minimalismo è proprio ciò che c’è dietro Freesoul Deactivate Plugins. Se proprio ti servono dei plugin, usali, ma caricali solo e soltanto dove servono, non ovunque. Nelle pagine dove disattivi quelli inutili, goditi quelli che lasci attivi, goditi le funzionalità che aggiungono a quella pagina e non rinunciare a nulla che possa servire a mostrare il sito al cliente ideale di quel sito.

Per quanto riguarda la scelta dei plugin, penso quella debba essere sempre la più accurata possibile. Credo che scegliere un plugin sia un pò come scegliere ciò che mangiamo. I plugin vanno a far parte dell’ecosistema del sito, e ne basta uno mal fatto per influenzare negativamente tutto il sistema. La salute del sito dipende dai suoi componenti, quindi il core di WordPress, il tema e i plugin. Per quanto riguarda il core di WordPress non abbiamo praticamente controllo se non quello di tenerlo sempre aggiornato. Per quanto riguarda plugin e tema invece abbiamo pieno potere decisionale.

Prima di installare un plugin che non avevo mai provato prima, faccio sempre degli speed test con e senza il plugin in prova e poi valuto il rapporto tra costi e benefici del plugin. Solitamente non mi fido di articoli riguardanti i plugin a meno che non siano scritti da persone che conosco e reputo competenti. Il web oggigiorno è pieno di articoli che molte volte parlano bene di un certo prodotto solo per interessi economici.

Valutare un plugin sulla propria installazione è questione di pochi minuti, e hai come vantaggio che lo provi nella tua situazione che potrebbe essere completamente diversa da quella del blogger che usa lo stesso plugin.

Conclusioni

Da quando ho letto il libro “Adoro!” di Emily Heyward penso che la scelta di utilizzare immagini ad alta definizione, animazioni, slider, pop-up o altre funzionalità dovrebbe avvenire solo dopo aver capito come esprimere al meglio l’identità del brand al proprio pubblico.

Ma è bene avere sempre chiari gli obiettivi di business: se il nostro sito ha una strategia SEO deve stare alle regole del web e le performance oggi sono fondamentali!

Scegliete dunque un professionista che potrà guidarvi nella scelta di un piano vincente.

Tag: Interviste ad esperti del web

Jose Mortellaro

Jose Mortellaro

WordPress Developer

Ingegnere meccanico dopo circa 15 anni d esperienza nel campo dello sviluppo di motori passa a lavorare come WordPress developer insieme a sua moglie. Autore di vari plugin tra cui Freesoul Deactivate Plugins, Specific Content For Mobile, Oracle Cards, Freesoul Builder e il tema Freesoul. Aiuta insieme a sua moglie coloro che intendono avviare un business online, curando l'aspetto tecnico dei siti web fatti in WordPress.