Mistä rakentuu verkkosivuston ekologisuus?

Kysymys verkkopalvun ekologisuudesta olisi vielä vähän aikaa sitten voinut herättää ihmetystä. Viime vuosina yleinen tietoisuus ilmastokriisistä ja ihmisen vaikutuksesta siihen on kuitenkin kasvanut merkittävästi. Samalla on herännyt ymmärrys siitä, että myös verkkosivustoilla ja verkkopalveluilla on oma hiilijalanjälkensä, aivan kuten yksilöillä ja yrityksillä.

Kirjoittaja: George Hieron

13.9.2024

• Blogi

Ekologisen verkkosivuston perusta

Tärkein asia ekologisesti vastuullisen verkkosivuston varmistamisessa on hosting-palvelu; pyörivätkö verkkosivuston palvelimet uusiutuvalla tai kestävällä energialla? Redandbluella käytämme Seravoa hosting-palveluntarjoajanamme. Seravo on ilmoittanut olevansa hiilinagatiivinen – sen palvelimet toimivat vesi- ja tuulivoimalla.

Mutta kuinka voi selvittää, onko oman verkkosivuston hosting-palvelu kestävän kehityksen mukainen? Verkkopalvelun ekologisuuden voi tarkistaa esimerkiksi Website Carbon Calculator -työkalun avulla. Tämä työkalu ei ainoastaan arvioi kuinka paljon CO2-päästöjä tietyn URL-osoitteen käyttäminen aiheuttaa, vaan myös arvioi, onko sivusto todennäköisesti uusiutuvalla energialla toimiva, vai käyttääkö se fossiilisia polttoaineita.

Jos hosting-palvelu ei ole vielä vihreä, siirtyminen palveluntarjoajaan, joka tarjoaa kestävästi toimivia palvelimia, on yksi parhaista tavoista vähentää sivustosi aiheuttamia CO2-päästöjä. Palvelinympäristö on verkkosivuston hiilijalanjäljen perusta, ja esimerkiksi pelkät sisällölliset muutokset eivät takaa verkkopalvelun ekologisuutta.

Miten sisältö vaikuttaa verkkosivuston ekologisuuteen?

Verkkosivuston sisältö vaikuttaa suuresti sen tuottamien hiilidioksidipäästöjen määrään. Esimerkiksi yksinkertaisen blogi, joka koostuu pääasiassa tekstistä, tuottaa huomattavasti vähemmän CO2-päästöjä kuin sivusto, jonka sisältö on painottunut kuviin ja videoihin.

Kuvat ja erityisesti videot ovat usein suurimpia päästöjen aiheuttajia verkkosivustolla. Onneksi on olemassa ratkaisuja, joilla niiden vaikutusta voidaan pienentää. Verkkosivuston teknisessä toteutuksessa tulisi varmistaa, että kuvat ladataan sopivassa koossa sen laitteen näytölle, jolla sivua katsotaan, eli esimerkiksi mobiililaitteella tarkasteltaessa latautuu pienemmät versiot kuvista.

Videoiden kohdalla automaattista toistoa (autoplay) tulisi välttää, jotta käyttäjän kaistanleveyttä ei kuluteta videon lataamiseen heti. Jos automaattinen toisto on välttämätöntä, videot voidaan sijoittaa sivun sisältöalueen alaosaan ja JavaScriptin avulla voidaan varmistaa, että videon lataaminen ei ala ennen kuin video tulee näkyville käyttäjälle.

Vinkkejä visuaalisen median käyttöön sisällöissä

Sisällön syöttäjillä on myös vastuu käyttää visuaalista mediaa vastuullisesti. Vuonna 2024 verkkosivustojen täytyy erottua kilpailijoista ja onnistuneen verkkosisällön rakentaminen on jatkuvaa tasapainottelua tehokkuuden ja wow-tekijöiden välillä. Pelkkiin teksteihin perustuvat sivustot voivat kamppailla kohdeyleisön sitouttamisen kanssa, mutta liiallinen videoiden ja kuvien käyttö voi aiheuttaa huonon käyttökokemuksen ja hidastaa sivustoa, mikä itsessään voi aiheuttaa muita vaikutuksia.

Siksi on suositeltavaa, että sisällönsyöttötiimit käyttävät kuvia ja videoita harkiten ja säästeliäästi, tasapainottaen niiden positiiviset vaikutukset sisältöön ja negatiiviset vaikutukset hiilidioksidipäästöihin. On myös tärkeää varmistaa, että alkuperäiset sivustolle ladatut kuva- ja videotiedostot ovat kohtuullisessa tasapainossa tiedostokoon ja kuvanlaadun suhteen, ja käyttää oikeita kuva- ja videoformaatteja: esimerkiksi WebP on laajasti tuettu moderni kuvaformaatti, joka on yleensä paljon pienempi tiedostokooltaan kuin vastaavat JPG-tiedostot. Kuvat voidaan myös pakata eri asteilla tarpeettomien yksityiskohtien poistamiseksi ja tiedostokoon pitämiseksi pienenä. Pakkausratkaisut voidaan toteuttaa joko sisällöntuottajien toimesta tai automaattisesti WordPress-laajennusten avulla.

