Does it matter if the code looks ugly or not? End users are not going to see the UI. If i have an AI in my toolbox that autoconverts designs to Code, within a minute. It would speed up my development time by a lot!
It matters because ugly code is probably also slow code (consider loading of unnecessary resources, and consider an excessively complex DOM). And probably also a page lacking accessibility.
> It matters because ugly code is probably also slow code
This is a very bad assumption, that's highly dependent on subjective and overly-broad terms like "ugly" and "slow".
Optimized assembly code is ugly, but it's also probably faster than what a human would choose to write.
Linguists used to have this human-understandably-sized set of speech units called phonemes. Once we abandoned those for finer-grained pieces that were too many and complicated for a human to grasp, speech recognition got better.
Understandable by a human may be a fundamental limitation on the power of our models.
Actually, I ran both through voiceover on the mac and they fared decently well.
The first example only had a slight issue that you couldn't get to any text to describe the images. Only because the alt tags are empty.
The second example, the bootstrap one, was ok as well. Except for the usual odd ul inside a nav example. Well, I find it odd. Voiceover sees that as a group nested inside a group. Just a nav with children works just fine. For instance, if I remove the ul and change the list items to divs then voiceover is much clearer of what's going on.
But the thing is, screen readers would love something like this. Simply because screenreaders love very basic and simple html. This thing generates very basic and simple html. Accessibility gets challenging when start considering a more modern single page app type of website.
