Comment la requête multimédia s'applique-t-elle aux résolutions de smartphone?
Avec le lancement du nouvel iPhone 6 Plus avec une résolution de 1920x1080 px, cela m'a fait comprendre en quoi cette résolution est différente de la largeur de l'écran que nous définissons dans notre CSS dans les balises d'interrogation de média.
Par exemple, les points d'arrêt courants sont 480, 768, 992, etc., mais si vous utilisez un téléphone avec un écran 1080p, comment afficher votre site mobile sur cet appareil. Techniquement, il devrait afficher la version la plus large de votre site de bureau, mais je sais que le site mobile sera affiché. Alors, comment la requête multimédia "en dessous de 768" s’applique-t-elle à un périphérique d’une largeur de 1080px (en portrait)?
Mon téléphone a un écran de 4.7 "et une résolution de 540x960px (pathétique, je sais) et j'ai testé certains de mes propres sites Web sur l'appareil. La disposition est similaire à celle que vous obtiendriez si vous utilisiez le mode appareil dans chrome sur un ordinateur et diminuez la largeur à environ 380 pixels.Cela signifie que, lors du test, l'affichage que j'obtiens sur un ordinateur 380 pixels sera identique à un téléphone avec une résolution de périphérique de 540 pixels, ce qui me conduit?
La question est donc, en tant que développeur d'interface utilisateur, comment prédire à quelle résolution votre site Web sera-t-il affiché? J'espère que j'ai rendu la question assez claire. Merci
Il existe une différence entre les pixels physiques pouvant être affichés par iPhone 6 plus et la taille de l'écran. La taille de l'écran est la taille en pixels qui affecte votre requête multimédia CSS.
La taille de l'écran de l'iPhone 6 plus est de 414 x 736 pixels et la taille de la fenêtre du navigateur est légèrement différente en raison de l'espace disponible dans les menus.
Une bonne explication peut être trouvée ici: http://www.kylejlarson.com/blog/2015/iphone-6-screen-size-web-design-tips/
En gros, cela signifie que vous êtes prêt à utiliser des points d'arrêt de 480 pixels pour le portrait et de 768 pixels pour le paysage pour iPhone 6 plus.