Allow defining of semantic components

Description

If this tool allowed for the assigning of semantic components, it would help expedite development. For example, defining if a call to action is <a> link or a <button>. Should a set of mutually exclusive options be written as buttons or radio inputs?

Why

Developers are often left to choose semantics of controls. This is problematic because for people using assistive technology, the code is the UX.

This is important because designers should be designing the user experience for everyone.

We would use this to define which of our design system components to use.

This would serve to expedite development by reducing the decision making about UX placed on developers.

Possible Implementation & Open Questions

A tag to allow semantic html annotations, especially for form controls:

Web

• Radio inputs
• Checkbox
• Button
• Link
• Select
• Fieldset/legend
• etc

Native

• Button
• Link
• Picker
• Segmented control
• Switch
• etc

Is this something you're interested in working on?

I'd be happy to work with others to help make this feature available.

Thank you!
Charlie Triplett
Sr Accessibility Manager, T-Mobile