We arrive at our last 3 chapters! In this edition, we will cover Accessibility, Eco-Friendliness, and some extra Optimization Tidbits. Let's dive right in!

Chapter 7 - Accessibility is not optional

What is accessibility really and why care?

From a purely definition standpoint Accessibility for the web is making websites so that those of us with disabilities (visible or invisible) can use them productively and easily.

Key principles of Web accessibility focus or revolve around being:

The reasons behind why Accessibility (A11y for short) is important for all is that it is not just about catering to users with disabilities, but more about creating a web experience that is inclusive for all. If done so, there are a ton of different benefits: all users will have an easier time with your website, they will enjoy a better user experience - this leads to less frustration, more time spent on your site, and all in all results in higher conversion. By including EVERYONE, you give yourself a better chance to increase your website reach: 100% of a pie is always better than 85%. There are also SEO benefits as well as fitting in with current or upcoming legislation(s).

While the legislation is slow to change, things are moving… For example, the European Accessibility Act (EAA) will require e-commerce websites to be accessible starting June 28, 2025 for any such business that has at least 10 employees and an annual turnover or balance sheet of at least 2 million euros… you can be sure that over time this threshold will be lowered and include more of the web to be accessible until hopefully one day no website will be uploaded or created that is anything but accessible…

———

Some pitfalls, myths or misconceptions not to fall prey to when it comes to Accessibility:

1. Using an Overlay system solves all accessibility issues.
2. Having an accessible website means my website will be ugly and boring.
3. Using automated testing to check off the accessibility requirement is enough.
4. Making a website accessible is expensive and really time consuming.
5. Having your website accessible only helps people with disabilities…
6. Once I have built my website and it’s accessible, I won’t have to deal with accessibility.

As you might have guessed it, all of the above statements are FALSE.

For #1, above, I recommend you read https://overlayfactsheet.com/, I think you will see after reading that resource that Overlays are probably not a good idea, are to be avoided and cause more issues than they solve.

For #2, #4, if accessibility is considered as an integral part of the website design or redesign from the beginning not only will it not anything additional but your website will be visually appealing and engaging while still meeting accessibility standards

For #3, automated testing tools can be helpful, but the better approach is the human approach - manual testing and human evaluation.

For #5, as I have stated higher up in this chapter - it benefits everyone.

For #6, probably one of the biggest misconceptions, sorry but while it is great that your site built to be accessible, now you have to continue doing things correctly as you add, change new content, sections or pages to your site. It is a continuous practice that ends only when you retire or shutdown the website.

~~~~~~~~~~

Chapter 8 - ECO-Friendliness for one PLANET

So you have spent a few weeks or months building your website - and it goes live - congratulations!

You are now part of the 120-140 million metric tons per year of CO2 contributed to the overall planet’s global CO2 emissions from all human activities.🥵

So, how about contributing to making sure the amount of energy and CO2 for your website is as small as possible… 

It is NOT just website hosting that plays a role in the direct and indirect environmental footprint of your website but also the website design and development of your website over time…

Following best practices in web design goes a long way toward the goals above:

• Optimizing website performance to reduce energy consumption and data transfer.
  
  
• Minimizing the use of energy-intensive features (i.e. excessive animations, misuse of image formats, high-resolution images, etc).
  
  
• Using sustainable coding practices: code optimization, minimizing unnecessary code, removing unneeded CSS, etc.

When it comes to website hosting, of course, choosing an eco-friendly website hosting provider is a good first start - one that uses renewable energy and/or offsets their carbon emissions but you also have to at least evaluate cloud-based hosting solutions which can reduce energy consumption by up to 93% and where you could see CO2 emissions reductions by as much as 60% compared to on-premises data centers.

If you want to do a bit more, you could also offset your website’s CO2 emissions through one of the many platforms that exist: Web Neutral Project, GreenPerk, CarbonClick and to calculate what your website’s emissions, you can use tools like: https://www.websitecarbon.com/, https://digitalbeacon.co/, https://ecograder.com/ and/or https://ecoping.earth/.

Since each of these calculators work slightly differently, I use them as an indicator not as an absolute.

Just like with accessibility, keeping your site as eco-friendly as possible is something that needs to be monitored and re-evaluated over time… Start today!

~~~~~~~~~~

Chapter 9: Useful optimization tidbits

If you have done everything in this series, you probably have reduced the size of your website and it should be purring along and loading quite a bit faster - better for users, and for the planet.

Thank you for your contribution to making the web a more accessible, inclusive, eco-friendly 
place…

If you want to go a bit further, here are a few extra tips:

1. Make sure your hosting is knowledgeable about Joomla 5 and that they have optimized the  server configuration: such as enabling HTTP/2 or HTTP/3 protocols etc…
   
   
2. Make non-critical Javascript load deferred or asynchronously.
   
   
3. Images that are below the fold or initial viewport could be lazy-loaded.
   
   
4. To reduce the overall size of the page, remove unused CSS and JavaScript.
   
   
5. Don’t forget to set appropriate caching headers to enable browser caching of static assets.
   
   
6. For dynamic content, make sure to implement server-side caching, such as database queries or API responses.
   
   
7. If you are loading FontAwesome on your website, make sure that only 1 copy is loading as often Page Builders, Frameworks or components will load their own copy.
   
   
8. Combine images using CSS sprites or use font icons vs loading individual image files.
   ( I could keep this going for a while but let’s finish on a lesser known trick…)
   
   
9. Have you thought of optimizing your font files? Did you know most font files (including icon ones such as FontAwesome contains hundreds, or thousands to tens of thousands of characters/symbols when your website typically uses a few dozens or hundreds) - the waste 😱… the result is you can save from 100kb to 400kb per page load 🚀 depending on how many fonts your website is loading etc… using tools like FontLab8… I regularly do just that for clients.

~~~~~~~~~~

Through this series, we have explored the essential elements of creating a Joomla 5 website that is not only high-performing but also accessible, sustainable, and optimized, optimized, optimized. By embracing the principles of accessibility, eco-friendliness, and a wealth of useful optimization tips, you are now equipped to take your website to new heights.

I hope that there was at least 1 tidbit of usefulness in this series for you or that it at least served as a good review...  and remember, it's not just about building it correctly now that you have embraced a holistic approach, it is about continuing with accessibility, content, optimization and SEO best practices.