Every element has a function or hierarchy in the document. The ‘semantic’ association helps define that role. This is useful for technologies that rely on something else than the visual output of the document, for instance, screen readers.
As an example, a heading might contain the content: “A brief summary”. Without a semantic role, this does not convey the hierarchical position of that element within the document. Using the correct tag (in this case, `h{1|2…}` does provide this extra information and helps provide structure to the document.
I suspect tag names are not the right place for screen readers to be getting that information.
The web isnt hypertext any more, it's hypogui. If we defined a "WebGUI Markup Language" it could be a requirement that all UI elements have semantic attributes, etc.,
eg.,
<Text type="heading" purpose="page title"> My Web Page </Text>
It just seems we're hobbled by this 1992 idea that the web is wikipedia, and our markup languages should be foremost about how text documents are described.
Every element has _implied_ semantic attributes, which can be extended/overridden by using the `role` and some `aria-` attributes.
For instance, the `<button>` element has a default `role` of `button`, to indicate that it is a button, that can be clicked, and will perform an action when that is done. The role can be changed, for instance to `link`, to indicate that it now functions as a link. Similarly, a paragraph tag (`<p>`) can be assigned a role of `button`.
It’s very easy to abuse this, but it also means the underlying markup is a lot clearer, IMO. This may not be true to people who are not used to or don’t know about the semantic side of HTML, but herein lies a lot of the associated knowledge of that syntax, often unfortunately overlooked, sometimes leading to HTML being derided as a “beginner’s language”. There is a huge amount of knowledge around HTML.
I think there is a bias here because a lot of us (myself included) prefer text with markup for a lot of things.
Most of my usage of the web is served better by text with markup than a (front end) application platform and every site having masses of JS makes things worse (I have JS off by default and turn it on when sites refuse to work with JS and fail with reader view).
As an example, a heading might contain the content: “A brief summary”. Without a semantic role, this does not convey the hierarchical position of that element within the document. Using the correct tag (in this case, `h{1|2…}` does provide this extra information and helps provide structure to the document.