8 minutes reading time (1589 words)

Sustainable Web Development with Joomla! - Part 2

Sustainable Web Development Part II

In Sustainable Web Development with Joomla! - Part 1, we explored how Joomla enables sustainable web development by promoting energy efficiency, resource optimization, and eco-friendly practices. Key steps included selecting green hosting solutions, writing clean code, minimizing JavaScript, optimizing fonts, and leveraging Joomla's built-in functionality to reduce server load. Emphasis was also placed on user-friendly, accessible design to enhance performance and inclusivity.

Part 2 will focus on maintaining sustainability during a website’s operation, ensuring long-term environmental responsibility.

After the implementation

Having completed the “heaviest” tasks related to website development, the phase of optimization usually begins in order to make it faster, more secure and more friendly towards search engines and social media. This includes a series of critical actions that also have a clear impact on the energy efficiency of the website. Here are the most important of them:

Implement SEO correctly. Search Engine Optimization (SEO) may at first glance seem unrelated to the energy efficiency of a website, but if you think about it, in practice the goals of SEO are perfectly aligned with the goal of reducing energy consumption. When we optimize a website to improve its ranking in search engines, we are essentially helping people find the information they want faster and easier. When SEO is successful, it results in people spending less time online searching for information and visiting fewer pages that do not meet their needs. This means that less energy is consumed and the energy consumed is used to provide real value to the user. Joomla 5.X leads the way on that account as well, since it already has robust SEO capabilities, integrated and optimized from the go.

Use Caching! One of the most important elements that play a decisive role in the ultimate speed of a website is Caching. Especially for websites that operate with a Database such as Joomla, pages are created dynamically every time someone visits them. This can be very inefficient to the extent that it requires processing power from the server for each page view, increasing energy consumption. Cache significantly reduces the server's energy consumption and of course the difference in page loading times is significant. Joomla provides the cache functionality in a number of ways, and all you need to do is to read the documentation and implement the method that best serves your needs.

Use a CDN. It was mentioned earlier that it is very important for the website to be hosted on a server that is closer to the users. However, if this is not possible, e.g. if the website is aimed at users all over the world, then using a Content Delivery Network (CDN) is a great solution. CDN stores and then serves website files such as images from a network of data centers around the world. This means that in most cases, larger files will be loaded from a data center closer to the user’s location, reducing the distance the data travels each time a page is loaded. Once again, this improves energy efficiency and page load times.

Serve the website statically. Sometimes you may need to create a website that will not need to change frequently, such as a simple company profile. Other times, this website may have served its purpose after a while (e.g. a website for an event) or even been abandoned. In all these cases, it makes absolutely no sense to continue to operate a Database that dynamically serves the content of a website, since no changes are going to be made to it. It is energy-intensive and no longer serves any purpose. In this case, you can convert the website to static HTML, CSS and JS files, which load much faster because they do not need to request content from any database, they have it already integrated. This way, not only will the website load faster, but it will also be easier to manage it in case you want, for example, to transfer it to a more economical web hosting package (since it no longer requires the existence of a Database or other resources that may have been needed).

During Operation

Last but not least, some of the most important steps for energy efficiency of a website concern the daily operation of it. Nevertheless, as you will see, they essentially need to be taken seriously into account at every stage of its implementation.

Compress images! On most websites, images are by far the heaviest elements in terms of file size. The more images you use and the larger these image files are, the more data needs to be transferred and the more energy is consumed. Regardless of the application of image compression techniques that we will see next, whether you are a developer, a designer, or a content writer, you need to think very carefully about the use of images. Does the image you want to use really add value to the user? Does it communicate useful information (which would perhaps be more appropriate to communicate via text for better SEO) or is it purely decorative? Could the same impact be achieved if the image were smaller? Could you achieve the same result with a vector graphic (e.g. SVG) or even with some CSS styling instead of a photo? By asking yourself questions like these, you can review the appropriateness of using certain images and reduce their use, without of course compromising the user experience. This in turn will help reduce energy consumption. The same goes for videos, which weigh much more on a page and create a much higher load on the users' CPU, resulting in much higher energy consumption. 

How can you make the use of images more efficient?

  • Upload images to the dimensions you want instead of relying on CSS or Javascript to automatically adjust their size. This avoids loading images that are larger than the scale at which they will be displayed.
  • Use tools like TinyJPG or ShortPixel to compress image files without any visible loss of quality. Since I discovered these tools and saw the huge difference in file size that usually results, I no longer upload a photo without first going through them. In the long run, this has saved me on other levels as well, as if I had uploaded the images at their original size, I would now be consuming at least five times more disk space on web hosting than I currently need. So, the savings are manifold.
  • Use the most efficient file format for each image, such as WebP instead of JPG for content images or SVG instead of PNG for icons that are organic elements of the website. In addition to saving resources, it is also good for SEO! Also, there are Plugins for Joomla that can automatically convert JPG or PNG images to WEBP.
  • You could also implement lazy loading for images and videos to load them only when needed.

In all these ways, a significant reduction in image file sizes can be achieved, reducing energy consumption and improving loading times, without any noticeable disadvantages for website visitors.

Pay attention to the content! As mentioned above for both SEO and UX, writing has a big impact on the efficiency of the website, because it affects the time people spend on it and the experience they get from it. Sometimes we want people to spend a lot of time on a website, magnetizing their attention to our content. What we don’t want, however, is for people to waste their time with content that offers them little or no value. Surely this has happened to you enough times that (hopefully) you wouldn’t want to perpetuate it as a practice. Therefore, clear and effective content writing can help reduce wasted time on the internet and, by extension, reduce wasted energy. Not to mention that it’s also beneficial for search engine ranking.

Α more energy-efficient website is overall a better website

If you had the patience to read this far, you will surely have understood that most cases where energy is wasted are essentially due to technical omissions. Which means that a carefully designed website could already be more energy efficient from the start. And the best part is that almost any action we can take to help websites be more energy efficient will make them better in other ways as well, whether that’s better SEO, or faster speed, or a better user experience.

So, when aiming to reduce the carbon footprint of the internet, reducing energy waste by paying attention to all of those elements mentioned above is a great starting point. Of course, a website’s energy consumption can be difficult to measure accurately (although tools like Website Carbon can certainly help), but there are still many things we can do to eliminate waste and improve performance. Most of these actions are not inherently difficult, they just require attention to detail and careful thought in every aspect of designing, creating content, developing, and hosting a website. It is certainly worth the effort, however, since as it has become clear, a more energy-efficient website is also a better website overall.

The Road Ahead: Joomla and the Future of Sustainable Web Development

As Joomla continues to evolve, its community’s commitment to sustainability will be pivotal. Features like improved performance, energy-efficient hosting integrations, and eco-friendly design principles will keep Joomla at the forefront of sustainable web development.

By adopting these principles and leveraging Joomla’s capabilities, developers and businesses can contribute to a greener digital ecosystem. Sustainable web development is not just a choice – it’s a responsibility. Let’s embrace it with Joomla.

Some articles published on the Joomla Community Magazine represent the personal opinion or experience of the Author on the specific topic and might not be aligned to the official position of the Joomla Project

2
The February Issue
 

Comments

Already Registered? Login Here
No comments made yet. Be the first to submit a comment

By accepting you will be accessing a service provided by a third-party external to https://magazine.joomla.org/