This isn’t true. Semantic HTML is also very important, often more so.

> Unless you're doing SEO, everything semantic is just a distraction.

This is also not true. Besides actively harming accessibility (or making it substantially more difficult to improve), non-semantic HTML also breaks Reader Mode. And it can also add cognitive burden to maintenance and future feature work.

Gizmodo articles should load in Reader mode but don't, I assume they're doing that intentionally.

Accessibility and SEO are (usually) desirable system effects that rely on meaningful semantic code-inputs to the system.

But that doesn't mean that only software system effects matter, and everything else is a distraction.

Consider that when you're programming your various identifiers -- the names of variables, functions, classes, types that you choose -- are largely without any semantics to your system. To the computer, they're simply keys. And yet we sometimes say that one of two the hard/important problems in computer science (besides cache invalidation) is naming things. Why?

Because the actual system isn't just the software & machine. The system includes the developers groking and shaping the software. And names and their relationship with domain concepts matter to people and help them manage their work.

I've found that the first benefit to semantic markup -- not necessarily the most important, but the first -- is helping me better conceptualize the domain and my code. It functions as an orientation anchor when I'm working with components that look different between their source and rendered as part of a sprawling document in the browser. And it helps me get reoriented faster when I've been away from it for days/weeks/months.

The heart of "semantic" anything is the idea that code is for people too. Maybe not all people, but definitely at least anyone who's writing it.

Best practice is use to use HTML semantic tags and only add ARIA attributes if it is relevant. For example, HTML5 has a <nav> tag, therefore it is not necessary to add the ARIA attribute "role=navigation". Even the Accessibility section on MDN (Mozilla Developer Network) states: "developers should prefer using the correct semantic HTML element over using ARIA if such an element exists" (Source: https://developer.mozilla.org/en-US/docs/Web/Accessibility/A...)

> "The problem faced by semantic tags is...the information that they carry is of very limited use for a screen reader."

That's precisely why those semantic HTML tags are important - so that screen readers navigate the page more easily (among other reasons).

> "...semantic is just a distraction"

Accessibility is not difficult if you follow HTML5 semantic markup. Compared to CSS, HTML5 semantic tags are easy. If you use HTML5 semantic tags, accessibility comes built-in - you get it for free.

Where accessibility fails is when you're using a JavasScript framework that generates non-semantic markup. Or you're using a CSS framework and your HTML markup is littered with endless <divs> rather than HTML semantic tags.

I recently posted this video playlist of quick accessibility tips for websites (each tip is just 1 minute). Many websites don't follow these best practices. However, I think people might be surprised by how simple and low-effort it is to incorporate these tips into any website.

Quick accessibility tests: https://www.youtube.com/playlist?list=PLTqm2yVMMUKWTr9XWdW5h...

Why can accessibility not be justified by profits? If you sell something, lack of accessibility will cause you to lose sales. How much you will lose depends on the demographics of the potential customers.