web-dev-qa-db-fra.com

simulateur de navigateur iPhone / iPad?

J'ai besoin de voir à quoi ressemblent mes pages Web sur un iPhone et un iPad sur le bureau Windows. Est-ce possible?

Une recherche rapide a permis de trouver des sites de test pour iPhone, ce qui semblait être ce que je voulais. Cependant, ils sont extrêmement inexacts lorsque je les compare à mon propre iPhone! J'ai vraiment besoin de quelque chose d'aussi précis que possible à 100%.

XCode dispose-t-il d'un simulateur précis à 100%? Je comprends que j’aurais besoin d’un Mac pour exécuter XCode ...

69
at.

Le simulateur iPhone/iPad fourni avec Xcode inclut Safari. Si vous exécutez Safari dans le simulateur, vous pouvez afficher votre site Web. Celui-ci devrait alors être identique à celui d'un périphérique réel. Cela peut fonctionner pour les tests de disposition générale. Mais comme il s’agit d’un simulateur, il est possible que chaque fonctionnalité ne soit pas identique à celle utilisée par un véritable appareil iOS.

Si vous écrivez un site Web et que vous devez vérifier qu'il a l'air correct sur un appareil donné, vous devez alors tester votre site Web sur cet appareil réel. Tester avec du matériel réel fait partie du prix à payer pour faire des affaires.

Et oui, vous avez besoin d’un Mac pour exécuter Xcode.

43
rmaddy

Les deux Chrome et Firefox ont maintenant des émulateurs intégrés. Ils ne sont pas parfaits mais suffisent pour vous permettre de faire presque tout le chemin avant de tester sur un appareil réel. La meilleure partie est que si vous aimez les outils de développement du navigateur ( Chrome , Firefox ), vous pouvez les utiliser en émulant.

Pour obtenir l’émulateur: [Ctrl + Maj + M] et sélectionnez le périphérique que vous souhaitez émuler. Vous devrez peut-être actualiser la page, surtout si vous avez quelque chose qui dépend du script qui s'exécute au chargement de la page.

Google Chrome Emulation mode

Internet Explorer dispose également d'un mode d'émulation de périphérique. F12, puis CTRL + 8. Ce n'est pas aussi simple que l'émulation de Chrome Mobile Device, mais vous permet de simuler la géolocalisation:

Internet Explorer Emulation mode

32
jiminy

Simulateurs/émulateurs en ligne que j'utilise

1) recombiné

Beau simulateur qui - contrairement à redimensionnant la fenêtre du navigateur en fonction des dimensions du téléphone portable - agit comme un téléphone intelligent. Ne soyez pas dérouté par le fait que vous ne pouvez pas modifier la barre d'adresse dans safari - ouvrez simplement les outils de développement (généralement F12) et réécrivez l'URL source d'iframe dans la vôtre.
Lien: http://recombu.com/mobile/interactive/ios7-demo/

2) responsimulator

Semble fonctionner comme un recombiné, mais vous pouvez ouvrir l’url directement par la saisie de texte et vous pouvez zoomer/dézoomer.
Lien: http://www.responsimulator.com/

3) transmog

Celui-ci semble traiter la page Web, mais il imite le vieil iPhone - toujours pratique parfois.
Lien: http://transmog.net/iphone-simulator/mobile-web-browser-emulator.php

X) google it/internet pour la recherche

Utilisez toujours Google (ou d’autres moteurs de recherche sur Internet) pour rechercher d’autres simulateurs/émulateurs et les nouvelles versions.
Lien avec l'exemple de recherche Google pour celle-ci:
https://www.google.cz/search?q=online+iphone+emulator

Mode de périphérique de navigateur

Si vous ouvrez les outils de développement de votre navigateur (sous Chrome F12), une option vous permettra probablement de basculer en mode Appareil (sous Chrome, il s'agit de la petite icône de smartphone en haut à gauche).
chrome device mode icon

Après avoir choisi cette option, l'interface graphique changera et vous permettra de sélectionner le périphérique à simuler (dans Chrome en haut de la page, sélectionnez l'option "Périphérique"). Après la sélection du périphérique, l'actualisation de la page est souvent conseillée pour garantir la précision du simulateur.
chrome device mode - device select option

18
jave.web

Pour l'instant, je pense que le meilleur émulateur est https://app.crossbrowsertesting.com

Il a des tailles réelles et un clavier virtuel (c'est la chose la plus importante), des événements de zoom ...

Aussi https://appetize.io/demo a les mêmes choses mais il a une limite de temps.

5
rotring05

Vous pouvez exécuter safari dans le simulateur Xcode, qui simule avec précision les iPad et les iPhone. Une autre chose sur le marché pour laquelle j'ai entendu de bonnes critiques est Ripple for chrome .

3
j_mcnally

Il n'y a pas de bon substitut aux tests sur un périphérique réel.

Les appareils réels ont des densités d'affichage plus élevées, ce qui signifie que les pixels sont plus petits. Si vous ne testez pas sur un périphérique réel, vous ne réaliserez peut-être pas que votre conception inclut un texte trop petit pour être lu ou des boutons trop petits pour être tapés.

Vous utilisez de vrais appareils avec vos doigts, pas une souris. Cela signifie que la précision de vos taps est beaucoup plus faible et que ce que vous tapez est masqué par votre doigt. Si vous ne testez pas sur un périphérique réel, vous ne réaliserez peut-être pas que vous avez introduit des problèmes de convivialité dans votre conception.

2
Jim

XCode est fourni avec un simulateur pour iPad et iPhone.

Vous pouvez également utiliser Safari sous OS X pour déboguer des sites Web sur votre appareil iOS.

1
sosborn

Vous pouvez utiliser le émulateur Ripple sur Chrome.

0
Louis

J'ai utilisé Mobilizer , ce qui est génial application gratuite

Actuellement, il dispose d'une simulation par défaut pour Iphone4, Iphone5, Samsung Galaxt S3, Nokia Lumia, Palm Pre, Blackberry Storm et HTC Evo. Simple simple et efficace.

0
pal4life