Vaihtoehtoinen ratkaisu on korvata perinteiset kuvat skaalautuvilla vektorikuvilla (SVG) aina kun mahdollista, sillä SVG-tiedostot ovat pohjimmiltaan vain koodiohjeita selaimelle siitä, miten kuvat ”piirretään” sen sisältöön, eikä kyseessä ole varsinainen kuva. Thanks in Advance -verkkosivusto on hyvä esimerkki siitä, miten SVG-kuvia voidaan käyttää sisällön esittämiseen. Toinen keino päästöjen vähentämiseksi on tummien värien laajamittainen käyttö erityisesti taustojen osalta, koska tummat värit vaativat vähemmän energiaa näyttöjen valaisemiseen kuin vaaleammat värit, erityisesti jos sisältöä katsotaan OLED-tekniikkaa käyttävällä näytöllä. Mustaa taustaväriä on hyödynnetty myös edellä mainitulla Thanks in Advance näyttää esimerkillisesti.

Verkkosivuston nopeus on valttia

Energiatehokas on sivusto on useimmiten myös nopea ja suorituskykyinen. Nopeat verkkosivut ovat siis ekologisia ja ekologiset verkkosivut ovat nopeita.

Sivuston nopeus on yksinkertainen tapa arvioida, kuinka ekologinen verkkosivusto on ilman, että kopioit ja liität jokaista URL-osoitetta työkaluihin kuten Website Carbon Calculatoriin.

Suuret kuvat vaikuttavat paitsi sivuston latausnopeuksiin, myös sen hiilijalanjälkeen. Suuremmat kuvat ja pidemmät videot käyttävät enemmän dataa, joka vaatii enemmän energiaa hosting-palvelulta ja enemmän kaistanleveyttä sisällön latautumiseen käyttäjän laitteelle.

Jos sivusto toimii uusiutuvalla energialla ja käyttökokemus tuntuu nopealta erityisesti kuvia ja videoita ladatessa, sen hiilijalanjälki ei todennäköisesti ole kovin suuri. Latausaikaa voidaan arvioida helposti esimerkiksi vanhemmalla mobiililaitteella, jonka teho on nykylaitteita heikompi, tai sellaisella laitteella, joka käyttää 3G-yhteyttä. Hitaampi laite ja yhteys näyttää selkeämmin erot eri sivustojen latausaikojen välillä, ja tekee erojen vertailusta yksittäisten eri sivujen tai muiden verkkosivustojen välillä selvempiä.

Lisäksi kehitysvauhti verkkoteollisuudessa on nopea, kuten kaikilla teknologia-aloilla. Jos verkkosivusto on useita vuosia vanha, on todennäköistä, että nykyään on käytettävissä ratkaisuja ja käytäntöjä, jotka voivat parantaa sivunopeuksia. Näihin kuuluu esimerkiksi modernit välimuistiratkaisut.

Paranna WordPress-verkkosivustosi ekologisia ominaisuuksia

Redandblue ei ole vain hiilineutraali yritys, vaan meillä on myös laaja asiantuntemus ympäristöystävällisten verkkosivujen tuottamisessa. Vuonna 2024 olimme Grand One -kilpailun Ekologisin verkkopalvelu -sarjan finalisteja kahdella työllämme. On kuitenkin tärkeää korostaa, että verkkosivustosi tekeminen mahdollisimman kestäväksi on matka, ei määränpää. Aivan kuten verkkosivuston suorituskyvyn tai saavutettavuuden parantamiseen tähtäävässä projektissa, tehtävä ei ole koskaan täysin valmis, mutta kaikki edistys on tärkeää.

Tarjoamme verkkosivustojen ekologisuus- ja suorituskykyauditointeja sekä ratkaisupalveluja verkkosivustojen parannusten toteuttamiseksi. Tarjoamme mieluusti myös kokonaan uuden, ekologisen verkkosivuston vanhentuneen tilalle.

Esimerkkejä ekologisista verkkosivustoista:

Grand One -finalistit

Finalistimme tämän vuoden Grand One -kilpailun Ekologisin verkkopalvelu -sarjassa olivat STEK ja Ilmastoinfo. Kun testasimme kyseisiä sivuja edellä mainitulla Website Carbon Calculator -työkalulla, molemmat sivustot suoriutuivat erinomaisesti ja keskimäärin CO2-päästöt olivat Ilmastoinfon osalta 0,12 g per sivuvierailu ja STEK osalta 0,131 g. Nämä keskiarvot vastaavat työkalun A-luokkaa, mikä tarkoittaa, että molemmat ovat ympäristöystävällisempiä kuin noin 87 % kaikista maailman verkkosivustoista. Toteutimme molemmat sivustot vuonna 2023.

Onko tässä Suomen vuoden 2024 ekologisin verkkosivusto?

Tänä vuonna 2024 julkaistut uudet projektit korostavat sitoutumistamme jatkuvaan parantamiseen tällä osaamisalueella, kuten Suomen Journalistiliiton verkkosivut. Journalistiliiton sivuston CO2-päästöt ovat todella alhaset, keskimääräinen hiilidioksidipäästö per sivu on vain 0,085 g CO2 ja 60 % testatuista sivuista sivustolla saavutti A+ -luokituksen. Journalistiliiton uuden sivuston sivut ovat siis ympäristöystävällisempiä kuin 92 % kaikista verkkosivustoista maailmanlaajuisesti.

Lue lisää projekteistamme alla olevien linkkien kautta:

• Journalistiliiton verkkosivusto
• HSY:n Ilmastoinfon verkkosivusto
• STEK ja Sähkölä verkkopalvelu-uudistukset