- HTML5 et les portables
-
HTML5 présente quelques particularités pour son utilisation dans les téléphones mobiles, les tablettes tactiles, et autres dispositifs nomades.
Sommaire
Caractéristiques principales
Mémoire locale
Le stockage de données en cache (AppCache) par le navigateur permet, entre autres choses, de donner l'impression à l'utilisateur d'une continuité de la connexion dans certains cas où il y aurait eu des interruptions[1].
Pour que cela soit activé, il est nécessaire de créer un offline manifest la première fois et d'avoir le type MIME : text/cache-manifest[2].
Le fichier du manifest contient les dépendances qui sont requises pour qu'une application tourne bien.
CACHE MANIFEST # Version 0.1 offline.html /iui/iui.js /iui/iui.css /iui/loading.gif /iui/toolbar.png /iui/whiteButton.png /images/gymnastics.jpg /images/soccer.png /images/gym.jpg /images/soccer.jpg
Après la création du manifeste, il faut une connexion au navigateur, qui est réalisée par la balise html avec l'attribut manifest contenant l'URL du fichier du manifeste.
<html manifest="manifest.mf">Dessin
Un espace peut être affecté sur une page pour des images, des courbes, des graphes, des éléments ludiques, et toutes les autres choses qui peuvent être dessinées, soit par programmation, soit par l'interaction de l'utilisateur. Ceci est possible sans recourir à de la programmation via Adobe Flash ou d'autres plugins[3].
Flux vidéo et audio
Il devient possible de gérer des flux vidéo et audio directement, sans Adobe Flash[3].
Geolocalisation
Il existe une API de Géolocalisation récupère la position géographique de l'utilisateur. Cette API n'est pas incluse dans les spécifications de HTML5, mais elle peut être utilisée en complément. La latitude et la longitude sont alors disponible dans le JavaScript de la page, qui peut ensuite l'envoyer éventuellement au serveur. Cela pourrait être utilisé, par exemple, pour montrer les édifices touristiques ou commerciaux qui se trouvent proche de l'utilisateur[4].
Voici une ligne de code typique pour la géolocalisation :
navigator.geolocation.getCurrentPosition(successCallback, errorCallback, options);
La recherche de la position est une opération asynchrone, qui nécessite l'accord de l'utilisateur. Il faut donc fournir des fonctions de rappel pour les cas d'acceptation et de refus[5].
Formulaires avancés
Les champs des formulaires en HTML5 ont des attributs qui facilitent l'interface avec l'utilisateur, et qui réduisent la taille de la page HTML en enlevant la nécessité de certaines lignes de code javascript habituellement utilisées pour des contrôles locaux avant envoi au serveur[3].
Problèmes connus
Vidéo
Android
- Android 2.2 et les versions inférieures ne gèrent par l'attribut
controls. Cela oblige a fournir sa propre interface vidéo, contenant au minimum un script pour le démarrage de la vidéo. Ce bug est corrigé dans Android 2.3[6]. - Android 2.2 et les versions inférieures ne gèrent pas correctement l'attribut
typedans tous les cas, et notamment s'il manque l'extension ".mp4" pour une source MP4. Par contre, avec une source H.264, cela passe bien. Ce bug a été corrigé dans Android 2.3.
iPhones et iPads
- iOS 3.2 et les versions inférieures ne reconnaissent pas la vidéo si l'attribut
posterest présent. Cet attribut devrait permettre d'afficher une image lors du chargement de la vidéo. Ce bug a été corrigé dans iOS 4.0. - S'il y a plusieurs sources, iOS 3.2 et les versions inférieures ne prendront en compte que la première. Or, comme iOS n'accepte que les codecs H.264+AAC+MP4, cela signifie que la première source sera presque obligatoirement MP4. Ce bug est corrigé dans iOS 4.0[6].
Détection de la disponibilité d'HTML5 et du type fixe/mobile
Avant de créer une page au standard HTML5, le serveur peut souhaiter vérifier si le HTML5 sera admis par le poste client. Cette détection, ainsi que celle du type fixe/mobile se fait habituellement grâce au user-agent.
Tous les appareils qui dialoguent en HTTP doivent envoyer un user-agent qui est une chaîne de caractères identifiant le navigateur web et le système d'exploitation du poste client.
Pour le serveur de pages web, il est possible de détecter si HTML5 est supporté, en examinant la version du navigateur dans le user-agent. Et il est possible de détecter le type de matériel du client en examinant le système d'exploitation du user-agent.
Cela peut se faire de manière simple en comparant le nom à une liste préétablie qu'il faut maintenir. Ou bien cela peut se faire à l'aide de fonctions additionnelles ajoutées au serveur, par exemple, si le serveur est Apache, alors il existe le module AMFWurflFilter (Open Source) qui donne des attributs (is_wireless_device, is_tablet, ...) facilitant la détection des mobiles et facilitant le choix du format de page (resolution_width, resolution_height, ...)[7].
Voir aussi
- HTML5
- HTML5 video Open Video
References
- HTML5 from a Mobile Perspective July 22nd, 2009 by Jason Grigsby
- Make mobile Web applications work offline with HTML 5, Michael Galpin, 29 Jun 2010
- How HTML5 will change the use of web Dec 1, 2009 by Kevin Purdy
- GeoLocation API Mark Pilgrims ,Dive Into HTML5
- Java Script Geo location Framework for the Mobile Web code.google.com
- Mark Pilgrim: Dive Into HTML5
- http://wurfl.sourceforge.net/help_doc.php
Sources
- (en) Cet article est partiellement ou en totalité issu de l’article de Wikipédia en anglais intitulé « HTML5 in mobile devices » (voir la liste des auteurs)
- Android 2.2 et les versions inférieures ne gèrent par l'attribut
Wikimedia Foundation. 2010.
