@gmagnenat
Posted
Hi, congrats on completing the challenge ! It looks great.
I can suggest a few things to improve the user experience specially for keyboard only users.
- You used divs and buttons for the tip options. When I select an option and press tab, I have to tab on all options again. It would be great to go straight to the next input. By using radio buttons instead you can have this by default... a bit more tricky to style.
- You can add validation for the other inputs. If no amount is entered. If a tip isn't selected.
- You can use the <output> element to have the calculated value announced to screen readers when updated. Or use an aria-live element where you announce the calculated values.
- I see that some text are set in pixels. Some user increase the system font size. using pixel will give them a bad experience as these elements cannot scale with user preferences.
I hope you'll find something useful in these comments to improve your solution even more.
Happy coding 🎉 !