Learn Accessibility by Building a Quiz - Step 45

Tell us what’s happening:

Hello! I have a solution to this step, but I wanted to ask a question. How are we expected to know the contrast ratio of the colors? So here it asks for a color with a contrast ratio of at least 7:1. How are we supposed to know which colors have that ratio? Thank you!

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36

Challenge: Learn Accessibility by Building a Quiz - Step 45

Link to the challenge:

if you want to measure exactly then you need a tool.
More on the whole topic here

So were we supposed to use that tool to answer the question? Because I still don’t understand how we were expected to answer the question otherwise.

that’s a good point because they are trying to teach accessibility but not really describing it much.
There’s also some inherit thinking bias in the exercise too. But all that aside,
I believe if you try something and it doesn’t work, the hints will re-direct.
(assuming that you have a base-knowledge of what color contrast means of course. Some people never studied art formally in school so they would have no clue)

Yeah I think that’s the problem with this question. Someone like me who doesn’t know anything about color contrast aside from its general definition would be stuck here. The hint unfortunately didn’t redirect, it just kept saying I need to add a color value. In any case, thank you for the clarification!

ah okay, when I tried it, i used blue then black and the hint told me to use a specific hex color
then just for fun i ignored the hint and used white and that worked

1 Like

Yeah I ended up using white too because I had no idea what else to do

(it makes a suggestion for a specific hex color in the hint area. Just posting this for ref)

1 Like

That’s so strange, my hint was completely different! Like I said, it said I needed to add a color property and that was legitimately it. It didn’t suggest anything else.

maybe it happens when you try a few times?

I did try it multiple times, but maybe it wasn’t enough. That’s ok though, at least I know for next time if a similar situation arises.

I’ve also had trouble with tools.
in another question it mentions that if you ‘inspect’ the element, you will see its size is bigger than you stated.

was only later, through much searching that I found out what ‘tools’ were.
( tho I still dont know how to see the size )

to bring up tools. right click on a webpage. go to the bottom of the menu it brings up, click on inspect (at the bottom)

you can also get it up on Microsoft edge by clicking on the 3 dots icon (top right), more tools, developer tools.

I gotta say. this was revolutionary for me when I found it…
XD I could understand what it said XD

I think part of the learning process is looking for answers through other sources, such as the community, search engines, other sites and books.

1 Like

Oh, definitely. I’ve had so many similar experiences. I spoke to a close friend who’s been coding for several years and he basically made the same point as you. That it’s all about research. And not just the learning process. You’re not really ever expected to memorize anything, you just have to understand it and be able to do it. He said coding is always all about researching and consulting various sources.

1 Like