0

This question already has an answer here:

We are designing a website for desktop and tablets, which needs to work for 1366x768, 1024x768, 1920x1080, 600x1024, 1600x900 - the most common resolutions as per Stat Counter Global stats in India. I understand responsive design with break-points is required.

However, in the visual design stage (Sketch/Photoshop), we are only creating visual designs for 1024x768 resolution, as this is perhaps the most common approach at the design stage.

However, I am concerned about two things:

  1. Screen resolutions are already increasing. How do I ensure my website design is scalable to work for newer high pixel density technologies (example: retina display) or for large screens. I read up about fluid designs which will address higher resolutions, but is there any specific point which needs to be taken care of? Should our design be responsive to viewport changes or screen resolution changes?

  2. There are multiple aspect ratios we are targeting with a single design. Is it a better practice to design differently for say 1366x768 and 1600x900?

marked as duplicate by locationunknown, Midas, Mayo, Devin, Nick Groeneveld Jun 28 '17 at 11:11

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

  • 1
    Larger screen sizes don't necessarily mean larger browser windows. And higher pixel density shouldn't mean your site appears smaller (as long as your developers know what they are doing). – Andrew Martin Jun 27 '17 at 7:39
0

I'm betting this is a duplicate I couldn't find somewhere but here goes.

If you are looking at screen sizes and resolutions or devices, you're doing it wrong. The best line I have ever heard is that you should lay out your design and then stretch the screen wider until it looks like...uh...not a good design. Then you rearrange elements to make it a good design. You give no consideration to screen width or resolution because you have no method of reliably detecting such things cause browsers and devices often "lie".

Now, I'm ignoring image quality as used by retina displays. I'm only discussing layout.

So, again, your breakpoint is where your design breaks and nothing else.

Not the answer you're looking for? Browse other questions tagged or ask your own question.