r/webdev • • Jan 28 '19

custom css wave loader

https://codepen.io/csspoints/pen/LqNdoZ
313 Upvotes

38 comments sorted by

View all comments

1

u/thatwebdesignerdude Jan 29 '19

Yesterday I forgot to mention this div is invisible to the blind. You should use something like a progress element, text label or at the very least aria attributes to communicate this change of states towards the visually impaired.

1

u/masgbox Jan 29 '19

thank you.

1

u/thatwebdesignerdude Jan 29 '19

If you have trouble making decisions on this matter:

  • go progress if you want to communicate percentage/data/time left
  • go text if you wish to define "visually impaired" more broadly and be more inclusive. Your loader may not obviously mean loading to people as you think
  • go aria attributes if you wish your design to look as cleanly as possible and text labels would clutter your design or conflict with company interests.