How to Solve a Rubik's Cube - Feedback please

I submitted this as the Technical Documentation project for the Responsive Web Design course: https://codepen.io/igorgetmeabrain/full/MWjJEOy

Please let me know what you think of it. Note the use of the media query to change the page layout for portrait mode.

Thanks!

Hey @igorgetmeabrain, I can tell you put a lot of work into this and I appreciate that, but to be honest, I’m having a hard time reading most of the content. The rubik’s cube pattern is just too distracting and the black text over it is very hard to see. There are a few places where you have used opacity to soften the background image, which does help, but I’m not sure it is enough. I think a lot of people who have poor eyesight or reading disabilities (or other cognitive disabilities) will have a very hard time reading your content.

I’m not trying to be a killjoy here and tell you to get rid of it completely, I think you just need to not use it as the background for text. Perhaps use it as a divider between the sections?

Also, you have other color contrast issues, such as the blue text on black in the side menu. You can use the WebAIM color contrast checker to make sure your contrast ratios meet accessibility standards.

2 Likes

Thanks for the advice - it’s much appreciated. I’m really not good at the design side of things. I’ll try tweaking to improve accessibility. Thanks!

I used a contrast checker and tweaked a few other things too… better now? Any other improvements to code or design anyone can recommend?

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.