Best practices used:
In creating a sustainable website, we implemented a number of design and development practices to reduce the environmental impact of the site. These included:
- Simple and clear navigation: We designed the website with a straightforward and intuitive navigation structure, making it easy for users to find the information they need.
- Neubrutalist style layout: We used a minimalist, neubrutalist design style, which emphasizes simplicity and functionality, reducing the visual clutter and complexity of the site.
- Low-weight components: We used lightweight components, such as SVG illustrations, to minimize the size of the site and reduce load times.
- Open-source fonts: We chose open-source fonts to reduce the need for additional web requests and improve performance.
- Different color modes: We provided different color modes for the website, with less white color, which requires the most energy to display, reduce the energy consumption of the site.
- Font and page weight budget: We set a budget for the weight of fonts and pages to minimize the impact on loading times.
- Efficient programming languages: We used efficient, energy-intensive programming languages to minimize the environmental impact of the site.
- Static sites: We used Jamstack technology, to generate a static version of the website, which reduces server load and improves performance.
- GDPR policies: We followed GDPR policies and did not collect unnecessary data to protect user privacy.
- Page caching: We enabled page caching to reduce the number of requests to the server and improve performance.
Overall, we took a holistic approach to sustainable design and development, considering both the environmental impact and user experience of the site.
What tools were used:
To create a sustainable website, we used the Svelte JavaScript framework for building user interfaces, the Astro static site generator for performance optimization, and the Sanity content management system (CMS) for managing and organizing our content. Svelte allows for efficient and reactive updates to the website, while Astro’s static generation improves load times and reduces server strain. Sanity provides a user-friendly interface for managing and updating website content, and its flexible architecture allows for easy integration with Svelte and Astro. Together, these technologies form a robust and sustainable web development stack.
One thing that helped reach the goal:
One of the key factors that helped us reach our low-carbon website goals was setting a page-weight budget and being mindful of the content we included on the site. By setting a budget for the weight of the pages, we were able to minimize the impact on loading times and reduce the site’s environmental impact. We carefully considered each piece of content we added to the website, ensuring that it was necessary and beneficial to the user experience. By being mindful of the weight of the site and the content we included, we were able to create a website that was both sustainable and user-friendly.
