As the table below suggests, should you take into account the size of the browser itself when designing web apps? For example, should my artboard size be 1331x548 instead of 1366x768?
-
1You cannot affect the appearance of a user's browser and it has nothing to do with your web design– ManlyAug 7, 2017 at 18:30
-
The only thing to consider is what the favicon will look like. Do not try to match the website colors or style with the browser because that is something out of your control.– AndrewHAug 7, 2017 at 18:34
-
1This isnt a bad question per see. Yes its there, no you shouldn't design at any size at all you need to make a scaleable design. I dont think ive ever had my browser maximized in a screen that large!– joojaaAug 7, 2017 at 19:23
2 Answers
You should consider these sizes in the sense that you should think about your design needing to be responsive, but sizing your artboard to an exact pixel value is not at all necessary.
What you should be far more concerned about is what screen sizes will your users be using? If you can determine this by looking at statistics, that's great. Mostly, you need to focus on an approximate 300-1600px width scale, though it should still work okay on screens much larger than that.
When designing a component, think about what it will look like at different screen sizes (phones, tablets, laptops, large screens). If you can do this for all the components you should be fine.
Your website should be responsive to the browser width for the best experience, and images should scale with it. I wouldn't recommend creating images with purposefully specific dimensions considering so many browsers are different, even on desktop. You can (and probably should) achieve this through CSS or some other style formatting. When I created a web application for my A-Level coursework, I used https://www.w3schools.com/css/css_rwd_viewport.asp which was very handy. It also automatically turns the site portrait when narrower than 600px (from my experience).