iPhone 6 is officially out & people start to use this. It’s good but one more thing which you need to take care about your website is that is your website is ready for iPhone 6?
iPhone 6 has launched with two screen sizes & resolutions & your website need to look good in these two screen sizes & resolutions.
What you think is your website work properly with new technology? Sometimes it happened websites that worked well on older technologies would not work when accessed with new technologies.
Most of sites lose their visual appeal & functionality.
What you think how your website response to iPhone 6?
You can get the answer of this question by testing your site.
If your website is fully responsive/adaptive then there is no need to worry about your website.
If you have designed your responsive website target particular screen sizes-not devices then your website will show correctly as long as it is above the minimum width of your site was developed for.
Dimensions For The iPhone 6 Screens: The iPhone 6 has two screen sizes 4.7 inch & 5.5 inch.
The 4.7 inch iPhone 6 have 750px by 1334px physical resolutions & the 5.5 inch iPhone 6 Plus have 1080px by 1920px physical resolutions.
The CSS dimensions of the iPhone 6 & iPhone 6 Plus will be 375px by 667px and 414px by 736px, respectively.
The below assumes a mobile-first strategy to make your websites responsive.
iPhone 5 and below Breakpoint:
@media (min-width: 320px) { … }
iPhone 6 Breakpoint:
@media (min-width: 375px) { … }
iPhone 6 Breakpoint:
@media (min-width: 414px) { … }
Websites images in iPhone 6 & iPhone 6 Plus: The iPhone 6 Plus breaks into device pixel ratio of 3 (mathematically, it’s 2.4). It means extra high resolution images 3 times the size is displayed on the screen & you must balance the extra size with page load and performance aims.