Lighten the Load

• Create websites with faster load times by reducing both bandwidth and CPU demands. Visitors will conserve energy navigating your page which ultimately contributes to better usability.
• Export images and video at either the exact sizes necessary for the end user, or at the maximum necessary size if you are using a server-side service to deliver optimized assets for the end user’s device.
• Use resources like ImageOptim to reduce image file sizes. Consider using a server-side image optimizer to ensure that all image assets are delivered with the minimal necessary bandwidth.
• Prioritize the more efficient image format WebP over GIF, JPEG, and PNG.
• Data compression is very energy intensive, so avoid compressing any asset more than once. If you are using a server side service that compresses uploaded assets (including Vimeo & YouTube), upload uncompressed files. The increase in bandwidth usage will likely require far less energy than pre-compressing the files, and this will also deliver higher quality media assets.
• When possible, use system fonts or support variable fonts (using subsetting if applicable), instead of requiring the user to use bandwidth downloading specific fonts for your website.
• When coding, pay attention to the client-side CPU load incurred by your CSS and Javascript. If possible, experiment with different combinations of CSS, custom Javascript, and pre-existing libraries such as JQuery, in order to discern the least resource intensive technological implementation.
• Keep clean code, optimize scripts and remove dead code.
• Encourage clients to remove any irrelevant or unnecessary content.
• Avoid the use of carousel banners that increase load times, and make use of lazy loading and other just-in-time data loading technologies.
• When choosing pre-existing libraries and themes, look for lightweight assets with a minimal footprint.
• Minimize the amount of complexity and data required for email signatures and auto-replies.
• Test performance and load time by using resources such as Ecograder, GTmetrix and Website Carbon.
• Avoid using colour schemes that might require the user to turn up the brightness on their display.

Sustainable Practices for Digital Devices

• Consider the energy sources used by your service providers, particularly for web hosts.
• Set your screen to the minimum necessary brightness for the work you are doing. Experiment with “dark mode” and “light mode” to see if one requires less brightness on your screen. Note that “dark mode” requires less energy on CRT and OLED screens, but may require more energy on the more common LCD/LED screens.
• Set devices and peripherals to use sleep mode whenever possible, and shut them off entirely if they are no longer in use.
• Instead of printing files or documents, consider where you can digitize your content or request digital signatures.