Is "responsive" the new buzzword for "things that change when you resize them"? I've been seeing it used an awful lot in web design as of the past few years, often rather vaguely as some sort of feature.
It responds well to being resized (e.g. to fit on a mobile phone screen instead of a large monitor). Although, I think it is normally used to mean considerably more than the simple scaling being done here (e.g. I've seen designs where the text goes from two columns to one if the display is narrow).
http://en.wikipedia.org/wiki/Responsive_web_design
It's astonishing how much "responsive design" gets thrown around as a buzzword...however, unlike a lot of buzzwords, "responsive design" actually means something
Unfortunately, it is one of those technical terms that is now so widely misused by people who don't know what it originally meant that it is becoming diluted to the point of uselessness. The original principles of responsive design as outlined by Marcotte are one, but only one, useful set of tools for adapting web sites/apps to support users with different devices.
These days, any web site whose CSS says @media somewhere is getting described as "responsive", which makes it difficult to have intelligent conversations about alternative strategies, such as those that don't use flexible grids or techniques for adapting media other than static images to different viewing/listening situations.
> One part of a solution to this problem is to use relative CSS units. Avoid hard breakpoints whenever possible.
This is what "responsive design" used to mean. I remember being quite confused when people started using it to refer to distinct, non-responsive mobile-vs-desktop views.
Anyone else still confused by the word "responsive"? I always expect something with a high degree of interaction, widgets etc., instead of just meaning "resizes how HTML should resize".
"Do responsive things. I didn't spend most of my early career convincing clients to let us do a responsive website just for you to serve me up a boring layout that kicks down to your mobile layout as soon as you are less than 1200px."
Can anyone elaborate on this? I feel like I'm missing some context because a desktop layout that kicks down to a mobile layout at a breakpoint sounds like the essence of doing responsive things.
Obviously there are a ton of other aspects of responsiveness, but specifically calling out the layout change makes me think I misunderstood something.
This reads like someone's justification for their own lack-of-talent with media queries and CSS, or their laziness toward creating an optimized experience for all users.
"Responsive" is a trendy buzzword thing for what solid digital designers have been doing ever since Netscape 0.9b tossed alignment into the image tag (among other things)... paying attention to how a design looks on multiple screens. We just have more screens and means by which to optimize for those screens now.
And I'm really not sold on "mobile first" either -- feels like another short-lived trendy buzzword thing. Scaling a mobile design concept up to the desktop is shorting your 1024w and up users. Designers who care think about all screens at a design's inception... then plan the CSS accordingly.
No. Unfortunately, the author clearly doesn't get that. Responsive means that it is able to present an appropriate experience to different devices. Full width for this widget is not appropriate on a large screen.
Responsive design sounds like a glorified switch clause: instead of making good fluid design which scales you essentialy fork your webpage design into multiple versions, and swap between them based on screen size. Seems like a bad idea to me.
> This is what "responsive design" used to mean. I remember being quite confused when people started using it to refer to distinct, non-responsive mobile-vs-desktop views.
I agree this is confusing, but I think we still need a term for distinct types of views. The point of the article is that, once a user has started using one particular view, it shouldn't suddenly change to a completely different view with a different layout just because the user's browser window got resized by a few pixels.
I don't think it's possible for an app to auto-detect which view the user wants to use, particularly not if the auto-detection logic allows changing views on the fly in the middle of a user session based on resizing the browser window. I think the only real solution is to have different views that each have their own distinct URL, so the user can choose which view to use. Each view can then be "responsive" within the general constraints of the layout it adopts.
"Responsive" is pretty factual - something either is or it isn't responsive.
But unfortunately the original meaning of "responsive" as Marcotte coined the term has been diluted by people who apply the term to any site that uses media queries to change its layout on a mobile device. There is more to responsive web design than media queries, and there are plenty of ways to use media queries to adapt a site to different devices that aren't responsive web design.
It's astonishing how much "responsive design" gets thrown around as a buzzword...however, unlike a lot of buzzwords, "responsive design" actually means something and implementing it has implications systemwide...Across legacy sites, I've almost never seen it implemented in a way that didn't hide critical information, often because the designers and the people in charge of the legacy CMS probably don't coordinate enough. Things like, "Make everything that isn't in a p or image tag go to the bottom of the page" can hugely affect the context of certain elements.
For example, I worked on a site that hand hand-coded captions for photos and so those captions ended up having tags that were displayed:none when the device had a low-enough width. That's not great for photos that require the context of the captions.
It's possible but in the context of web design “responsive” has had a specialized meaning for many years, going back to a very influential article in 2010 which grouped older practices under that term:
Responsive is a technical term that means it adapts to multiple screen sizes.
In a nutshell, it just means the website works on mobile and works well.
It's technical jargon, sure. But it means something important to web designers/creators. I'd run away from a web framework in 2020 that wasn't responsive.
Not just change, but remove flourishes and not entirely necessary elements.
> I've been seeing it used an awful lot in web design as of the past few years, often rather vaguely as some sort of feature.
It's a feature for cross-device compatibility, the point being to alter visible content to fit multiple device sizes.
reply