User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
When you open Amazon's website with developer's tools and try to re-size its viewport size, the site seems to be static. But when you open it in a mobile device it perfectly fits to the screen.
What technique is used here, and what are the advantages of making site static for the desktop browsers, unlike bootstrap which adapts itself in the desktop version too?
They will likely use server side device detection based around the User Agent to show an alternative version of the website. This method is know as Dynamic Serving.
Bootstrap uses the viewport width to change the layout via CSS, known as Responsive Web Design.
There are use cases and arguments for both techniques.
EDIT: I'll expand on the cases for each a little:-
Dynamic serving allows you to serve two (or more) distinct versions of the HTML, CSS, JS and media files such as images and video. This means you can refine and optimise every detail for a certain scenario and only load the elements needed. However you have to maintain each of these different versions separately.
Responsive web design uses the same HTML for all scenarios then applies different CSS rules to change the look of the site dependent on viewport dimensions. Which allows you to maintain a single codebase, rather than distinct versions of the site, however can sometimes mean loading elements that you might not use.
Then there is "Progressive enhancement" which could be used as icing on the cake of either, to add functionality based on feature detection.
