how to ensure that the design draft is restored under different resolution screens
(a similar background management project on the PC side)
learn the following ways:
want to know how to deal with it in practice
from the problem analysis of the subject, it is not difficult to find that the core of the problem is "the best choice for 100% reduction of the design draft."
so here's the problem. Among the several plans given by the subject, do you really restore the plan of the design draft? What does the design draft restore?
We know the width and height of the design draft. Are fixed, if only individually restore the width or height, then it will cause stretching, then at different resolutions. Are we restoring his width-to-height ratio?
I tried it many years ago. I found that restoring the width-to-height ratio may not necessarily look good. Why?
metaphorically speaking. Your 1360 resolution is 14px, and the resolution of 1920 is 1.5 times that of 1360. Do you want to set your word to 21px? The answer is no. Because the user with a big screen wants to see more content. For example, when he uses a big screen to see the first 10 words of a line, he wants to see 15 words, not 10 words of a larger size, unless your users are all 60 or 70 years old. no, no, no.
therefore, in view of the above conclusion, give the answer, restore the design draft is not to restore the width-to-height ratio of the design draft, but to restore its visual perception.
then comes the question of how to restore its visual feeling. no, no, no. First of all, you have to distinguish what kind of layout this is according to the design manuscript. And then distinguish it according to the layout. For example the simplest Taobao website. From the previous two pictures
, we can see that the difference between a large screen and a small screen is that the gap in the middle has increased.
so the design draft is not restored proportionally, but partially fixed and partially adaptive.
all the answers are typed by hand. If the subject thinks the answer is serious, please adopt
.backstage managed projects do not need to 100% restore the design draft, determine a prototype design, UI specification or style, choose a responsive UI library, work overtime, development speed is the key, ha.
in addition, if the landlord mentions viewport, you can refer to this article to replace rem;
.not all components have to be done by hand, only in personal opinion.
it is difficult and difficult for the PC side to achieve a more perfect adaptation like the mobile terminal.