Is it ok if I set width of web page 2560px when designing?
Copy link to clipboard
Copied
I heard that the most common width is 1920px, but I saw a tutorial of web design and in that video, the designer set his width 2560px.
Is it ok if I do the same? Will it show up fine on any monitor when I design with a 2560px width?
Explore related tutorials & articles
Copy link to clipboard
Copied
Technically you can set it to what ever you feel like. For images keep in mind that the image would shrink in size to fit, clip the overage or would enable a scroll bar depending on how the web site handles over sized images. This is also dependent on the video resolution of the viewer.
This is why when you design an image that specific sizes are recommended.
Copy link to clipboard
Copied
I'm not sure of the specifics of your workflow but don't forget that when you export an image you can resize it. I'll frequently design with very large file sizes knowing that I'll likely export out images of smaller dimensions.
Could you tell us a little more about your workflow. Are you designing in conjunction with others or having to create assets at very specific sizes?
Copy link to clipboard
Copied
Will it show up fine on any monitor when I design with a 2560px width?
No.
In web design, you need to be thinking in ranges rather than fixed pixels. The web is a flexible medium, not static like print. One size doesn't fit all. And we don't know what size viewport or pixel density people have. It could be anything from a low-cost mobile phone to a hi-res jumbotron and everything in between. So while 2560px might work for certain devices, it won't fit everything.
To put this into real-world context, Bootstrap responsive layout system contains the following CSS breakpoints. Keep in mind that Bootstrap is a mobile-first framework used by millions of sites worldwide. Extra small is the default layout for all devices with adjustments for sm, md, lg and xlg..
xs = Extra small <576px
sm = Small ≥576px
md = Medium ≥768px
lg = Large ≥992px
xl = Extra large ≥1200px
See Bootstrap example and resize your browser viewport & zoom settings.
https://www.w3schools.com/bootstrap4/trybs_template1.htm
Creating responsive design comps that work well in these device ranges will go a long way towards keeping your web developers & site visitors happy 🙂
Good luck in 2020!

