Votre site web version Mobile : La marche à suivre…

Accéder à l’Internet par le biais d’appareils portables est une pratique habituelle ces jours-ci. Il est évident que les personnes connectées à Internet via leurs téléphones portables sont en hausse et les chances de communiquer de manière optimisée sur ces plateformes sont absolument énormes.

Beaucoup d’entreprises axées sur les consommateurs (B to C) ont déjà réalisé à quel point ces « plates formes portables » peuvent être prometteuses et ont désormais elles-mêmes développées comme alternatives à leurs sites internet « parents » une version optimisée portable afin d’offrir une expérience totalement en adéquation avec ces nouveaux internautes mobiles et leurs plateformes de communications.

La navigation web mobile n’est pas une mode passagère, elle est en fait devenue une nécessité absolue, voire même un nouveau standard de comportement vers Internet. Donc, si vous n’avez pas encore mis en place votre propre site portable, nous allons aujourd’hui mettre l’accent sur la façon dont vous pouvez créer une version mobile de votre site principal à travers divers points importants et les techniques de base que vous pourrez utiliser pour faire de votre site portable, un succès.

Attention, il existe des procédures spécifiques à respecter quant à la conception d’un site internet mobile.
La meilleure façon de construire votre site mobile est de copier et modifier tout ou partie du site existant afin de le rendre compatible pour les plateformes mobiles.
Attendez-vous à ce qu’il y ait de grands changements en termes de mise en page, de conception dans la construction de ces pages dédiées et d’un sérieux régime quant à l’aspect graphique et la somme des contenus finaux.

Voici les principes de base que vous devriez prendre en compte avant de procéder au développement de votre communication mobile. Donc…

1. Disposition des informations principales:

Il peut être fastidieux de parcourir un site mobile, alors n’oubliez pas de mettre toutes les informations les plus importantes que vous souhaitez que les utilisateurs mobiles voient en haut de la page. Et n’oubliez pas d’inclure logo de votre entreprise personnalisé pour votre site mobile (créer un dérivé de votre logo de base peut être intéressant).
Assurez-vous de réduire au minimum la navigation gauche / droite, difficile sur un téléphone, et en lieu et place, organisez votre contenu en une seule colonne. Aussi, vous devriez minimiser l’utilisation de tables, mais si vous avez besoin d’en intégrer, ne pas utiliser plus de 2 colonnes, et évitez les lignes et colonnes qui fusionnent.

2. Contenu : Facilement identifiable.

Vous devez vous assurer que l’information sur votre site mobile est facile à lire et à naviguer, et ne prend pas trop de temps ni d’efforts à comprendre, car vos visiteurs sont probablement en déplacement tout en regardant votre site mobile sur leur téléphone.
Ayant finalement choisi quelle partie du contenu doit être affichée sur votre site mobile, adaptez votre menu de navigation et ajustez les textes afin d’éviter au maximum les fonctions de zoom. Comme pour la typographie choisie pour afficher le contenu, pensez à utiliser différentes rubriques pour contrôler les redimensionnements de la police.

3. Langage et développement : C’est ouvert…

Il n’y a pas vraiment à l’heure actuelle de type ou de mode de développement spécifique requis pour créer votre site mobile. Il est par contre beaucoup plus aisé si votre site mobile est développé en en XML ou XHTML. Vous pourrez aussi créer votre site avec la plupart des bases et bons procédés HTML et CSS possibles. Les tags de titre, les balises meta de description, les balises de titre et les noms de fichiers doivent être soigneusement étudiés et choisis avec pour objectif un maximum de mots-clés afin d’optimiser (maximiser) au mieux (au plus) le peu de contenu disponible sur ces plateformes réduites.

4. Images et visuels : Optimisez au maximum !

La plupart des téléphones portables prennent une éternité à charger les images. Il faut donc utiliser des images et des graphiques aussi peu que possible, avec parcimonie et que si ces dernières sont contextuellement pertinentes. Quant au format des images sur votre site web mobile, elles devraient être dans les formats classiques .gif, .jpeg ou bien en .png (bien que ce dernier format en cas de transparence puisse générer un poids supplémentaire..). De manière générale, assurez-vous de compresser vos images afin d’éviter les effets de zoom. Et de plus, aujourd’hui, presque tous les dispositifs portables actuels assurent des fonctions d’affichage des images performant, cependant, certains des utilisateurs peuvent parcourir le web mobile avec l’option images désactivées. Aussi toujours utiliser la balise « alt » (texte alternatif) est une pratique plus que recommandée.

