Topics

Master web accessibility!

"We need S-level front-end and markup, and we even handle the UI for our MA tools, so accessibility should be a piece of cake!" That was the naive thinking behind Liberogic's web accessibility project, but in reality, it was the beginning of a fierce battle. Setting a high goal of full WCAG 2.2 compliance led to years of study sessions and endless discussions...and frankly, I realized how lightly we had taken it.

I remember an accessibility study session held at the beginning of the project a few years ago.
"What is the difference between WCAG and JIS X 8341-3:2016?"
"WCAG2.0 and JIS X 8341-3:2016 are the same!"
It was a long, long journey that began with such a basic exchange.
Is this understanding of the success criteria correct?
"No, that's the standard here."
After endless discussions and revisions, we finallyWCAG2.2 Conformance Level AAThis created a system that allowed us to aim for this.

Redesign your website!

"My website doesn't fit my business?"
The renewal of our company website began with that one word.
"If you're going to do it, you might as well focus on accessibility and SEO!"
Needless to say, our talented staff, who were probably busy at the time, were happy to take on this challenge.

"This color has a bad contrast ratio!"
"Well, it's a good design..."
"Can't you make adjustments within the rules?"
We continued to experiment, balancing design and accessibility.
During markup, I calmly completed the daunting test item checklist.

Finally completed!
Although it was significantly behind schedule, we felt that the technological advances were a sure sign of progress.

Achieved a perfect score on Lighthouse! And also got a high rating on PageSpeed ​​Insights!

Our website, built with Astro + microCMS + Cloudflare, was sure to receive a high score on Lighthouse. Accessibility is, of course, excellent!Lighthouse accessibility testing leverages the trusted axe-coreTherefore, efforts to comply with WCAG are evaluated fairly directly.

As for performance, we were running a lot of images and various other things, so at first we struggled a little, but after some hard work and fine-tuning, such as optimizing how web fonts were loaded, reviewing the image compression rate and format, and adjusting the resource loading priority, we finally saw the moment when it worked!

＼ 100 points! ／

I got perfect scores in all categories for the PC version of Lighthouse! And the rumor was true. "Oh! So if I get a perfect score in Lighthouse, Google will launch fireworks in celebration!"

"Seriously?! On the previous site I could barely get a score in the 80-90 range? I'm sure Astro has a lot to do with it, but this is amazing!"

PageSpeed ​​Insights, another website performance measurement tool provided by Google, also scored 100 points.

However, PageSpeed ​​Insights doesn't have any special effects (fireworks). Since I've had a string of results like 99 here and 100 there, I hope Google will add some kind of celebratory effect. 🎇

By the way,Lighthouse and PageSpeed ​​Insights scores vary depending on the network environment, server status, browser status, etc. at the time the measurement is performed.Even if you achieve 100 points, be careful as you may not be able to maintain that score all the time.

Is it impossible to get 100 points on mobile?... It's like this. (↑I didn't take a screenshot at the time, so I took a screenshot fairly recently.)

The true goal lies beyond the score

"But isn't this a natural result from the user's perspective?"

Rather than pursuing a high score, we focused on designing the website for all those who actually use it, which is what led to the highest rating. A score of 100 is merely a milestone. The true goal is to create a website that is comfortable and easy to use for everyone!!

Currently, we are implementing various experimental features to confirm the feasibility of our business, and our Lighthouse score has fluctuated lower than it was back then. I innocently keep shouting "Why, why?", but it goes without saying that confirming the feasibility of our business is more important to everyone than my selfishness.

And so our relentless exploration continues.