This post is a summary of the various topics this blog has covered since inception, with some short, “take-home” conclusions about sustainability theory as applied to the web, games, and other interactive systems.
Sustainable Virtual Design Principles
Core Concept: Sustainable web design meets the current needs of its users, without compromising the ability of those needs to be met in the future.
Take-home: Nathan Shredoff’s Version of Sustainable Design Seems to work best, adapted in his book, Design is the Problem: The Future of Design Must Be Sustainable:
|General Sustainability Principle||Sustainable Web Design Goals|
|Make meaningful products||Make websites that are have real value, not fashion or tech-tricks|
|Easy design rollback||Iterative or Agile design workflow|
|Source Renewable Materials||Switch to a “Green” webhost|
|Design products to work in the future||Implement classic design strategies|
|Design with the user in mind||Create effective User Experience (UX)|
|Ensure democratic access||Build accessible, responsive websites|
|Interchangable Parts||Apply standards-based design|
|Minimize energy and resource consumption||Web Performance Optimization (WPO)|
|Don’t corrupt the virtual system||Search Engine Optimization (SEO)|
When Green is NOT Green
Take-home: Jevons’ Law is writ large on the web. Increases in efficiency via Web Performance Optimization (WPO) lead to increased usage of Internet resources, with a net rise, rather than fall, of consumption. So, sustainability is more than Web Performance Optimization (WPO).
Take-home: Many, if not most, so-called “green” web hosts are not actually green. At best, these hosts trade carbon credits for their own energy-intensive and “dirty” infrastructure. This is especially true when “cloud” services run near peak capacity, and add local generators to supplement their power supply.
There is A LOT of greenwash among web hosts and designers.
Take-home: “Green Design” (often practiced by graphic designers migrating to the web) implies that visual layout and visual content somehow makes your green. But many, if not most, of the “greenest” websites by content and philosophy are big energy and network hogs. It is a case of designers feeling they need to preach, but that sustainability does not apply to them.
Take-home: Sustainability is a design problem, not a matter of holier than thou designers telling other people to be green.
Sustainability is Design, not WPO
Take-home: WPO (Web Performance Optimization) by itself is not sustainable. Designers cannot just do what they wan and expect WPO or site engineers to “fix” their wasteful design choices.
Take-home: Web optimization needs to move into the pure design layer as well as code. The modern “iterative design” model includes frequent testing and “rollback” to earlier designs if problems occur with the prototype website or app. However, to really implement sustainability, “rollback” needs to go all the way back to the design layer. For example, if WPO discovers that there are a lot of bulky images, rollback needs to go back to design – do we really need a layout that incorporates these images?
Take-home: Hybrid Designers and Agile Design Teams are more sustainable. If you have “T” shaped designers who understand each other’s jobs, the overall designs tend to be more sustainable. The anti-pattern is “waterfall” workflow, where an early-stage cool-looking graphic design can lead to an energy-hog final web page. In a waterfall, the WPO specialist or site engineers can’t influence the design. In agile design, in theory, late-stage sustainability issues can loop back and cause a site re-design.
Take-home: Standards-based design, Mobile First, and Progressive Enhancement are all more sustainable than the alternatives. Inclusive Design gives virtual design a major element of traditional sustainability frameworks. Future-friendly design captures the essence of all sustainability frameworks.
Take-home: Some popular ideas, e.g. “invisible design,” are not necessarily sustainable.
Take-home: Sustainability can be a tool for resolving design strategy debates.
Sustainability and User Experience (Ux)
Take-home: There’s a possible law here: UX sustainability DOES NOT EQUAL energy sustainability.
Take-home: However, “lean UX” – as a design principle within a development team (e.g. using paper prototypes in agile development instead of a waterfall development path cranking out fully realized prototypes) could easily result in greater sustainability of the process of web design – this should be independent of Jevons’ Paradox.
What Everyone Can Do
Take-home: You don’t need a high-power WPO company or Site Engineers to make your site more sustainable. Optimizing sites follows an 80/20 rule. You can get 80% of the benefit by taking a few basic steps to sustainability:
- Optimizing images
- Reducing HTTP requests
- Standards-based code
- Progressive enhancement strategy
- Avoiding excessive reliance on plugins for interface
- Responsive layout
- Responsive Logo and Responsive Image design
Similar to industrial design and architecture, a “swapping green ingredient” strategy may be appropriate for developing sustainability in games and on the web.
10 Principles of Sustainable Web Design
All-in-One Visual Web Editors are Less Sustainable
Take-home: A purely visual “web page editor” encourages less sustainable design. This is due to two reasons
- Designers don’t know when a design decisions has resulted in wasteful code and markup
- Designers are encouraged to think of web design as traditional (read print) design layout, instead of interactive design
Take-home: For this reason, tools like Adobe Muse typically “damage the earth.”
Properly used, a tool like Muse would be fine, but the interface encourages wasteful design – typically trying to shoehorn the web into a print design book. It also allows designers to disconnect themselves from the Internet ecosystem and pretend it is just a matter of Creative Suite style layout.
Online Editors and CMS
Online editors (e.g. Wix, SquareSpace) are better than visual web editors. This is due to the templates in these online tools being optimized by human designers, and their commitment to a web-centric (as opposed to design tool-centric) model for building web pages. Compared to web editors, they are more standards-based (more inclusive design) and efficient (less drag on the Internet). They exploit efficiency systems like Content Delivery Networks (CDN) which are the equivalent of “local sourcing” in web design.
Take-home: So, if you are going to develop a site without doing your own code, Wix is a much better option than Muse or SiteGrinder (now imitated in Dreamweaver CS6, which promises to convert Photoshop comps to web pages).
Take-home: The only thing worse than a visual web editor is a Content Management System (e.g. WordPress) loaded with a huge number of plugins by “web designers” who don’t understand their medium. Such sites are typically the Hummer sites of the Internet.
Game Design is Anti-Green
Take-home: Whatever the sins, of web design, game design and development are aggressively anti-green.
Not only do games ignore various efficiency measures in favor of maximum CPU/GPU burn, but the culture of gaming itself encourages (in the name of entertainment) pleasures of uninhibited excess. If you can constantly be “reborn” after dying, what is the take-home message? If you avatar has incredible power, what does that imply about real power. If a “power cell” is just a magic amulet your game character uses, do you imagine that real power can be generated that way? In games, everything will last forever and you can have it all, if you perform the right tricks.
So, game design is unsustainable at the technical, and user content level.
Computing Virtual Sustainability
There are no good standards for computing the sustainability or even the true “carbon footprint” of websites and apps. We need better ideas of how to compute the cost of adding a page to a site, and app to a phone, or a site to the Internet.
A few “green” templates exist, (iSkeleton) but are not widely used. I’ve been working on ideas for a “green boilerplate” (see http://greenboilerplate.com) but as yet they are not ready for prime time.
Take-home: We need a Green Boilerplate!