Old age question: website resolutions & breakpoints

Discussion in 'General Muse' started by bjadams, Nov 30, 2016.

  1. bjadams

    bjadams Member

    9
    1
    I used to do sites using 1200 pixel resolution.

    With my new project I want to try something different. I made a high res 1900 pixel wide site and that's working fine for modern desktops.

    Now I would like to make 2 other versions, one for mobile and one for laptops/tablets.

    Would 800 pixels and 1200 pixels be good alternate resolutions for mobile & laptops/tablets?

    Thanks
     
  2. calipimousse

    calipimousse Well-Known Member

    55
    10
    Hi

    The screen size is more than a headache and with all the different devices out there it is hard to have a default size. There are 2 schools, one that does their design and when it need a break point they ad one and the other one where they go with device sizes(screen size). Now all depends on your target and I would say that you need
    1280 or (1200) if you prefer but if you want a higher size I would start at 1680 then I would have a 1024, 768, 480 after that if you find that you need to add break points because your design is not working then do it that is my point of view hope it helps.

    The list of screen sizes that I have found that cover most desktop, laptop and phones:

    Desktop:
    2560px (high end and not everyone has those)
    1920px (Full HD TV, Desktop monitors HD)
    1680px
    1440px

    Laptop:
    1366px
    1280px
    1152px

    Tablet and phone:
    1024px
    768px,

    640px,
    480px,
    414px (special to iphone 6+) (updated following post mistake)
    375px (iphone 6)
    320px (iphone 4,5,6,SE)

    I hope that this helps and that you will find the info useful.
     
  3. Mike Valkanet

    Mike Valkanet Well-Known Member

    79
    13
    I haven't started using Responsive yet. (they need to work out all the bugs 1st)

    I use 1100 page width and that works great on small and large monitors as well as tablets. I add a viewport tag for 1100 px wide so I don't have to create a tablet site.

    For phones I use 380px.
     

Share This Page