How should I decide the width of the web page?

Asked 2 years ago, Updated 2 years ago, 139 views

We are developing a business application to use on a web browser.
Recent PCs and tablets have resolution above 1920X1080
How should the width be determined as a web page?
It may be basic, but please let me know.

I've seen that it's written on various sites, but it says 950-1000 is common. These days, it's more than 1200PX... They're all sensuous and I don't know how to decide.

html5

2022-09-30 21:48

1 Answers

It's not a program problem, but it's more about defining requirements and design, but I'll give you an answer just in case.

If it's a business application, isn't it possible to limit the number of customers and usage scenes you expect?
Then, set the width.You should also decide the screen width based on the content you want to view and UIUX.

If the hardware is limited, it should only be used on a specific monitor, then that size should be appropriate.On the contrary, there is no point in preparing the size of the PC screen even though the system is only used for smartphones.
If you can assume a variety of sizes, I think you often use the full screen width to create a responsive screen design.

However, even though the screen width is full, there is not much content
To be honest, if you make something big, it will be too long.
Set the maximum screen width considering the amount of content and UIUX.
The stack overflow PC site also has a header footer full of screen width, but the maximum actual content is 97.2307692rem.

In the case of responsive, the key is the breakpoint, and where to make responsive.
Also, if you set the minimum width of the breakpoint and it becomes less than that, don't break the layout. By changing the design, the design is made to a certain extent.
I often refer to Bootstarp, a design framework.

This is what the image looks like.
Smartphone Vertical <576px<Smartphone Horizontal <768px<Tablet <992px<Laptop <1200px Large Monitor

If it's just a vertical smartphone and a laptop,
Smartphone Vertical <576px<PC

However, depending on the device and monitor, the screen may be bigger or smaller with IoT devices.
Therefore, it is important to check and define the requirements to see on which terminal you should see it.

I think it would be good to communicate with designers and set the width to be easy to use.


2022-09-30 21:48

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.