DEV Community

Cover image for Responsive websites that are not so responsive
Franco Scarpa
Franco Scarpa

Posted on

Responsive websites that are not so responsive

I embrace the fluidity of the web. People use all kinds of devices, from smartwatches to TVs. It’s almost impossible to provide the same, exact UX to all of them.

In this regard, I wonder what’s the best way to make a website really responsive. Most of the sites use a fixed-width body after a specific (break)point, with auto margins to center it horizontally. This image is a screenshot of a webpage seen on a 4K TV:

Alt Text

I find it to be a not so good philosophy when building truly responsive websites: why do I have to see a site in so an uncomfortable way when I see it on a TV, therefore viewing it from afar? Shouldn’t we build websites that scale well, in a way that lets them take advantage of all the screen’s space? Shouldn’t we use truly responsive typography and layouts? Of course, using fixed-width after a breakpoint we think is appropriate is a good way to give us more control, but again, I think this doesn’t embrace the responsive philosophy completely.

Discussion (4)

Collapse
alohci profile image
Nicholas Stimpson • Edited on

The trick in such cases is to manage the line lengths to a reasonable number of characters. If the site chooses a font size based on the screen width to achieve it, then it has the effect of disabling text zoom, which is an accessibility problem. So I suspect a better approach is to present content in a variable number of columns of text. But whether that works or not depends very much on the nature of the content being presented on the page.

Collapse
francoscarpa profile image
Franco Scarpa Author

Look at here. I use this approach on my personal website.

Collapse
alohci profile image
Nicholas Stimpson

Yes, that's a good idea. Will need to look into that more carefully.

Collapse
tutorialsmate profile image
TutorialsMate • Edited on

Is it responsive 👉 tutorialsmate.com
Can you please check it. I checked its responsiveness from different sites and I got it almost ok in every of their each resolution. However, there was no option to check it in 4k.