Building the most inaccessible site possible with a perfect Lighthouse score
posted on May 31., 2019
Disclaimer: This post is not about lighthouse, other testing tools perform similarly. It’s about us developers and our responsibility to not blindly rely on automatic testing.
Google’s built-in testing tool Lighthouse judges the accessibility of our websites with a score between 0 and 100. It’s laudable to try to get a high grading, but a score of 100 doesn’t mean that the site is perfectly accessible.
To prove that I carried out a little experiment.
It’s always nice to see when people post their Lighthouse scores on social media to highlight how well they’ve optimised their own or their client’s website. It shows that they care about the quality of what they build.
.lighthouse-test {
position: relative;
}
.lighthouse-test button {
position: absolute;
z-index: 111;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
max-height: 5.3rem;
}
.lighthouse-test img {
opacity: 0;
transition: opacity 0.3s;
}
.lighthouse-test .content__image-wrapper::before,
.lighthouse-test .content__image-wrapper::after {
display: none;
}
.lighthouse-test–finished button {
[...]