overuse of aria-label on Dashboard

[VlastiBroucek]

DESCRIPTION

aria-label should be used only behind symbols, not readable texts. Using it in places where there is a visible text is discouraged due to possibility of confusing screen readers and other assistive technologies.

It seems to be used correctly, although not consistently on other pages - e.g. pencil indicating editable item does not have aria-label.

REQUESTED INFORMATION

Make sure your have performed every step and checked the applicable boxes before submitting your issue. Thank you!

• Searched the issue in issues
• Searched the issue in discussions
• Searched the issue in the docs
• Searched the issue in the chat
• Provide the System information in the area below, taken from http://<IP>/api/system

  Paste System information here....

TO REPRODUCE

Just hover over the text.

EXPECTED BEHAVIOUR

If used, it should be used consistently and according to guidelines (https://www.w3.org/WAI/standards-guidelines/aria/)

SCREENSHOTS

If applicable, add screenshots to help explain your issue.

ADDITIONAL CONTEXT

Add any other context about the issue here.

(Please remember to close the issue when it has been addressed)

[proddy]

I removed a lot of the aria-labels as it takes up a huge amount of flash and we're close to 90% full on older ESP32s. Have you noticed anything unusual in the UI that's a result of this?

[VlastiBroucek]

No, I have not noticed any real issues - TBH, I have actually noticed those labels just recently.

But wearing my old hat (I was part of the team that built software for serving MOOCs - none of the commercial products could handle our 30K+ participants in a course) I remembered we have been flogged for both not using them and overusing (basically using incorrectly) them by accessibility freaks and sometimes by participants who were using screen readers. Basically, in cases like the dashboard, the reader would read the value twice, making it rather confusing.

I guess there is a little chance of people with vision problems using ems-esp, so getting rid of those arias should not hurt that much...

[proddy]

ok, I'll do a clean sweep through the webcode and see how much extra code would be generated,

[proddy]

I looked into this and found that MUI automatically adds the aria-label to most components, but not all. Noticeable IconButtons (as in the pencil example you gave) and TextFields that don't have a visible label (e.g. search). I'll add these to the next dev-25

[VlastiBroucek]

But it would be good to remove them from plain texts as in the picture in OP. They should not be there...

[proddy]

But it would be good to remove them from plain texts as in the picture in OP. They should not be there...

not sure i understand, can you give an example? what is OP? Do you mean the tool tips? or the text in the table. If I run the browser DevTools->Lighthouse->Accessability it looks ok with a score of 94% in the dashboard page