Sure, I absolutely hear you. What I am trying to convey is that many designers see the opposite: if a website is ugly as hell what the hell good is it?

Aesthetics is always a controversial topic because people tend to think that it is purely subjective and there is no way to measure its quality like we do with performance or accessibility. But in reality it is a vast and quite difficult craft that requires far more knowledge and experience to pull it off than achieving the desired accessibility or performance metrics, yet anything visual feels like an afterthought when it comes to HTML.

Many designers consider a website as a visual and not a textual product. Sure, once the website is fully designed, all the visuals are perfectly polished and every little graphical detail is figured out it is easy to build it the way you demonstrated, even in a simple text editor. Unfortunately, this is rarely the case.

The problem is, designing a website is not the same as building it. Design requires many iterations (things like move this a little bit here, align things there, try this with a different grid, different layout, etc...) and HTML is extremely rigid for this process. Every single client on this planet will modify the design several times and it is just not feasible to do each round the way you showed. It is inevitable that people will try to go around this issue and find something, anything that might help in this regard.

I don't think that what the frameworks are doing is helpful, and I don't think that form should go before function. However, I do think that function shouldn't go before form either.

And I also think that if achieving the desired aesthetics was easier on the web in general, developers would have more time and resources to focus on achieving proper accessibility and performance.