Depuis des années, les experts affirment que le trafic sur les sites Web en provenance de visiteurs sur des appareils mobiles a considérablement augmenté. Pour cette raison, de nombreuses entreprises ont intelligemment commencé à adopter une stratégie mobile pour leur présence en ligne, créant des expériences adaptées au téléphone et aux autres appareils mobiles.
Une fois que vous avez passé du temps à apprendre à concevoir des pages Web pour les téléphones mobiles et à mettre en œuvre votre stratégie, vous voudrez également vous assurer que les visiteurs de votre site peuvent voir ces conceptions. Vous pouvez le faire de nombreuses façons et certaines fonctionnent mieux que d'autres. Voici un aperçu de la méthode que vous pouvez utiliser pour implémenter l’assistance mobile sur vos sites Web - ainsi qu’une recommandation, vers la fin, concernant la meilleure méthode pour y parvenir, sur le Web actuel!
Fournir un lien vers une autre version du site
C'est de loin la méthode la plus simple pour gérer les utilisateurs de téléphones portables. Au lieu de vous demander s'ils peuvent ou non voir vos pages, il vous suffit de placer un lien quelque part vers le haut de la page qui pointe vers une version mobile distincte de votre site. Ensuite, les lecteurs peuvent sélectionner eux-mêmes s’ils veulent voir la version mobile ou continuer avec la version "normale".
L'avantage de cette solution est qu'elle est facile à mettre en œuvre. Pour cela, vous devez créer une version optimisée pour mobile, puis ajouter un lien quelque part vers le haut des pages de site normales.
Les inconvénients sont:
- Vous devez conserver une version distincte du site pour les utilisateurs mobiles. À mesure que votre site s'agrandit, vous risquez peut-être de ne pas conserver la deuxième version et vos sites risquent de ne plus être synchronisés.
- Créez-vous également une troisième version pour les tablettes? Pourquoi pas une quatrième version pour les wearables? Ce concept de versions spécifiques à l’appareil peut très vite devenir incontrôlable.
- Vous devez mettre un lien moche en haut de la page que les lecteurs non mobiles peuvent voir (et éventuellement cliquer sur).
En fin de compte, cette approche est dépassée et ne fera probablement pas partie d'une stratégie mobile moderne. Il est parfois utilisé comme solution provisoire alors qu’une meilleure solution est en cours de développement, mais c’est vraiment un pansement à court terme pour le moment.
Utiliser JavaScript
Dans une variante de l'approche susmentionnée, certains développeurs utilisent un type de script de détection de navigateur pour détecter si le client se trouve sur un appareil mobile, puis les rediriger vers ce site mobile distinct. Le problème avec la détection de navigateur et les appareils mobiles est qu’il existe des milliers d’appareils mobiles. Essayer de les détecter avec un seul JavaScript pourrait transformer toutes vos pages en cauchemar pour le téléchargement - et vous êtes toujours soumis à de nombreux inconvénients identiques à ceux de l'approche susmentionnée.
Utiliser l'ordinateur de poche CSS @media
La commande CSS @media handheld semble être un moyen idéal d’afficher les styles CSS uniquement pour les appareils de poche, tels que les téléphones portables. Cela semble être une solution idéale pour afficher des pages pour les appareils mobiles. Vous écrivez une page Web, puis créez deux feuilles de style. La première pour le type de média "écran" donne du style à votre page pour les moniteurs et les écrans d’ordinateur. La seconde pour les "ordinateurs de poche" donne un style à votre page pour les petits appareils tels que les téléphones mobiles. Cela semble facile, mais cela ne fonctionne pas vraiment dans la pratique.
Le principal avantage de cette méthode est qu'il n'est pas nécessaire de gérer deux versions de votre site Web. Vous ne faites que maintenir celui-ci, et la feuille de style définit son apparence - ce qui se rapproche en fait de la solution finale que nous souhaitons.
Un problème avec cette méthode est que de nombreux téléphones ne prennent pas en charge le type de support. Ils affichent leurs pages avec le type de support d'écran. Et de nombreux téléphones portables et ordinateurs de poche plus anciens ne prennent pas en charge les CSS. En fin de compte, cette méthode n'est pas fiable et est donc rarement utilisée pour fournir des versions mobiles d'un site Web.
Utiliser PHP, JSP, ASP pour détecter l'agent utilisateur
Il s'agit d'un moyen bien plus efficace de rediriger les utilisateurs mobiles vers une version mobile du site Web, car celui-ci ne repose pas sur un langage de script ou sur un fichier CSS non utilisé par le périphérique mobile. Au lieu de cela, il utilise un langage côté serveur (PHP, ASP, JSP, ColdFusion, etc.) pour examiner l'agent utilisateur, puis modifie la demande HTTP pour qu'elle pointe vers une page mobile s'il s'agit d'un appareil mobile.
Un simple code PHP pour ce faire ressemblerait à ceci:
stristr ($ ua, "Windows CE") oustristr ($ ua, "AvantGo") oustristr ($ ua, "Mazingo") oustristr ($ ua, "Mobile") oustristr ($ ua, "T68") oustristr ($ ua, "Syncalot") oustristr ($ ua, "Blazer")) {$ DEVICE_TYPE = "MOBILE";}if (isset ($ DEVICE_TYPE) et $ DEVICE_TYPE == "MOBILE") {$ location = 'mobile / index.php';en-tête ('Location:'. $ location);sortie;}?>
Le problème ici est qu'il y a beaucoup d'autres agents utilisateurs potentiels utilisés par les appareils mobiles. Ce script capturera et redirigera beaucoup d'entre eux, mais pas par tous les moyens. Et plus sont ajoutés tout le temps.
De plus, comme avec les autres solutions ci-dessus, vous devrez toujours maintenir un site mobile séparé pour ces lecteurs! Cet inconvénient de devoir gérer deux (ou plus!) Sites Web est une raison suffisante pour rechercher une meilleure solution.
Utilisez WURFL
Si vous êtes toujours déterminé à rediriger vos utilisateurs mobiles vers un site distinct, WURFL (Wireless Universal Resource File) est une bonne solution. Il s'agit d'un fichier XML (et maintenant d'un fichier DB) et de diverses bibliothèques DBI qui non seulement contiennent des données d'agent d'utilisateur sans fil à jour, mais également les fonctionnalités et les fonctions prises en charge par ces agents.
Pour utiliser WURFL, vous devez télécharger le fichier de configuration XML, choisir votre langue et implémenter l'API sur votre site Web. Il existe des outils pour utiliser WURFL avec Java, PHP, Perl, Ruby, Python, Net, XSLT et C ++.
L'avantage d'utiliser WURFL est qu'il y a beaucoup de personnes qui mettent à jour et ajoutent le fichier de configuration tout le temps. Ainsi, bien que le fichier que vous utilisez soit périmé presque avant la fin du téléchargement, il est probable que si vous le téléchargez une fois par mois environ, tous les navigateurs mobiles que vos lecteurs utilisent habituellement problèmes. L'inconvénient, bien sûr, est que vous devez télécharger et mettre à jour continuellement tout cela - tout cela pour que vous puissiez diriger les utilisateurs vers un deuxième site Web et les inconvénients que cela crée.
La meilleure solution est la conception sensible
Donc, si le maintien de sites différents pour différents appareils n’est pas la solution, qu’en est-il? Site Web adaptatif.
La conception adaptative consiste à utiliser des requêtes de support CSS pour définir des styles pour des périphériques de différentes largeurs. Responsive design vous permet de créer une page Web pour les utilisateurs mobiles et non mobiles. Ensuite, vous n'avez plus à vous soucier du contenu à afficher sur le site mobile ni à transférer les dernières modifications apportées à votre site mobile. De plus, une fois que vous avez écrit le CSS, vous n'avez rien à télécharger.
Responsive design peut ne pas fonctionner parfaitement sur des appareils et navigateurs extrêmement anciens (la plupart d'entre eux sont aujourd'hui très peu utilisés et ne devraient donc pas trop vous inquiéter), mais parce qu'ils sont additifs (ajout de styles au contenu plutôt que de prendre du contenu loin) ces lecteurs pourront toujours lire votre site Web, il ne semblera pas idéal sur leur ancien appareil ou navigateur.