В настоящее время я пытаюсь придумать хороший и доступный способ форматирования индикатора состояния, который должен отображаться в наборе страниц, подобных мастеру, на веб-сайте. Веб-сайт должен предоставлять многостраничную форму с индикатором состояния поверх нее, как показано на каркасе ниже:

Учитывая новый тег progress в HTML, моей первой мыслью было сделать что-то вроде этого:

    

        
Beginning
        
Right now
        
End
    

... но поскольку принимает только фразовое содержимое с использованием списка, это не вариант. Так что прямо сейчас я, вероятно, выбрал бы что-то вроде этого, интегрировав ARIA progressbar -role:

    
Beginning
    
Right now
    
End

Но опять же, я не совсем уверен, можно ли применить роль progressbar таким образом к список.

Другая проблема заключается в том, что отображается как индикатор выполнения в Opera, например, поэтому> progress> сам по себе, вероятно, вообще не является жизнеспособным решением: - (

Кто-нибудь, возможно, порекомендует доступную строку состояния, которая не полагается только на использование одного изображения?

Текущее решение

На данный момент я использую следующую разметку:

    
Your current progress
    

        
Completed step: Login
        
Current step: Right now
        
Future step: End
    

Все элементы класса «поддерживающий» будут размещены за пределами экрана . ИМО, таким образом у нас должен быть хороший компромисс семантической разметки (последовательность состояний, на мой взгляд, действительно упорядоченный список ;-)) и доступности благодаря дополнительному заголовку и тексту состояния для каждого шага.