This test page looks at how we can use semantic HTML and ARIA to create a visual presentation of the user's progress through a multi-process task. This is a linear progression and one step must be completed before the next can be started.
This is essentially an ordered list, as it defines a hierarchy of items. For simplicity, I've added classes to represent completed and current steps.
This is starting to look like a progress bar. It carries the structure, so the screen reader user would know there are 5 items in the list. They should also know the item number they are focused on. They do not know if the step has been completed or is disabled.
ARIA has several states that are meant to be used on interactive elements. While they could surface important information about the state of progress, the following implementation should NOT be considered valid.
The ARIA Progress Bar lets the user know an action is occuring and the current progress. Most implementations are used on page loading and content change that may take some time and the user needs to know there is progress. Using this on a static progress bar may be confusing. This treats the list as a single element. Progress bars don't seem to be meant to be navigated, rather to be announced.
ARIA isn't a magical toolbox and the above solutions do not provide a great result. Perhaps going back to HTML and using some hidden content is a better solution.
See a similar test with an interactive progress bar: ARIA Progress Bar with Navigation.