Warum unser Web nachhaltiger werden muss und wie wir das anstellen!

A presentation at Drupal & Friends Barcamp Schwerin in September 2019 in Schwerin, Germany by Niklas Jordan

Slide 1

Slide 1

The Planet Friendly Web Warum unser Web nachhaltiger werden muss und wie wir das anstellen! #dfsn19

Slide 2

Slide 2

Infografik zeigt Erderhitzung in Deutschland (showyourstripes.info)

Slide 3

Slide 3

Auge des Hurricane Dorian (Copernicus Sentinel data – 2019/ESA)

Slide 4

Slide 4

Im „echten“ Leben spielt Nachhaltigkeit zunehmend eine große Rolle…

Slide 5

Slide 5

Bitte denken Sie an unsere Umwelt, bevor Sie diese E-Mail ausdrucken. Hinweis in Signaturen zum nachhaltigen Umgang

Slide 6

Slide 6

This Website is powered by Renewable Energy. Möglicher Hinweis auf Website

Slide 7

Slide 7

Hinweis auf solar.lowtechmagazine.com

Slide 8

Slide 8

Daten

Slide 9

Slide 9

Daten

Elektrizität

Slide 10

Slide 10

Daten

Elektrizität

CO2

Slide 11

Slide 11

Grafik: aus dem Buch Designing for Sustainability von Tim Frick (O’Reilly)

Slide 12

Slide 12

Internet 830 Mio. t CO2 Emissionen pro Jahr (Quelle: alistapart.com/article/sustainable-web-design)

Slide 13

Slide 13

Quelle: www.co2-emissionen-vergleichen.de

Slide 14

Slide 14

Internet Data Center 830 Mio. t 332 Mio. t CO2 Emissionen pro Jahr (Quelle: alistapart.com/article/sustainable-web-design)

Slide 15

Slide 15

Illustration von Artiom Dashinsky (uxdesign.cc/product-design-for-sustainability)

Slide 16

Slide 16

  1. Woher kommt die Energie, die meinen Server versorgt? 2. Wie viel Ressourcen sende ich? 3. Gehe ich mit externen Ressourcen verantwortungsvoll um?

Slide 17

Slide 17

By day technology advocate for #environment issues, #Tech4Wildlife, #TechEthics, #OpenScience & #UX, by night, studying #EarthScience. Loves rough weather! @niklas_jordan niklasjordan.com/newsletter

Slide 18

Slide 18

bit.ly/pfw-dfsn19 @niklas_jordan niklasjordan.com/newsletter

Slide 19

Slide 19

  1. Woher kommt die Energie, die meinen Server versorgt? 2. Wie viel Ressourcen sende ich? 3. Gehe ich mit externen Ressourcen verantwortungsvoll um?

Slide 20

Slide 20

Aus dem ClickClean-Report von 2017: clickclean.org/germany/de/

Slide 21

Slide 21

Checke ob eine Website mit grüner Energie betrieben wird: thegreenwebfoundation.org

Slide 22

Slide 22

  1. Woher kommt die Energie, die meinen Server versorgt? 2. Wie viel Ressourcen sende ich? 3. Gehe ich mit externen Ressourcen verantwortungsvoll um?

Slide 23

Slide 23

Berechne die CO2 Emissionen deiner Website: websitecarbon.com

Slide 24

Slide 24

Quelle: speedcurve.com/blog/web-performance-page-bloat

Slide 25

Slide 25

Werbung bläht Seiten auf (Grafik: New York Times)

Slide 26

Slide 26

Quelle: cnet.com/news/web-sites-are-getting-faster-but-not-enough/

Slide 27

Slide 27

Definiere ein Performance Budget: performancebudget.io

Slide 28

Slide 28

Beispiel: wikipedia.de

Slide 29

Slide 29

Beispiel: wikipedia.de

Slide 30

Slide 30

~ 45 kb Beispiel: wikipedia.de

Slide 31

Slide 31

~ 45 kb Beispiel: wikipedia.de

Slide 32

Slide 32

~ 45 kb Beispiel: wikipedia.de

Slide 33

Slide 33

170 Mio. Impressionen (pro Monat) Rechenbeispiel: Impressionen von Wikipedia

Slide 34

Slide 34

170 Mio. * 25 kb Rechenbeispiel: Impressionen * eingespartes Dateivolumen

Slide 35

Slide 35

170 Mio. * 25 kb = 4352 Gb Rechenbeispiel: ergibt das eingesparte Volumen

Slide 36

Slide 36

170 Mio. * 25 kb = 4352 Gb * 0,7 (Caching) Rechenbeispiel: ergibt das eingesparte Volumen

Slide 37

Slide 37

170 Mio. * 25 kb = (4352 Gb * 0,7) * 5 kWH Rechenbeispiel: 1 Gb benötigt ca. 5 kWh Leistung

Slide 38

Slide 38

170 Mio. * 25 kb = (4352 Gb * 0,7) * 5 kWH = 15.232 kWh Rechenbeispiel: ergibt 15.232 kWh – eingesparte Leistung durch das verringern der Größe einer Datei

Slide 39

Slide 39

7t Rechenbeispiel: eingesparte CO2 Emissionen in Tonnen

Slide 40

Slide 40

14 x Berlin > London

Slide 41

Slide 41

Greenhouse - Lighthouse, but for carbon emissions (github.com/thegreenwebfoundation)

Slide 42

Slide 42

Videos sind für 60% des weltweiten Datenverkehrs verantwortlich (Quelle: The Shift Project)

Slide 43

Slide 43

  1. Woher kommt die Energie, die meinen Server versorgt? 2. Wie viel Ressourcen sende ich? 3. Gehe ich mit externen Ressourcen verantwortungsvoll um?

Slide 44

Slide 44

Ethical Design Manifesto von ind.ie

Slide 45

Slide 45

Business Case

Slide 46

Slide 46

Wenn der Seitenaufruf sich um eine Sekunde verlangsamt, sinken die Umsätze jährlich um 1,6 Milliarden Euro. Amazon

Slide 47

Slide 47

Neue Nutzer gewinnen Business Case Verbesserte User Experience Geld sparen Optimierung für Suchmaschinen

Slide 48

Slide 48

Ziehe zu einem grünen Hoster um Checke deine verursachten Emissionen Optimiere deine Performance, UX, A11y und Inhalte

Slide 49

Slide 49

Noch was?!

Slide 50

Slide 50

Sprich darüber! Article: How to Have a Useful Conversation About Climate Change in 11 Steps

Slide 51

Slide 51

Engagiere dich politisch! globalclimatestrike.net

Slide 52

Slide 52

“The web must be an environmentally sustainable platform The web, as a whole, is a big consumer of power. New web technologies should not make this situation worse. We will consider power consumption when we introduce new technologies to the web.” W3C Technical architecture group Engagiere dich professionell! W3C Ethical Web Principles

Slide 53

Slide 53

ClimateAction.tech

Slide 54

Slide 54

techimpactmakers.com

Slide 55

Slide 55

Illustration von Artiom Dashinsky (uxdesign.cc/product-design-for-sustainability)

Slide 56

Slide 56

Hört auf Captain Planet…

Slide 57

Slide 57

Danke. bit.ly/pfw-dfsn19 @niklas_jordan niklasjordan.com/newsletter