Должны ли обязательные индикаторы всегда быть красными и находиться на уровне меток в веб-формах?

да, цветовой контраст оранжевого никогда не будет достаточно хорошим на белом фоне, поэтому вам нужно изменить его на красный. Будьте осторожны, так как красный также не очень контрастный цвет, поэтому наименьшее значение для AA равно #EB0000, а для AAA — #B30000.

Он не должен быть красным, однако это вполне ожидаемое поведение, и многие специальные возможности связаны с тем, что пользователь ожидает увидеть, чтобы указать на ошибку. Если бы он был черным и имел значок / какой-то способ определить, что это ошибка, это тоже было бы хорошо.

Вам необходимо указать, что поле является обязательным внутри ярлыка. Это в первую очередь предназначено для пользователей программ чтения с экрана, поскольку программа чтения с экрана не «увидит» ваш значок в вашем вводе.

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

С учетом сказанного выше нет причин удалять звездочку в поле, она дает хорошую визуальную подсказку о том, что нужно заполнить. Просто убедитесь, что звездочка не может быть доступна через программу чтения с экрана (т.е. alt="" для изображения или aria-hidden, если оно стилизовано под текст или встроенный SVG. Вы также можете добавить role="presentation" для полноты картины. Если это SVG, вы также можете добавить tabindex="-1" и focusable="false", так как Internet Explorer сделает некоторые SVG доступными для фокусировки.)