Sustainable web design(sustainablewebdesign.org)
sustainablewebdesign.org
Sustainable web design
https://sustainablewebdesign.org/
48 comments
When I read Dieter Rams in a web design article I cannot feel anything opposite to cringe.
From their manifesto [0] https://www.sustainablewebmanifesto.com/
> Efficient
> The products and services we provide will use the least amount of energy and material resources possible.
Ha! Let's see how much impact this has on the current web industry.
Development velocity vs efficiency.
I've yet to see a shop avoid Tower of Babel stacks that increase the former, at the expense of the latter. Unless it's a backwards-compatible drop-in upgrade. And even then, it doesn't bubble high on the priority list.
[0] Obligatory https://m.youtube.com/watch?v=BwozkbmjzC4
> Efficient
> The products and services we provide will use the least amount of energy and material resources possible.
Ha! Let's see how much impact this has on the current web industry.
Development velocity vs efficiency.
I've yet to see a shop avoid Tower of Babel stacks that increase the former, at the expense of the latter. Unless it's a backwards-compatible drop-in upgrade. And even then, it doesn't bubble high on the priority list.
[0] Obligatory https://m.youtube.com/watch?v=BwozkbmjzC4
There's a well-known correlation between site speed, and selling more stuff. So, the idea that a shop wouldn't be interested in having an efficient website is incorrect.
As for backwards-compatible drop-in upgrades. They do exists, and people do use them. Making them easier would go a long way.
An example would be migrating a wordpress site to be statically generated — there are plugins and services that do that.
As for backwards-compatible drop-in upgrades. They do exists, and people do use them. Making them easier would go a long way.
An example would be migrating a wordpress site to be statically generated — there are plugins and services that do that.
Interested is one thing. Companies are interested in many things. Equality, human rights support, sustainability, etc. That doesn't mean they value them more than something which influences the bottom line. Or will adopt them at a cost to the bottom line.
If you're going to pitch slower and more expensive development to a team, it needs a lot better hook than this.
... Unless we're talking about Exxon, who will probably adopt this tomorrow to show how seriously they take climate change.
If you're going to pitch slower and more expensive development to a team, it needs a lot better hook than this.
... Unless we're talking about Exxon, who will probably adopt this tomorrow to show how seriously they take climate change.
In my experience, making a sustaible website means doing more talking, and a lot less coding. You are making less stuff after all.
It's also about creativity, having pride in your work, living your values.
It's also about creativity, having pride in your work, living your values.
It's easy to be cynical about projects like this but it made me think about how the work I do on a day-to-day basis effects the environment in a way I didn't before, so I appreciate it!
Given the latest IPCC report, I thought it would be worth sharing this site about sustainable web design.
The internet is responsible for around 5% of global carbon emissions. It's difficult to measure, and generally not visible to the public.
The solution however is fairly simple — use less data.
Fast, accessible websites usually produce less CO2 and we already know how to do that. Now we just need to get web developers to do it. This will require:
- educating developers and designers - smart defaults for web developers - fostering competition - making the invisible cost of the internet visible
This is a reletively new dicipline — so anything you have to add to the mix will have a large impact.
The internet is responsible for around 5% of global carbon emissions. It's difficult to measure, and generally not visible to the public.
The solution however is fairly simple — use less data.
Fast, accessible websites usually produce less CO2 and we already know how to do that. Now we just need to get web developers to do it. This will require:
- educating developers and designers - smart defaults for web developers - fostering competition - making the invisible cost of the internet visible
This is a reletively new dicipline — so anything you have to add to the mix will have a large impact.
> The internet is responsible for around 5% of global carbon emissions.
Right, the internet (not necessarily the web)
> The solution however is fairly simple — use less data
Agreed.
> Fast, accessible websites usually produce less CO2
That's a drop in the bucket. If you look at what's _actually_ using data on the internet, it's streaming services (netflix, zoom, spotify). Fast, accessible websites have plenty of benefits, but if you want to actually reduce the amount of waste, far more effective solutions are things like lowering your video quality slightly (backgrounding futurama? Drop it to 480p.)
Right, the internet (not necessarily the web)
> The solution however is fairly simple — use less data
Agreed.
> Fast, accessible websites usually produce less CO2
That's a drop in the bucket. If you look at what's _actually_ using data on the internet, it's streaming services (netflix, zoom, spotify). Fast, accessible websites have plenty of benefits, but if you want to actually reduce the amount of waste, far more effective solutions are things like lowering your video quality slightly (backgrounding futurama? Drop it to 480p.)
Can someone concisely explain how using more data in a general sense is contributing to CO2 emissions? I mean, if I use Bittorrent for example, the data is flowing through ISPs and from users' computers. I imagine the impact is negligible in the grand scheme of things. For hosted service I understand there's some cost to the datacenters used to serve the data, but the processing certainly has much more of an impact.
At the end of the day, the real culprit is the infrastructure, and emergence of tech giants who don't have environmental sustainability anywhere in their mission.
At the end of the day, the real culprit is the infrastructure, and emergence of tech giants who don't have environmental sustainability anywhere in their mission.
The difference between idle and load energy consumption of switches, routers, etc
>The solution however is fairly simple — use less data.
About what, 99% of which is video streaming? Not scripts. Sorry to harp on you man but every time somebody pats themselves on the back for switching off a light, and feels ok flying across the world because they have no perspective on the relative impacts, the problem is perpetuated. And by directing people's attention to extremely relatively negligible areas for effort, you are causing people to waste literal energy.
Video streaming is about 60% of the web. Not 99%.
But, in what sense in video streaming not part of the web?
Sustainable web design is just as applicable to streaming as e-commerce or a blog.
It’s also not at all the same as turning off a lightbulb.
It’s more like one action resulting in turning off millions of other peoples light bulbs.
But, in what sense in video streaming not part of the web?
Sustainable web design is just as applicable to streaming as e-commerce or a blog.
It’s also not at all the same as turning off a lightbulb.
It’s more like one action resulting in turning off millions of other peoples light bulbs.
I haven't checked the figures put forward here but anything that encourages the industry to improve site performance - and an indirect result of these efforts seems to do just that - is greatly welcomed. Now when you want to argue against the embedding of another framework/library and the usual performance reasons don't cut it, just say it's about sustainable design.
I just read Sustainable Web Design by Tom Greenwood, one of the makers of the linked site.
One of the points he made was that it's very difficult to sell sustainable design, and much easier to just tell clients it's about performance.
His other observation was that clients care a lot if you tell them their competitor is doing environmentalism better.
One of the points he made was that it's very difficult to sell sustainable design, and much easier to just tell clients it's about performance.
His other observation was that clients care a lot if you tell them their competitor is doing environmentalism better.
> The internet is responsible for around 5% of global carbon emissions.
How much of that is high quality video streaming? How much could be reduced by forbiddin resolutions over 1080p for example?
How much of that is high quality video streaming? How much could be reduced by forbiddin resolutions over 1080p for example?
The web creates emissions, but I also wonder about how much it saves, with things like video conferencing, and making physical technology obsolete (the waste of optical media, like DVDs springs to mind).
We also have to be careful when making such assessments. The semiconductor industry was once viewed as clean, and maybe it was clean compared to older industries. Yet that perception came from appearances rather than fact since the pollution was either invisible (e.g. hazardous chemicals leeching into the ground, verses belching smokestacks) or out of sight (e.g. rare earths are often extracted in foreign nations). In order to figure out how much of an environmental impact something has, we need to collect data and do an analysis rather than depending upon what we can see and touch.
Even then, reliable data and analysis may produce differing conclusions based upon shifting priorities. Today's discussions are tied to greenhouse gasses. In prior decades, environmental discussions were tied to: deforestation and habitat loss, groundwater pollution, air pollution with respect to public health and acid rain, the ozone hole, etc..
Even if we could agree on priorities, it is difficult to assess the true impact because technological change brings about behavioural change. The automobile may be cleaner than the horse and buggy. On the other hand, more people walked or used mass transit before the automobile. Streaming a movie may be cleaner than watching a DVD, but is it cleaner when each member of a household is viewing a different movie on a portable device in contrast to watching a broadcast together on the family TV.
Even then, reliable data and analysis may produce differing conclusions based upon shifting priorities. Today's discussions are tied to greenhouse gasses. In prior decades, environmental discussions were tied to: deforestation and habitat loss, groundwater pollution, air pollution with respect to public health and acid rain, the ozone hole, etc..
Even if we could agree on priorities, it is difficult to assess the true impact because technological change brings about behavioural change. The automobile may be cleaner than the horse and buggy. On the other hand, more people walked or used mass transit before the automobile. Streaming a movie may be cleaner than watching a DVD, but is it cleaner when each member of a household is viewing a different movie on a portable device in contrast to watching a broadcast together on the family TV.
> The internet currently produces approximately 3.8% of global carbon emissions, which are rising in line with our hunger to consume more data.
This is not about "hunger to consume more data". Actual data doesn't take much. Needlessly inflated codebases and excessive video fidelity do.
Most of the people could use a decades-old computer and a <1Mbit/s connection to get and send all the information they might ever be interested in if we didn't insist on using huge JavaScript libraries, fancy design and HD+ video we lived perfectly well without just a decade ago. The problem is we seemingly need ever increasing everything to keep the economy growing.
This is not about "hunger to consume more data". Actual data doesn't take much. Needlessly inflated codebases and excessive video fidelity do.
Most of the people could use a decades-old computer and a <1Mbit/s connection to get and send all the information they might ever be interested in if we didn't insist on using huge JavaScript libraries, fancy design and HD+ video we lived perfectly well without just a decade ago. The problem is we seemingly need ever increasing everything to keep the economy growing.
I'm constantly downgrading video on many sites myself, as I am perfectly content to stream in 720p max for movies, 480p for your average YT video, and even down to 144p for just streaming audio and podcasts. I only need 720p and 1080p for tutorials or online courses, and even then mostly because the streamers are using HD or UHD displays and I can't see what they're typing or essential UI elements I need to see.
I don't WANT HD or higher videos or user streams - it's wasting my own data on my end as well.
Inflated websites too with high-res images need a strainer these days to get to the information, or many sites have replaced simple text with HD video - which can get aggravating after awhile when I need to look up a procedure quick, and have to watch a 5 minute video instead of 4 seconds of reading the solution in text form.
Yes, go on most popular websites, and most of the data consumption is not anything the visitor wants.
This also has the effect of shutting out people with expensive data, or slow networks. Who i'd guess are the same people most effected by the climate crisis.
This also has the effect of shutting out people with expensive data, or slow networks. Who i'd guess are the same people most effected by the climate crisis.
We should send invoices to sites that send data across set thresholds.
What's that, bloated news site? You don't want a bill of 10 USD per page served? Cut your bloat.
What's that, bloated news site? You don't want a bill of 10 USD per page served? Cut your bloat.
What do you mean "we"?
Regular people don't ask for this stuff. It is presented to them as a gift, and they take the gift because of this or that specific reason. Don't blame regular people; they aren't the ones actively trying to keep the growth machine rolling.
Regular people don't ask for this stuff. It is presented to them as a gift, and they take the gift because of this or that specific reason. Don't blame regular people; they aren't the ones actively trying to keep the growth machine rolling.
> Most of the people could use a decades-old computer and a <1Mbit/s connection
The computer I'm writing this on is nearly a decade old and performs perfectly well on modern websites. Granted, I'm not going to try using a < 1Mb/s connection.
That being said, I agree that things like client-side (and server-side) scripting and video decoding (and encoding) reflects a disinterest in environmental concerns. I will disagree about the quantity of data playing a negligible role, since serving it may not be very energy hungry but building out infrastructure is. We can satisfy our needs with a lot less if we used all of our resources more effectively.
The computer I'm writing this on is nearly a decade old and performs perfectly well on modern websites. Granted, I'm not going to try using a < 1Mb/s connection.
That being said, I agree that things like client-side (and server-side) scripting and video decoding (and encoding) reflects a disinterest in environmental concerns. I will disagree about the quantity of data playing a negligible role, since serving it may not be very energy hungry but building out infrastructure is. We can satisfy our needs with a lot less if we used all of our resources more effectively.
Tried the ecograder tool on my github hosted single page html just for kicks.
It rated as not mobile friendly (even if I have separate media queries for mobile/tablet).
It ranked negatively on MozRank (how well linked (?) it is from other websites, which I don't understand -- neither does it explains -- how it relates to eco friendliness). At least the main site itself is penalized by the same MozRank criteria.
Seems like a tool to generate leads to Mightybyte consulting services (who developed the tool, a founding organization behind sustainable web design).
About the manifesto I have mixed feelings, to me it feels rather "wishy washy".
Wish them luck with the project.
It also has the same bug I encounter often on full bleed designs where there's extra padding/margin that makes a horizontal scrollbar visible. Which reminds me that even experienced designers still don't have a good grasp on CSS /s
It rated as not mobile friendly (even if I have separate media queries for mobile/tablet).
It ranked negatively on MozRank (how well linked (?) it is from other websites, which I don't understand -- neither does it explains -- how it relates to eco friendliness). At least the main site itself is penalized by the same MozRank criteria.
Seems like a tool to generate leads to Mightybyte consulting services (who developed the tool, a founding organization behind sustainable web design).
About the manifesto I have mixed feelings, to me it feels rather "wishy washy".
Wish them luck with the project.
It also has the same bug I encounter often on full bleed designs where there's extra padding/margin that makes a horizontal scrollbar visible. Which reminds me that even experienced designers still don't have a good grasp on CSS /s
I think you're right on all points. Unfortunately there's not many other people doing any of this stuff.
MightyBytes and WholegrainDigital, seem to be the leaders in this space.
Which is why I'll be sending them a long, annoying list of things I think can be improved.
---
the idea of the MozLink thing is that you reduce the number of clicks it takes to find your website — and so reducing the number of requests made to servers.
It's not a very good metric.
MightyBytes and WholegrainDigital, seem to be the leaders in this space.
Which is why I'll be sending them a long, annoying list of things I think can be improved.
---
the idea of the MozLink thing is that you reduce the number of clicks it takes to find your website — and so reducing the number of requests made to servers.
It's not a very good metric.
> the idea of the MozLink thing is that you reduce the number of clicks it takes to find your website — and so reducing the number of requests made to servers.
And then they send you on a merry goose chase through various blog sites if you want to understand what MozLink is, and how you can improve it. How ironic.
And then they send you on a merry goose chase through various blog sites if you want to understand what MozLink is, and how you can improve it. How ironic.
I ran the ecograder tool on a portfolio website I'm making for my girlfriend. It suggested I embed all the images in css (massively increasing the bytes on first request...). It also suggested that I use shared libraries on CDNs like jquery hosted by google, even though browsers no longer cache cross domain due to security risks.
Yes this tool is pretty crappy. Gave me same kind of advice for my nojs, no img personal website. I do agree with the website's manifest though.
I have a nice alternative benchmark for sustainability: does it load fast on firefox on my xiaomi redmi note 4? Yes? Then it's probably sustainable web design.
Probably a reasonably decent benchmark, given its age and specs.
I think the only reasonable step "up" (or down, specs wise) would be acceptable performance on $30 KaiOS devices, to maximize accessibility to visitors from developing countries, but that's about it?
I think the only reasonable step "up" (or down, specs wise) would be acceptable performance on $30 KaiOS devices, to maximize accessibility to visitors from developing countries, but that's about it?
I find it very weird that they have a grade for not using flash in 2021
Yeah, I'm not sure when that calculator was made, but somebody needs to make a better one.
Interesting use of the word "Sustainable", where I would expect a topic named "sustainable web design" to be about unsustainable employment practices, and unsustainable frameworks - both of which the industry is promoting unsustainably.
"This page loaded in 5.8 seconds and emitted just 0.49g of CO2" - on a modern desktop. If that's fast and sustainable I don't know..
Right up there with metal straws in its usefulness and impact.
Indeed. The idea is noble (if things like Youtube ran better on old devices, a lot of people would be forced to upgrade less often), but the opaqueness of the benchmarks and the "please give us money for books/consultancies" approach makes me question their intentions.
Does having colours on your site (such as theirs) increase energy? Should we only have black and white websites since black uses less energy on OLED/LCD?
I am a big fan of sustainability, but this seems a little bit much.
I am a big fan of sustainability, but this seems a little bit much.
The energy usage is very small — as mobile devices are generally very efficient. But the impact it has on battery life is big — and using more battery results in the battery dying sooner and then the consumer needing to get a new phone.
A simple half-way solution to this is just to support a dark mode. People generally prefer it anyway.
A simple half-way solution to this is just to support a dark mode. People generally prefer it anyway.
> Does having colours on your site (such as theirs) increase energy?
Only on OLED screens, which still don't have a that impressive market share.
Only on OLED screens, which still don't have a that impressive market share.
And almost comically CRT screens.
Anyone remember blackle.com?
Anyone remember blackle.com?
Interesting privacy policy:
# Can you delete my test results?
If you have submitted a test and do not want the results public, then we have a simple policy:
[…]
If you have tested a public url we will not delete the results.
# Can you delete my test results?
If you have submitted a test and do not want the results public, then we have a simple policy:
[…]
If you have tested a public url we will not delete the results.
I don't know if I'd put a lot trust into the ecograder.
It states that my personal website is mobile optimized....I know for a fact it isn't because it's terrible on mobile (incorrect padding and margins...just haven't got around to fixing it).
Their calculator seems to not be working atm ( hug of death), and maybe it's described there, but anyways:
How do they measure this? Do they have the electricity consumption and supply of each datacenter around the globe? Two DCz in Poland, one using coal energy, or another one using only renewable energies; the first one has latest gen servers and networking equipment; the second one 15 year old stuff. Which one uses less CO2?
There can be lots of differences depending on location and specificities.
How do they measure this? Do they have the electricity consumption and supply of each datacenter around the globe? Two DCz in Poland, one using coal energy, or another one using only renewable energies; the first one has latest gen servers and networking equipment; the second one 15 year old stuff. Which one uses less CO2?
There can be lots of differences depending on location and specificities.
The headline figure of "3.8% of global carbon emissions" is currently un-sourced - so I'm very curious to see what it includes.
IEA claims datacenters account for 1% of electricity demand and data networks are another 1%:
IEA (2020), Data Centres and Data Transmission Networks, IEA, Paris https://www.iea.org/reports/data-centres-and-data-transmissi...
Now, those figures are _electricity_ not _carbon emissions_ - so perhaps the 3.8% figure includes e.g. datacenter construction emissions, or emissions related to producing servers and networking equipment?
IEA claims datacenters account for 1% of electricity demand and data networks are another 1%:
IEA (2020), Data Centres and Data Transmission Networks, IEA, Paris https://www.iea.org/reports/data-centres-and-data-transmissi...
Now, those figures are _electricity_ not _carbon emissions_ - so perhaps the 3.8% figure includes e.g. datacenter construction emissions, or emissions related to producing servers and networking equipment?
I have tried for a while to find a web-host which can report an estimation of my environmental impact based on usage. I have not been successful and the project for which I needed this we had to go with self-hosting(which likely is less sustainable) and having to calculate this based on information from our ISP/electricity companies.
Lot's of hosting companies including all the large clouds have marketing pages about their sustainability efforts but only an obscure, expense, and inaccessible Azure service can provide CO2 pollution estimations from ones usage...
Lot's of hosting companies including all the large clouds have marketing pages about their sustainability efforts but only an obscure, expense, and inaccessible Azure service can provide CO2 pollution estimations from ones usage...
https://solar.lowtechmagazine.com comes quite close IMO. And: make it long-term-proof, so you can leave things as they are for decades.
I'd bet a lot that non-video-streaming web browsing is a tiny bit of "tech carbon consumption". What's consuming most is probably big DCs doing various backend compute stuff and high-speed/high-bandwidth streaming (on the web and mostly out of the web, like netflix and co). Also for high-tech a very big part (in the 10s of %) of whole-life energy consumption is used at manufacture (and destruction), not during use, so a big driver of consumption is culturaly and technologicaly-induced turnover/obsolescence.
As for the web, imho there's mostly one hard solution being static web-sites being aggressively cached in a broadcast tree (as in real offline-modes, website downloading). Just like high-speed personal transportation vs collective fixed-schedule medium-speed transportation. I'd guess internet consumption is not much dependent on distance, but speed and duplication of the transfers, that's probably a thing.
In this kind of realm i'd be curious to see the life-cycle energy cost comparison of radio-broadcast numeric TV vs cabled broadcast. Perhaps we could use numeric radio-broadcast as a distribution channel for many-to-one websites like news and newsletter-type of big social media profiles. I hope to one day say "oh it's 4:03 i'll tune my receiver to get the local blog updates".
As for the web, imho there's mostly one hard solution being static web-sites being aggressively cached in a broadcast tree (as in real offline-modes, website downloading). Just like high-speed personal transportation vs collective fixed-schedule medium-speed transportation. I'd guess internet consumption is not much dependent on distance, but speed and duplication of the transfers, that's probably a thing.
In this kind of realm i'd be curious to see the life-cycle energy cost comparison of radio-broadcast numeric TV vs cabled broadcast. Perhaps we could use numeric radio-broadcast as a distribution channel for many-to-one websites like news and newsletter-type of big social media profiles. I hope to one day say "oh it's 4:03 i'll tune my receiver to get the local blog updates".
I was actually expecting this would have something to say about programming frameworks that abuse system resources, waste memory and peg client & server CPU, and maybe even about programmers who blame the equipment for not accommodating their abuse, and maybe even at the greatest extreme, about a tendency to blame software problems on easy corporate targets while ignoring open source accountability. Maybe going even further still to talk about software churn, framework-of-the-month rewrite-everything mentalities, and so forth.
I mean, hey, there are things we can do besides picketing amazon for building spaceships instead of solar arrays.
I mean, hey, there are things we can do besides picketing amazon for building spaceships instead of solar arrays.