5 Tips per un Web Design sostenibile

5 tips web design sostenibile

Se Internet fosse un paese, sarebbe il settimo più inquinante al mondo, lo abbiamo detto già molte volte, ma possiamo cambiare le cose?

Con solo pochi cambiamenti puoi rendere il tuo sito web più sostenibile e quindi aiutare a combattere l’inquinamento in continuo aumento. Implementa subito questi 5 tips! Ti dirò esattamente cosa puoi fare per rendere il tuo sito web più sostenibile.

Ridimensiona le immagini e utilizza formati di immagine come WebP

Uno dei grandi peccatori quando si tratta di siti web sono le immagini e i video. Un’immagine che non è stata ottimizzata per Internet può facilmente avere una dimensione di file di 1 MB o 5 MB, ma se ridimensionata correttamente e salvata in un formato di file come WebP, allora quelle stesse immagini possono avere una dimensione di soli 30 o 40 kb.

Come vedi, questa è una grande differenza e non solo migliorerà la quantità di dati scaricati ogni volta che hai un visitatore, migliorerà anche il tempo di caricamento complessivo poiché la quantità di dati necessaria è inferiore. Con la velocità di Internet che abbiamo oggi, non fa una grande differenza se un’immagine è da 40 kb o 500 kb, ma agli occhi dell’inquinamento, la differenza è grande.

Tutte le immagini del nostro sito web sono in formato Webp.

Hai notato la differenza ?

Semplifica il tuo web design ed elimina le animazioni

Man mano che Internet diventa sempre più popolare, lo diventano anche i design che utilizziamo. Ciò significa che i nostri siti web richiedono sempre di più per funzionare e questo ha un impatto sulle emissioni complessive di CO2 causate da Internet.

Probabilmente ti sarà capitato di visitare un sito web e, poco dopo aver caricato la pagina, sentire le ventole del tuo computer iniziare a girare (almeno se usi un Macbook). Ciò significa che il sito web stesso richiede così tanto per funzionare che il tuo dispositivo si surriscalda solo a mostrarlo. Esempi come questi potrebbero essere Medal of honor che è basato su three.js.

Semplificando il tuo design puoi contribuire a ridurre le emissioni di CO2 poiché i dispositivi che visualizzano il tuo sito web non richiedono tanto quanto se ti impegnassi al massimo e utilizzassi tutti gli elementi e i pacchetti che consumano molta energia che riesci a trovare. Se costruito correttamente, un design semplice può avere lo stesso impatto di uno come l’esempio sopra menzionato.

Scrivi CSS personalizzato invece di usare Bootstrap

Lo stile CSS è quasi impossibile da aggirare a meno che non si stia pianificando di ospitare una pagina HTML grezza, ma ci sono molti modi in cui possiamo usare CSS senza che diventi un peso per il visitatore in termini di dimensioni del file. Uno dei modi in cui possiamo minimizzare questo è personalizzare tutto lo stile invece di usare Bootstrap e Semantic UI. Con la personalizzazione puoi scrivere uno stile riutilizzabile, minimizzarlo con un compilatore e scrivere solo lo stile necessario per il tuo sito web. Scrivere uno stile personalizzato rende anche il tuo sito web unico rispetto agli altri, il che spesso è un vantaggio.

Scrivi JavaScript vanilla invece di usare JQuery

È stato popolare per molto tempo ed è ancora utilizzato oggi, ma forse è il momento di mettere da parte jQuery e altre librerie simili e iniziare a utilizzare JavaScript “puro” (vanilla JavaScript). Quando importiamo tali librerie, scarichiamo più dati del necessario e, inoltre, il nostro browser deve leggere e interpretare più codice di quanto sia necessario per visualizzare il sito web.

Scrivere codice JavaScript può richiedere tempo e questo è uno dei motivi per cui abbiamo iniziato a utilizzare jQuery, ad esempio. Siamo stati in grado di scrivere più codice in modo più semplice e in meno tempo, ma questo ha un costo, e a pagarlo sono le emissioni complessive di CO2, sia dai server che ospitano il sito web sia dai visitatori che lo visualizzano.

Temi WordPress con Vanilla JavaScript

GeneratePress

È un tema leggero e altamente personalizzabile, progettato per la velocità e l’usabilità. GeneratePress non ha dipendenze da jQuery, il che lo rende ideale per chi cerca prestazioni elevate e un caricamento rapido delle pagine.

Neve

Neve è un tema wordpress multiuso super veloce e facilmente personalizzabile, ottimizzato per SEO. Anche questo tema è costruito senza jQuery, favorendo caricamenti rapidi e una buona esperienza utente su dispositivi diversi.

Questi temi offrono prestazioni elevate e una maggiore flessibilità grazie all’uso di Vanilla JavaScript, evitando le complessità associate a jQuery.

Page Builder che non utilizzano Jquery

Bricks non utilizza jQuery di default nel frontend. È progettato per funzionare principalmente con Vanilla JavaScript, il che contribuisce a migliorare le prestazioni e a ridurre il caricamento di script non necessari. Tuttavia, se hai bisogno di utilizzare jQuery, puoi caricarlo manualmente nel tuo tema WordPress.
Dettagli sull’uso di jQuery in Bricks
Assenza di jQuery: Bricks non carica jQuery automaticamente nel frontend, il che significa che le pagine sono più leggere e veloci.
Caricamento manuale: Se desideri utilizzare jQuery, puoi farlo aggiungendo una riga nel file functions.php del tuo tema child:

aggiungi jquery a function.php

aggiungi jquery a function.php

È consigliabile quindi riscrivere eventuali script jQuery in Vanilla JavaScript per mantenere la leggerezza e le prestazioni del sito.
In sintesi, Bricks è progettato per funzionare senza jQuery, promuovendo l’uso di Vanilla JavaScript per una migliore efficienza.

Implementa un tema scuro nel tuo web design

Il tema chiaro e scuro sta diventando molto popolare e sempre più siti web lo stanno implementando in modo che i visitatori possano scegliere autonomamente come desiderano che appaia la pagina. L’utilizzo di un tema scuro ha un impatto positivo sia sull’utente che sulle emissioni di CO2, poiché ci sono oltre un miliardo di dispositivi mobili in tutto il mondo che utilizzano display OLED (statistiche del 2018). I display OLED utilizzano energia solo sui LED che richiedono luce o colore, quindi se hai uno schermo nero con testo bianco, la maggior parte dello schermo sarà spenta.

Se vuoi fare ancora di più la differenza, puoi scegliere il tema scuro come tema principale e lasciare che l’utente scelga il tema chiaro. Molti visitatori non se ne preoccuperanno e quindi non cambieranno il tema, quindi scegliendo prima un tema scuro puoi ridurre le emissioni di CO2 del tuo sito web.

Scopri se il tuo sito è sostenibile
Condividi questo articolo:

CONVERTI IL TUO SITO WORDPRESS

Trasforma il tuo vecchio sito grey!