1486 sujets
Web Mobile et responsive web design
Salut,
Halte à la balkanisation du Web !!!
Plus calmement, il est tout à fait possible d'adapter l'affichage d'un site Web aux supports mobiles, que ce soient des téléphones portables ou des tablettes. Regarde du côté des media queries et de la méta viewport. Bref, de l'adaptation uniquement en CSS (tu peux même t'inspirer de cette feuille de style de base pour le Web mobile).
Bonne lecture !
Halte à la balkanisation du Web !!!
Plus calmement, il est tout à fait possible d'adapter l'affichage d'un site Web aux supports mobiles, que ce soient des téléphones portables ou des tablettes. Regarde du côté des media queries et de la méta viewport. Bref, de l'adaptation uniquement en CSS (tu peux même t'inspirer de cette feuille de style de base pour le Web mobile).
Bonne lecture !
Salut,
En PHP, tu as la fonction get_browser(). Attention, elle ne s'utilise pas simplement en l'appelant, il faut bien lire toute la doc de cette fonction.
En PHP, tu as la fonction get_browser(). Attention, elle ne s'utilise pas simplement en l'appelant, il faut bien lire toute la doc de cette fonction.
Bonjour,
Tu peux envisager une redirection (immédiate) en JS en fonction de la taille du navigateur, (oublies pas de rediriger en prenant les paramètres dans l'url, rien de plus énervant que de suivre un lien d'une page interne desktop et se retrouver sur l'accueil du site mobile).
Et/Ou tu peux utiliser les media queries, qui en déca d'une certaine largeur affiche un lien vers la version mobile de ton site.
Si les fonctionnalités de ton site sont sensiblement identiques quelques soit le média de restitution, tu devrais opter plutôt pour le responsive web design. (Ce qui n'est pas toujours envisageable, pour des raisons d'ergonomie et d'expérience utilisateur différentes d'un média à l'autre.)
Tu peux envisager une redirection (immédiate) en JS en fonction de la taille du navigateur, (oublies pas de rediriger en prenant les paramètres dans l'url, rien de plus énervant que de suivre un lien d'une page interne desktop et se retrouver sur l'accueil du site mobile).
Et/Ou tu peux utiliser les media queries, qui en déca d'une certaine largeur affiche un lien vers la version mobile de ton site.
Si les fonctionnalités de ton site sont sensiblement identiques quelques soit le média de restitution, tu devrais opter plutôt pour le responsive web design. (Ce qui n'est pas toujours envisageable, pour des raisons d'ergonomie et d'expérience utilisateur différentes d'un média à l'autre.)
Où seulement si le site mobile et le site desktop n'ont pas la même utilité pour l'utilisateur. M'enfin, les cas peuvent être nombreux.
En tout cas, sans vouloir me faire trop d'auto pub, j'ai posté sur mon blog un code pour rediriger les utilisateurs mobiles (ça vise assez bien presque tous les mobiles).
Tu peux y jeter un oeil si tu veux t'en inspirer ou l'utiliser:
http://simonboudrias.com/blog/detecter-un-mobile-redirection-php/
J'en suis à le refaire en Class pour php5 et à y ajouter quelques fonctionnalités. Mais comme je commence tout juste un nouvel emploi, je ne peux rien promettre dans le temps !
Modifié par Vaxilart (18 Feb 2012 - 02:24)
En tout cas, sans vouloir me faire trop d'auto pub, j'ai posté sur mon blog un code pour rediriger les utilisateurs mobiles (ça vise assez bien presque tous les mobiles).
Tu peux y jeter un oeil si tu veux t'en inspirer ou l'utiliser:
http://simonboudrias.com/blog/detecter-un-mobile-redirection-php/
J'en suis à le refaire en Class pour php5 et à y ajouter quelques fonctionnalités. Mais comme je commence tout juste un nouvel emploi, je ne peux rien promettre dans le temps !
Modifié par Vaxilart (18 Feb 2012 - 02:24)
Patidou a écrit :
De toutes façons la redirection immédiate est déconseillée, c'est mieux de proposer le choix au visiteur ou alors pouvoir revenir au site normal si il en a envie.
J'aurais du le préciser, si un cookies , ne stipule pas le choix de rester sur la version desktop, par redirection immédiate (script en haut du code, et redirection sans attendre le chargement complet de la page) j'ai surtout en tête le changement de contexte perturbant dans un contexte d'accessibilité, mais aussi la diminution du temps d'attente susceptible de faire perdre un client.
Salut a tous,
Je ne sais pas si tu as trouvé ta réponse, mais personnellement j'utilise ceci sur mon site au cas où l'internaute le visiterai avec son iPhone :
Ceci ne détecte que les iphone, mais je crois qu'en remplacant "iPhone" par "iPad" cela fonctionne. Par contre en ce qui concerne Android cela ne fonctionne pas pour le moment.
;)
Modifié par reedbedroom (22 Sep 2011 - 09:23)
Je ne sais pas si tu as trouvé ta réponse, mais personnellement j'utilise ceci sur mon site au cas où l'internaute le visiterai avec son iPhone :
<script type="text/javascript">
function iPhoneAlert() {
if((navigator.userAgent.match(/iPhone/i))||(navigator.userAgent.
match(/iPod/i))){
var question = confirm("Souhaitez-vous naviguer sur le site optimisé pour iPhone?")
if (question){
window.location = "http://iphone.monsite.com/";
}else{
}
}
}
</script>
Ceci ne détecte que les iphone, mais je crois qu'en remplacant "iPhone" par "iPad" cela fonctionne. Par contre en ce qui concerne Android cela ne fonctionne pas pour le moment.
;)
Modifié par reedbedroom (22 Sep 2011 - 09:23)
Il y a ceci qui fonctionne très bien :
https://github.com/garetjax/phpbrowscap
Modifié par cbcb (18 Oct 2011 - 19:59)
https://github.com/garetjax/phpbrowscap
Modifié par cbcb (18 Oct 2011 - 19:59)
reedbedroom a écrit :
Salut a tous,
Je ne sais pas si tu as trouvé ta réponse, mais personnellement j'utilise ceci sur mon site au cas où l'internaute le visiterai avec son iPhone :
Ceci ne détecte que les iphone, mais je crois qu'en remplacant "iPhone" par "iPad" cela fonctionne. Par contre en ce qui concerne Android cela ne fonctionne pas pour le moment.
;)
Et à chaque retour sur la home, je reçois le message? Il faudrait au moins un cookie pour retenir le choix.
Pour ce qui est de la détection je couplerais ça avec les média queries en css, si élément #truc est masqué alors c'est un mobile et on pose la question. Faudrait que je teste tiens.
Pour moi la solution la plus souple, serait de faire un script PHP en amont qui analyse la chaine useragent, et qui, si il y trouve un nom de plateform mobile (ex blackberry, iphone ect) te redirige vers la page souhaiter.
Sa existe sur le web, il y'en a un très complet et gratuit; fait par Chris Schuld.
Après , le soucis reste le fait que la solution n'est pas très évolutive, car si demain il ya une toute nouvelle firm qui lance un smartphone qui cartonne ( peu probable, mais bon), sa chaine useragent, sera nouvelle et donc non detecter par le script PHP.
C'est pour ça que moi je cherche un script php ou javascript mais FIABLE, qui détecterais la résolution du media et qui redirigerait en concéquence
Sa existe sur le web, il y'en a un très complet et gratuit; fait par Chris Schuld.
Après , le soucis reste le fait que la solution n'est pas très évolutive, car si demain il ya une toute nouvelle firm qui lance un smartphone qui cartonne ( peu probable, mais bon), sa chaine useragent, sera nouvelle et donc non detecter par le script PHP.
C'est pour ça que moi je cherche un script php ou javascript mais FIABLE, qui détecterais la résolution du media et qui redirigerait en concéquence
G3NE a écrit :
Pour moi la solution la plus souple, serait de faire un script PHP en amont qui analyse la chaine useragent, et qui, si il y trouve un nom de plateform mobile (ex blackberry, iphone ect) te redirige vers la page souhaiter.
Sa existe sur le web, il y'en a un très complet et gratuit; fait par Chris Schuld.
Après , le soucis reste le fait que la solution n'est pas très évolutive, car si demain il ya une toute nouvelle firm qui lance un smartphone qui cartonne ( peu probable, mais bon), sa chaine useragent, sera nouvelle et donc non detecter par le script PHP.
Là est le problème
G3NE a écrit :
C'est pour ça que moi je cherche un script php ou javascript mais FIABLE, qui détecterais la résolution du media et qui redirigerait en concéquence
D'où les css… Je vais faire un test, mais ça ne sera pas ce soir, plutôt demain ou ce weekend.
De plus, une chaîne d'agent utilisateur peut être facilement manipulée pour qu'on lui fasse dire n'importe quoi, sans oublier que sa syntaxe peut évoluer de version de navigateur en version de navigateur (la chaîne d'agent utilisateur utilisée par Opera en est un bel exemple, sa syntaxe ayant été remaniée lors de la sortie de la version 10.00). Autrement, le browser sniffing, quel que soit le langage de programmation utilisé, n'est pas fiable à 100 %.
Patidou a écrit :
D'où les css… Je vais faire un test, mais ça ne sera pas ce soir, plutôt demain ou ce weekend.
Oui, d'ou les media-queries, mais le soucis, c'est que leurs interpretation selon les plateformes et les navigateurs sont vraiment très aléatoire pour l'instant je trouve, ça n'est donc pas très fiable
G3NE a écrit :
Oui, d'ou les media-queries, mais le soucis, c'est que leurs interpretation selon les plateformes et les navigateurs sont vraiment très aléatoire pour l'instant je trouve, ça n'est donc pas très fiable
Qui te dit que ce n'est pas très fiable ? À ma connaissance, la plupart des navigateurs mobiles du marché interprètent les media queries sans broncher.
