OK…anybody got the responsive size for iPhone 7 yet?
If you have a truly responsive site you don’t need to know the dimensions of individual devices.
Using exact screen dimensions is not something i would advise. You will run into a host of screen sizes that will break your layout. To make your site responsive you really have 2 solid options. You can use media queries to estimate screen sizes, So lets say you want to have your site respond to mobile device screen sizes you can use a media query to say any screen with less than this 500px(example) is considered a mobile device and you can then use css to have your site visual style respond to the screen size. Your next option is javascript which in my opinion is far more precise but also more work. You can use javascript to calculate the screen size and then some code to go through your tags and resize accordingly.
What I try to do is design for a smart phone (in my case it’s a iPhone 6+) and a tablet (Kindle Fire in my case), then I just resize my PC screen to guess what it might look on other devices. However, there are online websites that will let you see what they look like on other devices as well, but I tend to be lazy in doing that. You can even do it browsers such as Chrome where it gives you developer tools such as mobile screens and such, but I usually mess it up so I tend to use online resources.
You should just design so it works at any width between 300px and say 950px. Then all devices are taken into account.
That’s not an option that anybody should use though:)
Just apply media queries at points where your design needs to reform and not where some imaginary device may be sitting. In this way you cater for all devices for all time.
This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.