Projet Webmaster PHP

Portail Php


Structure pour web mobile


Nous avons vu précédemment comment passer un site web sur mobile, voici d'autres éléments pour aller plus loin.

Rediriger l'internaute vers les pages mobiles


C'est une question que l'on se pose à juste titre à la conception du site, il existe plusieurs solutions.
Informer de l'url pour mobile : il s'agit de communiquer sur l'adresse de votre site version mobile. Il n'y a pas de redirection. Vous avec crée un sous domaine, ou bien un répertoire et c'est la que se trouve physiquement les pages pour mobile de votre site.
Détecter le navigateur wap : il s'agit ici de différencier l'internaute classique de l'internaute wap, pour ce faire on interroge le User-Agent et en fonction, on laisse passer le visiteur, ou bien on le redirige vers les pages adéquates.
Les pages pour mobile peuvent se trouver physiquement dans un répertoire donné du site, mais l'accès se fera vers un répertoire donné, un sous domaine, ou bien le même domaine.

Télécharger ici le Script pour détecter un navigateur wap


Une fois cet internaute détecté, il convient de le rediriger vers les bonnes pages : la version mobile du site. Comme indiqué dans le script, le changement de header permet de faire cette redirection.

Exemple d'utilisation du script :
Soit le répertoire de base : /repertoire/
Soit le répertoire wap : /repertoire/wap/

Si nous voulons que l'internaute web et l'internaute wap utilisent la même url indépendamment du support utilisé, nous allons écrire ceci.
Dans /repertoire/index.php, nous faisons un include suivant :
include ("mobile.php");

Dans mobile.php; le test suivant est fait :

if($isMobile){
header('Location: http://domaine.tld/wap/');
exit();
}

Ainsi pour l'internaute web, $isMobile répond false, rien n'est fait, le site web classique s'affiche, alors que pour l'internaute wap, $isMobile répond true, la redirection par le header se fait vers le répertoire ou se situe les pages wap pour mobile.


Structure des pages pour mobile


Ainsi que nous l'avons vu précédemment avec le template pour mobile, les pages sont structurées simplement.

Un entête avec liens de navigation.
Un corps de page avec contenu mis en forme, séparateur, affichage de vignette avec texte à droite et autour, texte en couleur, fond d'écran avec couleur.
Un pied de page avec liens de navigation.
Le W3C permet de suivre les avancées en matière de normes, tout n'est pas permis sur le wap, sinon nous laisserions l'internaute se débrouiller à zoomer sur les pages (la résolutions est différente) et à attendre que les pages se chargent, il est toutes fois utile de profiter des fonctions natives de ces smartphones avec notamment l'envoi de mail.

Les limites dans le codage
Un site dynamique est aujourd'hui composé de différents éléments pas forcément compatibles avec la venue de support différents.
Exemple : les liens absolus ou les liens relatifs.
Avec le protocole http sur le web, les pages peuvent avoir une url de base, les liens internes sont alors codés en fonction de cette base.
Côté flux rrs de syndication, permettant notamment de moins solliciter le serveur SQL, les liens relatifs ne sont pas acceptés. Etant donné que les flux sont exportables dans des lecteurs externes au site, le liens relatif n'a plus aucune valeur, bien au contraire.
Lorsque la base de donnée alors utilisée pour les flux de syndication, est également utilisée pour faire du contenu wap, les liens internes codés dans le texte de l'article sont des liens absolus. Ce liens absolu peut alors ne pas être cohérent avec l'url utilisée pour la version mobile du site.
Cette incohérence peut être levée de manière brutale en remplaçant à la volée les urls non cohérentes par des urls pointant vers la version wap. La manière fine serait de pouvoir disposer d'une url de base, également pour les flux rss.


Dernière étape, ou étape à mener en parallèle, voyons comment Tester son site avec un émulateur de mobile