How should the site look at different resolutions?

Question

css

Now I want to get a layout designer. They sent a layout in .psd at 1280px. I have no idea how to make sites with other resolutions. There are, for example, 4k, retina, fullhd (for example, I have such a monitor). Stretch blocks to full width or max-width to 1280? For example, there is a block with pictures. What to do with them when the resolution is reduced. Proportionately reduce the size of the picture or go down or do a slider? The header is full of all sorts of information, what to do with it when it is reduced? Does it just need to be creative or did each element have to be negotiated when scaling?

Answer 1

all this should be written in the terms of reference
if the site design changes depending on the screen size, then these all options must be rendered, otherwise you will not be able to make the correct html
for different sizes and screen resolutions, sets of pictures of different sizes are made
in general, if you have this the process has not yet been worked out, then you will dig in,
take a simpler task to start and look for similar sites or WordPress themes and see how they are made

Answer 2

I would take 1280px as a base - the container as you wrote max-width with padding, margin-left: auto and margin-right: auto. In case they need it under hd, they will send a new layout, where you change it through the media. As for reducing the resolution, then yes, you need to check with the designer or just rebuild blocks at breakpoints, 1024, 960, 768, 320, sometimes I do something at 600, 500. I can make mistakes with the breakpoints.
Pictures up to 768 rebuild into a column if they do not fit into one line. Less than 768, or make it a slider, because I imagine this endless scrolling of sausages on the phone, I would generally hide the extra information on phones, leaving the important one, but, as usual, everything is important. But, often everyone doesn't give a shit, so you can not drive and just rebuild them into a column.
In the header at 960, I would hide the info, leave the button - a hamburger, and also transfer the main info to the column.
I just usually get layouts in corel'e, there I have to find the container myself and also in the same resolution, the indents are different everywhere, in short, sometimes I want to cry.
P.S. terms of reference is sometimes not a panacea. Yes, and it often happens that it simply does not exist, it is somewhere in the bowels of the manager’s mind, and the pipeline requires more sites.

Answer 3

All these questions need to be clarified with the designer who sent you the layout. He alone knows how he came up with it.