It's easy to say stuff like this, but go try and implement it. It's really hard.
Zoom in on the [Touché!] button and there are artifacts between the rows that make up the corners.
[1] iPhone OS 16_7 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.6 Mobile/15E148 Safari/604.1But it's worth being clear that mixing such thing with flowing text and graphic is where things get hard. Html 1 had flowing text in the 90s and you can still do that.
Moreover, all this is related to overall user hostile designs. Organizations broadly don't want their pages to be neutral streams of information but want to control a user experience that nudges people this way and that and fixed are important to that.
It's not just a technical problem, but the social problem of how you get people to keep using that API, and not extending it, and not breaking it in favor of some different purpose (like ads)
Whatever API for web data you propose, I can tell you exactly what will happen to it:
1) Initial clients are geek-designed and geek-friendly, and render the data intelligently.
2) This API gets popular for not having all the cruft.
3) Some genius discovers they could add some cutesy visuals and effects if only the standard were extended, and targets the clients that handle these extensions.
4) Eventually, only those clients are cared about, and you can only make sense of the data with those clients and if you don't have disabilities.
If you want to make progress, figure out how to eliminate that dynamic.
Earlier threads on this point:
You get the same with some native UI designers. They kick and scream until you've got some custom widget that precisely apes the Photoshop layer effects. Then kick and scream again when they make changes that take non-zero time to rebuild with that custom widget.
The job of a UX designer on the web is to consider this kind of stuff and to build a design that's very reactive to evolving displays within the demographics and market segments that the client wants to support. If that's not happening, if the CSS people are just getting handed static designs and being told to figure it out -- the problem is not CSS or the developers, it's that the designers building those designs are not good at their jobs. And there are ways to make this easier: notably UX designers involving the CSS department in the design phase, and/or making a point to always lay out the contents of the page without styling in a hierarchical way before making decisions about how to present that content.
But a lot of programming is hard. It's hard for me to write maintainable Javascript that doesn't fall apart if a project goes over 100,000 lines of code. It's hard to document methods. It's hard for me to write code that does complicated things that can work on low-end machines. These are skills that programmers get better at over time with practice. Responsive design is the same; it's just another skill to learn.
Imagine trying to shoot a movie and having the cinematographer tell you that it's hard to frame everyone in the shot since they don't know exactly where the viewer will be looking, or the sound mixer telling you it's hard to balance dialog and sound effects so everyone is audible without it being noticeable that they're muting background audio. Or a recorder telling you that it's hard to master a pop song given that everyone has different speakers and sound profiles on their headphones. Imagine you're building a car and the designer tells you that it's hard to make sure the controls can be reached by people who are different heights and weights.
On one hand, yes it is; all of that stuff is very hard. On the other hand, yes, that is also the reason web UX designers and developers get paid money; because the job is hard and requires training and expertise, and designing a website interface requires more thought and intentionality and planning than is required to make a PDF.
Here you go:
main { display: flex; flex-direction: row; flex-wrap: wrap; }
..and set reasonable width/margin constraints on your primary content blocks.
Linear, scrollable flow on small/vertical displays, and a denser "grid" on large/horizontal displays.
It's literally 120 characters to make a website that flows on any (reasonable) screensize and adapts perfectly.
Modern webdev is just throwing frameworks at self-caused problems.
(I'm exagerrating of course. But most websites are just about showing text, maybe with some images every now and then (news sites, reddit, hackernews, google, come to mind). For those websites this is certainly true).
No it doesn't. It's this pointlessly narrow column in the middle of my screen surrounded by arces of whitespace. If I wanted narrow text I'd make my browser narrow. Looks like the result of some designer fucking around.