Quelles versions de navigateurs mobiles/appareils/systèmes d'exploitation sont actuellement compatibles avec HTML 5, CSS3 et jQuery ?
Réponses
Trop de publicités?
Webkit (Chrome, Safari) prend en charge HTML5 et CSS3. jQuery est pris en charge, mais vous pourriez trouver que les animations sont quelque peu lentes. Webkit peut être trouvé sur Android et iOS.
Opera Mini prend en charge HTML5 et CSS3, et je suis prêt à parier que ses performances en Javascript sont du même ordre que celles de Webkit.
Notez que Webkit et Opera ne prennent pas en charge exactement les mêmes fonctionnalités - webkit dispose de plus de CSS de présentation disponibles, mais pour la plupart, ils disposent de fonctionnalités similaires disponibles.
En résumé: Gardez votre javascript léger et propre, et limitez votre HTML et votre CSS à ce qui fonctionnerait normalement entre Webkit et Opera (et dans une moindre mesure, Firefox). De cette façon, vous vous assurerez de développer une application compatible multiplateforme agréable qui n'alourdit pas le téléphone.
Considérez également l'utilisation de requêtes médias pour cibler des plates-formes spécifiques en CSS.
Éditer: Concernant Hover / Mouseenter / Mouseleave:
Je vous recommande d'éviter d'utiliser les effets mouseneter, hover ou mouseleave dans une application tactile. Ces effets sont conçus pour fournir des retours pour un pointeur de souris, qui n'est pas directement attaché à notre bras (et étant donné que les souris peuvent avoir différentes vitesses de suivi, il n'est pas toujours facile pour l'utilisateur de repérer la souris).
Cependant, dans un environnement tactile, ces événements peuvent être déclenchés de manière incorrecte, ou pas du tout. Certains navigateurs dans un environnement mobile (comme Safari sur mon iPad) semblent appliquer l'état de survol (voir ici) lors du clic sur un lien, ce qui semble quelque peu incorrect.
Je travaille avec un écran tactile sur un PC Windows pour une application contenue, et cela présente des problèmes similaires. Lorsque les utilisateurs tapent sur le panneau, le curseur de la souris est déplacé à cet endroit - et ainsi des éléments comme les titres peuvent apparaître sur des éléments qui les ont. Ce qui est ridicule quand il n'y a pas de curseur. (La plupart des gens ne pensent pas à un curseur invisible qui les suit, ce qui se produit précisément sur la plupart des écrans tactiles).
Considérez qu'une application tactile est conçue pour imiter des boutons physiques, matériels comme ceux d'un clavier. Vous n'obtenez aucun retour pour savoir que vous êtes sur le point de les pousser, mais vous recevez un retour une fois que vous avez poussé le bouton (retour physique / haptique) ainsi que le résultat souhaité. Étant donné que la plupart des écrans tactiles ne prennent pas en charge le retour haptique, vous devez fournir un retour visuel pour remplacer le retour physique que les gens attendront - et ensuite le résultat doit se produire.
À titre d'exemple, les boutons de mon application Web changeront leur fond en un dégradé inversé à l'état "actif". Cela signifie que lorsque le bouton est enfoncé, le bouton s'enfonce, et alors l'action liée à celui-ci commencera.
Rob
Points
6332
