how does a web server detect which devices are requesting the data?

Question

okay, i am a new and learning web developer, and i read some articles about responsive web design,and what i wanted to ask is, how does a server (or browser?) know the device of the clients to send data (or display) that matches the device screen resolution or is it something that decided on the html of the client side? thanks.

Answer 1

Responsive design is usually handled on the client side; the idea is to use so-called @media queries in your stylesheets.



https://developer.mozilla.org/en-US/docs/Web/CSS/@media



Here's an example:



@media screen and (min-width: 900px) {

article {

padding: 1rem 3rem;

}

}



The "article" rule will not be applied on printouts, or screens with a width of less than 900 pixels.



If you want to make your life easier, separate your CSS into style and layout: put all rules that will apply regardless of screen size (color, fonts) into a general stylesheet. Then use @media rules in a second one to define the layouts for the various sizes. You can also @import the second stylesheet conditionally in your main one.

Answer 2

the browser knows how big it's own display window is, and uses that as a gauge of what to show.

Answer 3

The client itself can be detected from the user agent string that is sent in the HTTP request headers. The screen resolution is detected through JavaScript.



https://www.w3schools.com/jsref/prop_screen_availheight.asp

https://www.w3schools.com/jsref/prop_screen_availwidth.asp

https://en.wikipedia.org/wiki/User_agent

Answer 4

Hi so as you leaving out the key factor the Domain name server who's records need to be in place correctly before it will pass the data.