digITgreen

Smernice digITgreen

Kako zgraditi spletno stran z
digITgreen standardi

Vsak ogled spletne strani porabi energijo – na strežniku, v omrežju in na napravi obiskovalca. Smernice v nadaljevanju povzemajo prakse, po katerih se odlikujejo najučinkovitejša spletna mesta v bazi digITgreen. Namenjene so razvijalcem, oblikovalcem in skrbnikom spletnih strani, ki želijo svojo stran narediti lažjo, hitrejšo in prijaznejšo do okolja.

Sistem ocenjevanja

Kaj pove ocena digITgreen rating?

Vsa spletna mesta s certifikatom digITgreen izpolnjujejo naše okoljske kriterije. Ocena dodatno pokaže, kako energijsko učinkovita je posamezna stran v primerjavi z drugimi certificiranimi stranmi.

Ocena digITgreen
0–10
10 = najboljši rezultat
Lestvica učinkovitosti
012345678910
Manj učinkovito Najbolj učinkovito

Dejanske meritve

Ocena temelji na izmerjenem delovanju strani, ne na oceni na pamet.

Primerjalna uvrstitev

Stran primerjamo z ostalimi stranmi v bazi digITgreen.

Redno osveževanje

Ker se splet nenehno izboljšuje, se lahko uvrstitev sčasoma spremeni.

Razredi digITgreen

Od certificirane do izjemne strani

Glede na oceno digITgreen se vsako certificirano spletno mesto uvrsti v enega od štirih razredov. Vsi razredi označujejo okolju prijazno stran, višji pa izkazujejo še večjo energijsko učinkovitost.

A+
Zgornjih 25 %

Izjemno

Zgled energijsko učinkovite spletne arhitekture. Stran se uvršča med najučinkovitejše četrtine vseh digITgreen certificiranih strani.

A
Zgornjih 50 %

Odlično

Učinkovitost nad večino primerljivih strani. Dobre prakse so dosledno upoštevane.

B
Zgornjih 75 %

Zelo dobro

Trdni temelji z nekaj priložnostmi za dodatno optimizacijo.

C
Certificirana stran

Certificirano

Stran izpolnjuje kriterije digITgreen. Z nekaj ciljnimi izboljšavami je višji razred hitro dosegljiv.

Vsa certificirana spletna mesta so okolju prijazna. Razred pokaže, kako se stran uvršča med ostalimi certificiranimi stranmi, zato se lahko sčasoma spremeni tudi brez sprememb na vaši strani.

Merila odličnosti

Kaj odlikuje strani razreda A in A+?

Ciljne vrednosti so zaokrožene in izpeljane iz anonimiziranih meritev certificiranih strani v zgornji polovici. Samodejno se osvežujejo z novimi podatki.

Velikost prenosa
pod 350 KB

na posamezen ogled strani

Delež JavaScripta
pod 20 %

celotnega prenosa strani

Stiskanje prenosa
nad 65 %

prihranka z Brotli ali Gzip

Predpomnjenje
nad 70 %

vsebine iz predpomnilnika ob ponovnem obisku

HTTP-zahtevki
pod 20

ob nalaganju strani

Zunanji viri
pod 20 %

vseh zahtevkov gre k tretjim osebam

Priporočene ciljne vrednosti
Zlata pravila

12 pravil za zeleno spletno stran

Pravila so razvrščena po vplivu na ogljični odtis. Že z upoštevanjem ključnih pravil običajno dosežete največji del prihranka.

Ključno
Pravilo 01

Gostovanje na obnovljivih virih

Temelj zelene spletne strani je strežnik, ki ga poganja obnovljiva energija. Enako velja za storitve, na katere se stran opira.

  • Izberite ponudnika, ki rabo obnovljive energije izkazuje z dokazili.
  • Preverite tudi CDN, pisave, analitiko in druge zunanje storitve.
  • Gostujte čim bliže svojim obiskovalcem, da skrajšate pot podatkov.
Ključno
Pravilo 02

Lahka stran kot izhodišče

Količina prenesenih podatkov je najneposrednejši kazalnik porabe energije. Vsak kilobajt se prenese ob vsakem ogledu.

  • Določite proračun velikosti strani in ga preverjajte ob vsaki spremembi.
  • Vsak nov element strani naj upraviči svojo težo.
  • Posebno pozornost namenite vstopni strani, ki ima največ ogledov.
Cilj: pod 350 KB na ogled
Ključno
Pravilo 03

Sodobni formati slik

Slike so pogosto največji posamezni del strani. Pravi format in prava velikost prinašata velik prihranek brez vidne izgube kakovosti.

  • Fotografije shranjujte v formatu WebP ali AVIF namesto JPEG in PNG.
  • Logotipe, ikone in ilustracije uporabljajte v vektorskem formatu SVG.
  • Slik ne nalagajte večjih od prikaza; za različne zaslone uporabite srcset.
