Thank you for letting me know your response! It took quite a bit to write this article while I was worried that no one would read such a long article with too much detail. Your comment taught me some people do appreciate my writing style.
Thickening the stroke for the focus state makes the button, uh, ugly... It won't look like a cloud anymore once a thick outline is added.
The difficulty stems from the button's background color being white. If it's gray, then I can change the shadow from black-ish to white-ish, which should be noticeable to the color-blind. For the dark mode (to be written about in a future article), the button will be gray, just like clouds in the night sky. So flipping the shadow from very dark to very bright works. But for the light mode, and because the button should look like a cloud, it's difficult...
I know accessibility shouldn't be compromised because of too much emphasis on aesthetics. But I don't want to give up too quickly. Let's see if I can come up with a good idea...
Accessibility First DevRel. I focus on ensuring content created, events held and company assets are as accessible as possible, for as many people as possible.
Remember that a white shadow will have terrible contrast with the surroundings if you are over say a white roofed house.
Instead of a shadow try the offset focus ring I suggested with a white strip and a black strip that follows the shape of the cloud so it will have contrast on any background, that should look aesthetically pleasing.
Either way I look forward to seeing what you decide to do…oh and
I know accessibility shouldn't be compromised because of too much emphasis on aesthetics.
Neither should aesthetics be compromised for accessibility, that is where the fun part is, making it accessible and pretty! ❤️
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Thank you for letting me know your response! It took quite a bit to write this article while I was worried that no one would read such a long article with too much detail. Your comment taught me some people do appreciate my writing style.
Thickening the stroke for the focus state makes the button, uh, ugly... It won't look like a cloud anymore once a thick outline is added.
The difficulty stems from the button's background color being white. If it's gray, then I can change the shadow from black-ish to white-ish, which should be noticeable to the color-blind. For the dark mode (to be written about in a future article), the button will be gray, just like clouds in the night sky. So flipping the shadow from very dark to very bright works. But for the light mode, and because the button should look like a cloud, it's difficult...
I know accessibility shouldn't be compromised because of too much emphasis on aesthetics. But I don't want to give up too quickly. Let's see if I can come up with a good idea...
Remember that a white shadow will have terrible contrast with the surroundings if you are over say a white roofed house.
Instead of a shadow try the offset focus ring I suggested with a white strip and a black strip that follows the shape of the cloud so it will have contrast on any background, that should look aesthetically pleasing.
Either way I look forward to seeing what you decide to do…oh and
Neither should aesthetics be compromised for accessibility, that is where the fun part is, making it accessible and pretty! ❤️