HTML5 sur terminaux mobiles
HTML5 présente quelques particularités pour son utilisation dans les téléphones mobiles, les tablettes tactiles, et autres dispositifs nomades.
Caractéristiques principales
[modifier | modifier le code]Mémoire locale
[modifier | modifier le code]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
[modifier | modifier le code]Un espace peut être affecté sur une page pour intégrer des éléments multimédia tels que des vidéos, 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
[modifier | modifier le code]Il devient possible de gérer des flux vidéo et audio directement, sans Adobe Flash[3].
Géolocalisation
[modifier | modifier le code]Il existe des API de géolocalisation qui récupèrent la position géographique de l'utilisateur. Ce type d'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 disponibles 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 proches 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
[modifier | modifier le code]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
[modifier | modifier le code]Vidéo
[modifier | modifier le code]Android
[modifier | modifier le code]- Android 2.2 et les versions antérieures ne gèrent pas l'attribut
controls. Cela oblige à 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 anté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.
iPhone et iPad
[modifier | modifier le code]- iOS 3.2 et les versions anté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 antérieures ne prendront en compte que la première. Or, iOS n'accepte que les codecs H.264, AAC et 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
[modifier | modifier le code]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].
Notes et références
[modifier | modifier le code]- 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 Pilgrim, Dive Into HTML5
- Java Script Geo location Framework for the Mobile Web code.google.com
- Mark Pilgrim: Dive Into HTML5
- (en) « ScientiaMobile Documentation », sur sourceforge.net (consulté le ).
Voir aussi
[modifier | modifier le code]Articles connexes
[modifier | modifier le code]- HTML5
- HTML5 video Open Video
- Appcelerator Titanium est un kit de construction de logiciel