Pomembno
Pravilo 04

Nalaganje po potrebi

Obiskovalec pogosto ne pride do dna strani. Vsebine, ki je ne vidi, ni treba prenesti.

  • Slikam in vdelavam niže na strani dodajte loading="lazy".
  • Glavne slike na vrhu strani ne nalagajte z zamikom.
  • Slikam določite width in height, da se postavitev ne premika.
Pomembno
Pravilo 05

Premišljena raba videa

Video je med energijsko najzahtevnejšimi vsebinami na spletu. Naj se predvaja, ko si ga obiskovalec želi ogledati.

  • Izogibajte se samodejnemu predvajanju in videu v ozadju.
  • Namesto vdelanega predvajalnika najprej prikažite sliko, ki ga naloži ob kliku.
  • Animacije GIF nadomestite s kratkim videom ali animacijo CSS.
Priporočeno
Pravilo 06

Varčne spletne pisave

Vsaka družina in debelina pisave je dodatna datoteka. Premišljen izbor ohrani celostno podobo in zmanjša prenos.

  • Omejite se na največ dve družini pisav in le potrebne debeline.
  • Pisave gostujte sami v formatu WOFF2 in jih zmanjšajte na potrebne znake (vključno s č, š, ž).
  • Kjer je mogoče, uporabite sistemske pisave naprave.
Ključno
Pravilo 07

Zmerna raba JavaScripta

JavaScript je treba prenesti, razčleniti in izvesti, kar obremeni procesor in baterijo naprave. Najučinkovitejše strani ga uporabljajo le tam, kjer resnično prispeva k delovanju.

  • Drsnike, animacije in menije izvedite z izvornim HTML in CSS, kjer je mogoče.
  • Odstranite neuporabljene knjižnice in skripte.
  • Nenujne skripte nalagajte z defer ali async.
Cilj: pod 20 % prenosa
Priporočeno
Pravilo 08

Čist in minimiziran HTML in CSS

Semantičen HTML in urejen CSS sta osnova lahke strani. Graditelji strani pogosto nalagajo sloge in skripte tudi tam, kjer niso potrebni.

  • Datoteke HTML, CSS in JS minimizirajte.
  • Odstranite neuporabljena pravila CSS in nepotrebne gradnike.
  • Sredstva vtičnikov nalagajte le na podstraneh, ki jih uporabljajo.
Pomembno
Pravilo 09

Stiskanje prenosa

Besedilne datoteke se odlično stisnejo. Z eno nastavitvijo na strežniku se količina prenesenih podatkov občutno zmanjša.

  • Na strežniku ali CDN omogočite stiskanje Brotli, z Gzip kot rezervo.
  • Stiskajte HTML, CSS, JavaScript, SVG in JSON.
  • Že stisnjenih formatov (WebP, AVIF, WOFF2) ne stiskajte ponovno.
Cilj: nad 65 % prihranka
Pomembno
Pravilo 10

Učinkovito predpomnjenje

Kar je obiskovalec že prenesel, naj ob naslednjem obisku ostane v njegovem brskalniku. Tako vsak ponovni ogled porabi le delček energije.

  • Statičnim datotekam nastavite dolgo glavo Cache-Control (npr. eno leto).
  • Datotekam ob spremembi dodajte oznako različice, da se osvežijo.
  • Na strani strežnika uporabite predpomnjenje celotnih strani.
Cilj: nad 70 % iz predpomnilnika
Ključno
Pravilo 11

Manj zunanjih storitev

Sledilniki, klepetalna okna, zemljevidi in vdelave družbenih omrežij prinašajo skrito breme, na katerega nimate vpliva. Vsaka storitev pomeni dodatne povezave in skripte.

  • Redno preverite, katere zunanje storitve stran še zares potrebuje.
  • Zemljevide in vdelave nalagajte šele ob kliku.
  • Pisave, ikone in knjižnice gostujte na lastnem strežniku.
Cilj: pod 20 zahtevkov skupaj
Priporočeno
Pravilo 12

Redno vzdrževanje in merjenje

Spletne strani sčasoma pridobivajo težo. Redno čiščenje ohranja učinkovitost, ki ste jo dosegli.

  • Odstranite neaktivne vtičnike, zastarele podstrani in neuporabljene medije.
  • Po vsaki večji spremembi stran ponovno izmerite.
  • Spremljajte gibanje ogljičnega odtisa skozi čas.
Hitri samopregled

Kje je vaša stran danes?

Označite trditve, ki za vašo stran že veljajo. Rezultat je okvirna usmeritev in ni povezan z uradno oceno digITgreen.

0od 12
Vaš rezultat

Začnimo

Označite prakse, ki jih že izvajate, in preverite, kje je največ prostora za izboljšave.

Testiraj Pojdi na zeleno Zaženi test Pridobi certifikat Preveri odtis

PREVERI MOJO STRAN
Pomakni se na vrh