5. Taille des pages : Jouez serré.

Lors du choix des directions graphiques d’un style pour votre site web mobile, il est essentiel de viser simple et clair pour un poids final de pages minimum. Gardez en tête que la taille maximum d’une page de site mobile est d’à peu près 20 Ko, alors essayez d’y faire loger toutes vos informations et éventuellement utilisez moins de 10 Ko par pages. Gardez en tête que les forfaits ne sont pas tous illimités et sont souvent facturé par Ko de données Internet consultées.

6. Pages et navigation : Retour aux sources !

Une bonne conception de navigation au sein d’un site web mobile se doit de fournir des boutons et des liens de retour vers l’accueil par exemple. Bien qu’il soit plutôt mal aisé de se déplacer sur un téléphone portable (et de nombreux téléphones ne sont pas équipés de boutons de retour), essayez de fournir à votre visiteur des options de retour aux menus principaux et d’éviter les impasses. De plus, il est nécessaire de s’assurer que toutes les pages sont correctement liées à d’autres pages de façon à leur éviter de se perdre dans l’arborescence du site. Et ne pas oublier l’évidence : un site consulté depuis un téléphone portable se doit de proposer une option d’appel à vos services… invitez-y votre visiteur par un lien direct!

Quelques conseils supplémentaires :

• Votre URL en dit long sur votre site web mobile et votre attachement aux moyens de communication en général et à leur optimisation en particulier. Alors, pensez à utiliser au mieux l’extension .mobi qui indique une expérience mobile au lieu d’un .com, .fr, .edu ou encore .org qui désignent une expérience plus classique.

Ou alors, de manière plus classique, hébergez votre version mobile en sous-domaine c’est la manière utilisée pour la plupart des sites mobiles.
Par exemple, la version mobile de Simpliweb.fr est http://mobi.simpliweb.fr/ (le site principal étant http://www.simpliweb.fr).

• Testez consciencieusement la version mobile de votre site sur plusieurs plateformes représentatives (et de préférence de systèmes (Os) différents), car c’est la seule façon d’être vraiment sûr que votre site web mobile répondra correctement à l’utilisation qui lui est destinée.
Pour cela et si vous n’avez pas accès à plusieurs appareils en durs (ce qui est le cas en général), vous pouvez utiliser différents émulateurs de plateformes mobiles sur le web, comme l’iPhoneTester 3G & 4G par exemple (http://iphonetester.com/) ou Opera Mini (http://www.opera.com/mobile/) entre autres.

• Assurez-vous de mettre souvent votre site à jour, sinon votre site web mobile ne saura pas capter l’audience de plus en plus nombreuse des internautes mobiles.

• Attention: la plupart des navigateurs pour portables ne sont pas (ou très peux) compatibles avec Flash, la plupart des lecteurs audio et vidéo, le JavaScript, les cadres, les pop-up, et autres petites choses sympas que les développeurs aiment utiliser pour pimenter l’expérience des internautes sur leurs sites, ils sont complètement inutilisables pour ceux qui consulteront votre site web mobile sur leurs téléphones portables.

• Il serait aussi très pratique de disposer de différentes versions de votre site web mobile dans différentes tailles d’écran, de résolutions et d’échelle de pages correspondant aux différentes tailles d’écrans, plutôt que de fixer une largeur fixe de pixels pour les éléments de la page. Ne pas oublier que toutes les tailles d’écrans sont dans la nature ! (Il n’y a donc pas de normes, mais une règle de départ de 176px par 240px/320px semble le meilleur compromis global).

Conclusion :

Si vous avez suivi attentivement les points précités ci-dessus, il y a un maximum de chances que votre site web mobile soit en mesure de diffuser toutes les informations essentielles qu’il contient d’une manière claire et efficace à vos clients ou vos collaborateurs, prospects et internautes mobiles!

Besoin d’inspiration ? : Consultez la galerie MobileWebShowcase : http://www.mobilewebshowcase.com/quelques uns des meilleurs sites web mobiles notés par la mobilosphère (?!)…

Vous avez des projets Internet ? ... Cliquez sur la bannière ci-dessus !

Rendez-nous visite sur www.simpliweb.fr