{"id":40657,"date":"2021-08-30T14:00:27","date_gmt":"2021-08-30T12:00:27","guid":{"rendered":"https:\/\/staging.kinsta.site\/?p=24306"},"modified":"2022-11-28T09:11:07","modified_gmt":"2022-11-28T09:11:07","slug":"webbplatser-utan-koldioxidutslapp","status":"publish","type":"post","link":"https:\/\/staging.kinsta.site\/se\/blog\/webbplatser-utan-koldioxidutslapp\/","title":{"rendered":"G\u00f6r webben gr\u00f6nare: S\u00e5 kan vi skapa webbplatser utan koldioxidutsl\u00e4pp"},"content":{"rendered":"

N\u00e4r jag talar om ett gr\u00f6nare internet och att minska koldioxidutsl\u00e4ppen fr\u00e5n webbplatser, tittar folk ofta p\u00e5 mig och fr\u00e5gar, ”Producerar webbplatser ens koldioxidutsl\u00e4pp?”<\/p>\n

Vi t\u00e4nker g\u00e4rna p\u00e5 internet som rent och immateriellt. Det har skett stora mass\u00f6verg\u00e5ngar f\u00f6r tj\u00e4nster till att vara online inte bara f\u00f6r att f\u00f6rb\u00e4ttra effektiviteten och anv\u00e4ndarupplevelsen, utan f\u00f6r att minska resursf\u00f6rbrukning och milj\u00f6p\u00e5verkan. Det finns dock en v\u00e4xande m\u00e4ngd bevis f\u00f6r att internet har en mycket verklig milj\u00f6p\u00e5verkan<\/strong> \u00e4ven om vi inte kan se det.<\/p>\n\n

Energif\u00f6rbrukningen och utsl\u00e4ppen fr\u00e5n internet \u00e4r enorma. Elektricitet \u00e4r internets livsnerv, som anv\u00e4nds f\u00f6r att driva datacenter, telen\u00e4t och de enheter som vi anv\u00e4nder f\u00f6r att surfa p\u00e5 webben. Totalt anv\u00e4nder det globala internet mer el \u00e4n hela Storbritannien (416,2 terawattimmar<\/a> f\u00f6r att vara exakt).<\/p>\n

Detta leder till en hel del koldioxidutsl\u00e4pp. Faktum \u00e4r att 2% av de globala koldioxidutsl\u00e4ppen<\/a> kommer fr\u00e5n den el som anv\u00e4nds av internet, s\u00e5som datacenter som anv\u00e4nds av stora f\u00f6retag. Det motsvarar m\u00e4ngden koldioxid fr\u00e5n den globala flygindustrin, som de flesta tycker \u00e4r en av de mest f\u00f6rorenande industrierna. F\u00f6r att uttrycka det i perspektiv, om internet var ett land, skulle det vara den sj\u00e4tte v\u00e4rsta f\u00f6rorenaren i v\u00e4rlden, motsvarande Tyskland.<\/p>\n

\"Datacenter
Datacenter producerar en hel del koldioxidutsl\u00e4pp<\/figcaption><\/figure>\n

Till skillnad fr\u00e5n m\u00e5nga andra branscher som vill bli mer effektiva och dra ned utsl\u00e4ppen kommer utsl\u00e4ppen fr\u00e5n internet att \u00f6ka snabbt under de kommande \u00e5ren. Antalet m\u00e4nniskor globalt sett med tillg\u00e5ng till internet \u00f6kar, och allteftersom data blir snabbare och billigare, konsumerar vi mer. Streamingtj\u00e4nster som YouTube<\/a>, Netflix och Spotify \u00e4r tunga dataanv\u00e4ndare och v\u00e4xer snabbt, men \u00e4ven vanliga webbplatser blir mer och mer dataintensiva.<\/p>\n

Enligt HTTPArchive.org<\/a>, \u00e4r en genomsnittlig webbsida idag n\u00e4stan fyra g\u00e5nger s\u00e5 stor som den var 2010<\/strong> och det forts\u00e4tter att stiga.<\/p>\n

\"Genomsnittlig
Genomsnittlig tillv\u00e4xt av webbsidor (k\u00e4lla: HTTP Archive)<\/figcaption><\/figure>\n

Som ett resultat uppskattas det att internet kan v\u00e4xa till att st\u00e5 f\u00f6r 3,5% av de globala koldioxidutsl\u00e4ppen<\/a> inom de n\u00e4rmaste tio \u00e5ren, i en tid d\u00e5 vi snabbt beh\u00f6ver minska utsl\u00e4ppen fr\u00e5n alla industrier.<\/p>\n

Br\u00e5dskan har framh\u00e5llits av Thomas Stocker, en av v\u00e4rldens ledande klimatforskare och tidigare medordf\u00f6rande f\u00f6r Internationella klimatpanelen (IPCC). Han har sagt:<\/p>\n

\u00c5r 2020 \u00e4r avg\u00f6rande. Om koldioxidutsl\u00e4ppen forts\u00e4tter att stiga efter det datumet kommer de mest ambiti\u00f6sa begr\u00e4nsningsm\u00e5len att bli om\u00f6jliga att uppn\u00e5. (K\u00e4lla: M2020<\/a>)<\/em><\/p><\/blockquote>\n

Detta ger oss bara tv\u00e5 \u00e5r att omvandla v\u00e5r industri fr\u00e5n att vara en av de snabbast v\u00e4xande k\u00e4llorna till utsl\u00e4pp av v\u00e4xthusgaser och b\u00f6rja minska v\u00e5ra kollektiva utsl\u00e4pp. Som webbdesigner, utvecklare eller \u00e4gare av webbplatser m\u00e5ste vi se vad vi kan g\u00f6ra f\u00f6r att minska utsl\u00e4ppen fr\u00e5n v\u00e5ra egna webbplatser.<\/p>\n

F\u00f6rst m\u00e5ste vi f\u00f6rst\u00e5 tre enkla principer:<\/p>\n

    \n
  1. Vi kan inte hantera saker vi inte kan m\u00e4ta.<\/li>\n
  2. Data\u00f6verf\u00f6ring f\u00f6rbrukar el, s\u00e5 att minska data\u00f6verf\u00f6ringen kommer att minska energi och utsl\u00e4pp.<\/li>\n
  3. F\u00f6rnybar energi ger mycket f\u00e4rre utsl\u00e4pp \u00e4n andra k\u00e4llor.<\/li>\n<\/ol>\n\n

    M\u00e4tning av koldioxidutsl\u00e4pp fr\u00e5n webbplatser<\/h2>\n

    Det \u00e4r mycket sv\u00e5rt att f\u00f6rb\u00e4ttra n\u00e5got som du inte kan m\u00e4ta och tills nyligen var det n\u00e4stan om\u00f6jligt att veta vad utsl\u00e4ppen fr\u00e5n en viss webbplats kunde vara. Resultatet var att det var sv\u00e5rt f\u00f6r webbdesigner, utvecklare och webbplats\u00e4gare att ens diskutera deras webbplatsers koldioxidutsl\u00e4pp, \u00e4n mindre g\u00f6ra n\u00e5got \u00e5t det.<\/p>\n

    Lyckligtvis \u00e4r det nu m\u00f6jligt att anv\u00e4nda gratisverktyget f\u00f6r att uppskatta webbplatsens CO2-utsl\u00e4pp p\u00e5 WebsiteCarbon.com<\/a> som ger uppgifter om koldioxidutsl\u00e4ppen per sidvisning, de \u00e5rliga koldioxidutsl\u00e4ppen (baserat p\u00e5 en viss m\u00e4ngd sidvisningar), den \u00e5rliga energif\u00f6rbrukningen och huruvida webbplatsen hostas i ett datacenter som drivs av f\u00f6rnybar energi. Med hj\u00e4lp av detta verktyg \u00e4r det m\u00f6jligt att j\u00e4mf\u00f6ra din egen webbplats mot konkurrenter och s\u00e4tta m\u00e5l f\u00f6r din egen koldioxidminskning.<\/p>\n

    \"M\u00e4tning
    M\u00e4tning av webbplatsers koldioxidutsl\u00e4pp<\/figcaption><\/figure>\n

    Data fr\u00e5n detta verktyg avsl\u00f6jar n\u00e5gra \u00f6verraskande fakta. Den genomsnittliga webbplatsen producerar 6,8 gram CO2 per sidvisning<\/strong>. Detta kanske inte l\u00e5ter som s\u00e5 mycket, men det blir snabbt v\u00e4ldigt mycket. En genomsnittlig webbplats med 10 000 sidvisningar per m\u00e5nad skulle producera 816 kg CO2 per \u00e5r. Det \u00e4r mer \u00e4n utsl\u00e4ppen fr\u00e5n ett flyg fr\u00e5n London till Tokyo.<\/p>\n

    \u00c5 andra sidan \u00e4r den mest effektiva webbplatsen som testats www.muskfoundation.org<\/a>, Elon och Kimbal Musks ideella stiftelse, med utsl\u00e4pp p\u00e5 bara 0,009 gram CO2 per sidvisning. Det kanske \u00e4r en brutalt minimalistisk webbplats som verkligen inte uppfyller f\u00f6rv\u00e4ntningar p\u00e5 anv\u00e4ndarupplevelse som de flesta moderna webbanv\u00e4ndare har, men det belyser hur effektiv en webbsida kan vara.<\/p>\n\n

    Minska data\u00f6verf\u00f6ring fr\u00e5n webbplatser<\/h2>\n

    Efter att ha testat utsl\u00e4ppen fr\u00e5n v\u00e5r befintliga webbplats och konkurrenternas webbplatser kan vi sedan vidta \u00e5tg\u00e4rder f\u00f6r att minska utsl\u00e4ppen. Eftersom data\u00f6verf\u00f6ringar direkt korrelerar med energif\u00f6rbrukning och utsl\u00e4pp \u00e4r en av de viktigaste sakerna vi m\u00e5ste g\u00f6ra att hitta s\u00e4tt att g\u00f6ra webbplatsen mer dataeffektiv<\/strong>. Det finns tv\u00e5 huvudsakliga s\u00e4tt att uppn\u00e5 detta.<\/p>\n

    F\u00f6r det f\u00f6rsta kan vi minska vikten (i KB) p\u00e5 alla v\u00e5ra webbsidor. Att minska sidvikten har m\u00e5nga ytterligare f\u00f6rdelar, inklusive snabbare laddningstider, vilket f\u00f6rb\u00e4ttrar anv\u00e4ndarupplevelsen och SEO, samt minskad dataanv\u00e4ndning f\u00f6r anv\u00e4ndare med begr\u00e4nsade Internetanslutningar. Detta kan vara s\u00e4rskilt viktigt f\u00f6r mobilanv\u00e4ndare och webbplatsbes\u00f6kare fr\u00e5n l\u00e5ginkomstgrupper, s\u00e4rskilt i utvecklingsl\u00e4nder d\u00e4r internetdata \u00e4r mycket dyrt i f\u00f6rh\u00e5llande till lokala l\u00f6ner.<\/p>\n

    N\u00e5gra enkla saker som vi kan g\u00f6ra f\u00f6r att minska sidvikten \u00e4r:<\/p>\n

      \n
    1. Vi kan skriva kod rent och effektivt.<\/li>\n
    2. Vi kan anv\u00e4nda vektorgrafik och CSS-effekter f\u00f6r att skapa en visuellt engagerande upplevelse med mycket mindre filer \u00e4n traditionella bilder som jpeg och Gif.<\/li>\n
    3. Vi kan ladda upp bilder i skala ist\u00e4llet f\u00f6r att f\u00f6rlita oss p\u00e5 CSS att \u00e4ndra storlek p\u00e5 dem. Om du anv\u00e4nder WordPress \u00e4r det inte lika viktigt eftersom det st\u00f6der responsiva bilder<\/a>.<\/li>\n
    4. Vi kan avlasta stora medie-filer<\/a> till tredjepartsleverant\u00f6rer som \u00e4r mer milj\u00f6v\u00e4nliga.<\/li>\n
    5. Vi kan komprimera filer, bilder och videor f\u00f6r att minska filstorlekar utan synlig kvalitetsf\u00f6rlust. Kolla in dessa inl\u00e4gg om bildoptimering<\/a> och destruktiv komprimering<\/a>. En n\u00e5got destruktiv komprimering kan l\u00e4tt minska en webbsida med \u00f6ver 90%!<\/strong> ?\"F\u00f6reF\u00f6re och efter komprimering<\/li>\n
    6. Vi kan undvika autoplay p\u00e5 videor och ist\u00e4llet be anv\u00e4ndaren att v\u00e4lja att spela upp videoklipp om de \u00e4r av intresse.<\/li>\n
    7. Vi kan minimera anpassade teckensnitt, som faktiskt kan utg\u00f6ra en stor del av den totala sidstorleken. Att anv\u00e4nda webbs\u00e4kra typsnitt<\/a> \u00e4r ett annat bra alternativ.<\/li>\n
    8. Vi kan besluta att inte l\u00e4ngre st\u00f6dja \u00e4ldre webbl\u00e4sare som IE8 och endast anv\u00e4nda moderna webbtypsnitt, s\u00e5som WOFF och WOFF2 som anv\u00e4nder h\u00f6gre komprimeringsmetoder. Kolla in den h\u00e4r handledningen om att anv\u00e4nda avskalade versioner av lokala typsnitt<\/a>.<\/li>\n
    9. Vi kan minska sp\u00e5rnings- och annonsskript, som f\u00f6rbrukar data samtidigt som de s\u00e4llan l\u00e4gger till n\u00e5got v\u00e4rde f\u00f6r anv\u00e4ndaren. Kolla in hur du analyserar prestanda fr\u00e5n tredje part<\/a> p\u00e5 din hemsida.<\/li>\n
    10. Vi kan anv\u00e4nda mobila l\u00f6sningar som AMP<\/a> f\u00f6r att omedelbart skala ner den aktuella versionen av en webbsida.<\/li>\n<\/ol>\n

      Under en webbplats totala livscykel \u00e4r f\u00f6rmodligen den b\u00e4sta regeln, ”om du \u00e4r os\u00e4ker, utel\u00e4mna det<\/strong>”.<\/p>\n

      Ofta om vi inte \u00e4r s\u00e4kra p\u00e5 om en webbplats beh\u00f6ver n\u00e5got, \u00e4r det frestande att l\u00e4gga till det f\u00f6r s\u00e4kerhets skull,\u00a0 men vi borde verkligen n\u00e4rma oss det fr\u00e5n motsatt perspektiv. Vi b\u00f6r utel\u00e4mna allt som vi inte \u00e4r s\u00e4kra p\u00e5 och sedan ta reda p\u00e5 om n\u00e5gon saknar det. F\u00f6rst d\u00e5 l\u00e4gger du till det p\u00e5 webbplatsen om det visat sig n\u00f6dv\u00e4ndigt och av v\u00e4rde.<\/p>\n

      Att implementera en cachningsl\u00f6sning<\/a> \u00e4r ocks\u00e5 mycket viktigt. Cachning \u00e4r processen att lagra resurser fr\u00e5n en f\u00f6rfr\u00e5gan och \u00e5teranv\u00e4nda dessa resurser f\u00f6r efterf\u00f6ljande f\u00f6rfr\u00e5gningar. I grund och botten minskar det m\u00e4ngden serverbandbredd som kr\u00e4vs f\u00f6r att generera en sidvisning genom att lagra statiska resurser externt fr\u00e5n webbhotellet.<\/p>\n

      Ta applikationen<\/a>, databasen<\/a> och den hanterade WordPress-v\u00e4rden<\/a> Kinsta till exempel. De har fyra olika typer av cachelagring<\/a>, som alla g\u00f6rs automatiskt p\u00e5 program- eller serverniv\u00e5:<\/p>\n