Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Joshua Graber
11,785 PointsWhat are the implications for accessibility of using pseudo-elements?
If the pseudo-elements aren't added to the HTML, can screen readers apprehend them? If not, is it responsible to use them for anything text-based? Decorative elements are one thing, but adding text with pseudo-elements seems like it might be asking for trouble.
2 Answers
Anwar Montasir
Treehouse TeacherHi Joshua,
This is a really excellent question, and you're correct. Writing semantic markup means making sure your HTML is only for content and your CSS is only for appearance.
I discuss this in a newer Treehouse video, Adding Content Using CSS in a course called Enhancing Design With CSS.
If you're adding something purely decorative, then the screen reader doesn't need to know about it, and it's ok to use the :before or :after pseudo-elements to enhance your layout.
However, I agree with you that adding text content using :before or :after is a bad idea, since pseudo-elements don't actually add content to the DOM and screen readers are likely to ignore it.
Anwar Montasir
Treehouse TeacherThanks, Joshua! The industry needs more developers with a strong accessibility foundation and a passion for getting it right. Keep up the good work :)
Joshua Graber
11,785 PointsJoshua Graber
11,785 PointsThanks, Anwar! I actually remember that, now that you mention it. You used the ::after class when we added the arrow to the header of the Tahoe page, and talked about accessibility concerns with the pseudo-classes then. Maybe it was in the back of my mind when I went through this video yesterday :)
I also took your accessibility course recently, and I am grateful for your passion and care for the topic, and for the comprehensive teacher's notes you provided. It helped me a great deal in having a strong basis in accessibility moving forward, as it's something that matters a great deal to me.