Heavy, heavy disagree. Tiny example, but just because it's on my mind that I need to rewrite it soon: https://danshumway.com/resume.
This is almost per-pixel identical to the resume layout that I used to have laid out in a normal editor exclusively for PDF and print, but without making a single concession with my normal print layout, it also seamlessly collapses into single columns perfectly fine on mobile devices, doesn't require Javascript, and the entire layout is ~160 lines of CSS.
And to be clear, this is bad CSS. This is not CSS I'm proud of, this is CSS I wrote ages ago that I'm going to be tackling very differently whenever I get around to rewriting the resume. But it's still perfectly reasonable to have document layouts that feel like normal print layouts that collapse down well on mobile devices.
And sure, this is a trivial example, but I think the same principles scale up. I don't believe that applications are different. Most application UIs can be represented as trees, and trees are well-suited for multiple-column layouts and collapsing rules based on width. That many sites work on mobile and don't scale up is a result of developers designing primarily for small screens and not thinking about large screens at all.
Even here, this resume should handle wider screens better, it doesn't take enough advantage of available width. But the other thing about the web compared to native is that with native toolkits if a developer designs for mobile and then doesn't think about desktop, the app just doesn't work on desktop at all and you can't use it.
On the web, if a developer designs for mobile and doesn't think about desktop, at least the interface is still usable on desktop. And vice-versa: there are desktop interfaces on the web that are miserable on mobile devices. But they work. None of the alternatives that people are proposing have that advantage.
I don't really see how this disagrees with me at all. Yeah, you can make a layout what "works" on all sizes, I said that. For something trivial it can even be great on all sizes.
But a more complex website like let's say amazon.com is much better with thought-out styling for different widths.
> is much better with thought-out styling for different widths.
When people talk about responsive design, we don't mean that you shouldn't be thinking about styling for different widths. We mean that what you come up with is a singular design that responds to changes in screen size and font size, whether that's using breakpoints, wrapping, hiding and showing elements, or a combination of all of these things -- as opposed to building a completely separate interface that the user can only access through a separate URL or application (if it's even available on their device in the first place).
Yeah, you'll get bad interfaces if you only think about one screen size, but responsive design is explicitly about not only thinking about one screen size.
Amazon is maybe a bad example here; their site doesn't implement great responsive design as far as I can tell. Scale down a window too far on Desktop and the site just throws a horizontal scrollbar at you. This is despite the fact that Amazon absolutely could collapse down into a single-column view. I disagree that Amazon's interface is so complicated that it needs a full browser width, it's a vertical list of horizontally floating elements, it's a great candidate for wrapping listings and for collapsing down the menus based on a breakpoint.
But I'm left sort of feeling like we're talking past each other. I agree that you should think about multiple sizes. I don't see what that has to do with whether or not CSS is well-suited for building interfaces, I would argue that CSS makes it easier to think about multiple screen sizes when building interfaces. I think that's CSS's strength as opposed to static layout tools that lack the expressiveness to describe what you want to happen when a column gets too narrow or to set things like margins based on text size instead of pixels or on and on. Those tools are all really useful when building interfaces that actually adapt to different settings/resolutions.
This is almost per-pixel identical to the resume layout that I used to have laid out in a normal editor exclusively for PDF and print, but without making a single concession with my normal print layout, it also seamlessly collapses into single columns perfectly fine on mobile devices, doesn't require Javascript, and the entire layout is ~160 lines of CSS.
And to be clear, this is bad CSS. This is not CSS I'm proud of, this is CSS I wrote ages ago that I'm going to be tackling very differently whenever I get around to rewriting the resume. But it's still perfectly reasonable to have document layouts that feel like normal print layouts that collapse down well on mobile devices.
And sure, this is a trivial example, but I think the same principles scale up. I don't believe that applications are different. Most application UIs can be represented as trees, and trees are well-suited for multiple-column layouts and collapsing rules based on width. That many sites work on mobile and don't scale up is a result of developers designing primarily for small screens and not thinking about large screens at all.
Even here, this resume should handle wider screens better, it doesn't take enough advantage of available width. But the other thing about the web compared to native is that with native toolkits if a developer designs for mobile and then doesn't think about desktop, the app just doesn't work on desktop at all and you can't use it.
On the web, if a developer designs for mobile and doesn't think about desktop, at least the interface is still usable on desktop. And vice-versa: there are desktop interfaces on the web that are miserable on mobile devices. But they work. None of the alternatives that people are proposing have that advantage.