Add Semantic Styling to the Current Page of a Navigation Item with aria-current
In this lesson, we are going to use aria-current to give a screen reader user more context about what the current page is. Historically, many developers use an
.active class to indicate that the page in a menu is the same that you're on.
Instead of using a class, we are going to use the aria-current attribute to add more semantic value to the HTML and use that attribute to style the active link.
Note: VoiceOver testing works best on the Native Safari Browser, hence why we should always use Safari to test.