I would like to learn responsive web design, and I was poking around Barnes & Noble.com and Amazon.com and neither of those websites appear to be responsive.
Is that possible? Did I do something wrong when I re=sized my browser window?
It would be shocking to think that two major online book sellers wouldn’t use the more modern approach of responsive design.
Did you try using Google’s Mobile Friendly Test
I don’t see how Google cn consider those two websites to be mobile friendly because when I adjusted my browser window to a smaller size like you’d get on a smartphone, the websites did not adjust.
Perhaps JavaScript or server side PHP detects the initial screen size and includes matching CSS.
Starting with a desktop and not a mobile will have incorrect JavaScript or CSS files loaded when the viewport is reduced.
Google wants to test it the site is Mobile friendly so it starts with a mobile.
Is that acceptable? I thought that true responsive design would adapt as the screen size changes?
I am looking at this page now…
If I adjust my browser width, I get this…
That doesn’t look very “responsive” to me…
FWIW Facebook isn’t responsive either 
If you start with Chrome resized, and reload the page (even in incognito mode), Amazon.com still doesn’t look mobile friendly. But it is.
Like @John_Betong said, use the mobile friendly test to see what the site will really look like on a mobile device. Also, in Chrome, you can toggle between a mobile view of the site and the desktop view. Use “Toggle device toolbar” in the Chrome dev console.
Explain. How can something be “mobile-friendly” if you can read it without having to scroll right?
I don’t follow you. When I ran that test I just got a message that it passed. It didn’t show me what it looked like.
I am using Firefox and actually don’t have Chrome loaded on this machine.
Here’s a look at Amazon.com in Chrome when I toggled the device toolbar:
Can I do something similar in Firefox?
Since you mentioned that you are interested in learning responsive design then try this in different browsers:
<?php
echo $_SERVER ['HTTP_USER_AGENT'] ;
// DEBUG
// echo '<pre>';
// print_r($_SERVER);
// echo '</pre>';
die;
Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:69.0) Gecko/20100101 Firefox/69.0
The above value can be used Server side to guess the viewport type and include the relevant files.
The other responsive layout method is to use a common CSS and possibly JavaScript files for every possible viewport type - and there are now lots with the number increasing on a daily basis.
Yes you can. 
http://amazon.com/ - in the address bar.
coothead
How reliable is that? And can it be “spoofed”?
When I studied responsive design in the past, you coded your web page to work on some default system (e.g. desktop) and then you had media queries to make things adjust as various points. You did not design for every device, but rather made sure things were readable at various screen widths.
Has that changed?
And apparently Amazon’s website trying to be “smart” isn’t such a good idea, because if i am on my computer and need to resize the window for whatever reason, or if I have Javascript turned off, or I am doing development and just want to see how things “respond” at various screen sizes, then Amazon’s Javascript won’t let me do that. That is a bad idea!
Hey, that’s pretty neat! And it does appear that Amazon’s page responds in FF to different screen sizes.
Hmmm…
From memory it can be spoofed, perhaps try searching and let us know 
The internet is far from set in stone and no likely has changed.
If it does not look right then you can always revert the changes.
Hi there UpstateLeafPeeper,
I do not know why the two sites to which you linked in
your original post needed the method that I proposed. 
Normally, reducing the page width, as you did, would
give the desired results.
coothead
It must be as @John_Betong said, and the Javascript is being bossy and taking over and thinking a little too much!
Oh well, I’m not ready for responsive design yet,but the whole reason for this thread was just to keep my eye on the future.
Hi there UpstateLeafPeeper,
this simpler method also works for Firefox…
http://amazon.com/ in Firefox.coothead
I’m playing around with that tool in Firefox, and sometimes Amazon’s page loads correctly, but like now I choose an iPad and it is broken again!
I was looking at Amazon’s code last night in the developer tool, and their code is a fubar - which is not surprising.
So if I want a good example of a proper responsive website, Amazon is probably not a good first choice!
I think a lot of these “big names” on the internet still use a separate “mobile version” of their site. To see that you would have to visit on an actual mobile, not an emulation.
I often see referals in Analytics from m.facebook.com which I think is the mobile sub-domain.
Also I think they would prefer users to use their App on mobile.
I would also go as far to say these big names are not (by an long way) the best place to pick up coding tips, their HTML is generally quite disgusting to my eyes. Unsemantic, invalid, bloated gobeldygook, a lesson in how not to do it.
I guess they are just big enough not to care.