All comments

• 

  P

  Grace• 27,950

  @grace-snow

  Submitted over 3 years ago

  For this challenge I used:

  • Screenreader only text
  • Pseudo-elements for background images and borders
  • The zwnj; method to make the stats list keep it's semantics even using Voiceover in Safari
  • Scss and BEM naming

  

  Profile card with pseudo backgrounds and accessible list

  7

  78

  42

  

  Jeffrey Lance• 60

  @JeffreyAllenLance

  Posted over 3 years ago

  Hey Grace!

  I just wanted to say this solution was so helpful for me as a new developer just to see how to approach a simple project with a mindset of accessibility, using semantically meaningful tags and modern styling solutions to aid screen readers. I really learned quite a bit just stepping through your code and deconstructing what each piece was doing and why. Thanks so much for sharing it!

  2

  This comment has received 1 replyShow