Infos fiables et maintenues pour application responsive

Bonjour

Je gère le site d'une association, qui a peu d'utilisateurs (moins de 100). Je n'ai donc pas ne théorie à me soucier d'une trop grande diversité des appareils utilisés. Cependant, chaque fois que l'un d'entre eux achète un nouveau téléphone ou une nouvelle tablette, je découvre des incompatibilités (ça semble plus stable côté ordinateurs, sauf qu'il traine ici ou là des vieilles versions d'IE).
Par exemple je sais mettre à jour le calendrier d'un iPhone en envoyant les informations au format ics, mais ça n'a pas l'air de fonctionner avec un autre type de téléphone et je ne sais pas comment faire. De même avec le répertoire des contacts.

Je me demande s'il existe un site bien fait et surtout maintenu dans lequel on peut trouver ce genre d'informations.

Concernant le PHP, j'ai trouvé http://mobiledetect.net/ qui est mis à jour régulièrement et permet de tester facilement à quel type d'appareil on a à faire. Il s'agit d'une classe d'objet PHP qu'il suffit de mettre à jour au fur et à mesure des nouveautés techniques. Ça ne dit cependant rien sur les possibilités de chaque appareil.
Je n'ai rien trouvé de semblable sur les media queries, c'est à dire des infos synthétisées sur les différents appareils du marché.

Il serait bon que ceux d'entre nous qui possèderaient des pointeurs sur des sites fiables de ce genre partagent leurs informations avec les autres.
D'avance merci

Hello,

Côté client, tu as cet article ici même sur Alsa à propos de MatchMedia qui pourra t'intéresser, mais tu as aussi enquire.js qui fait office de pendant JS des media queries CSS.
Modifié par audrasjb (28 Feb 2015 - 12:50)

audrasjb a écrit :
Hello,

Côté client, tu as cet article ici même sur Alsa à propos de MatchMedia qui pourra t'intéresser, mais tu as aussi enquire.js qui fait office de pendant JS des media queries CSS.

Merci beaucoup.

Je connaisais déjà l'article en question et je viens de ragarder enquire.js sur ta recommandation.

Ce dont je parle est un peu différent, c'est un état aussi juste que possible des différents types d'appareils, de ce qu'on peut faire avec et comment le faire, par exemple "comment mettre â jour le calendrier d'un téléphone" (autrement qu'en mettant tout chez Google calendar, c'est à dire sur la place publique), et également une liste des caractéristiques de chaque appareil de façon â comprendre qu'on a besoin ou non d'un média query spécial pour traiter le problème de tel utilisateur et lequel.
Sachant qu'on nous prépare dans les labos de plus en plus d'appareils connectés, on va avoir besoin de ce genre d'infos â grande échelle.

Hmm, ok.
J'ai l'impression qu'il y a des points très différenciés dans ta demande :
– Celui des media queries et de l'adaptation de l'interface de sites web à tous les supports. Question interface, le design responsive est déjà un point plutôt bien balisé et les ressources ne manquent pas. Ça commence avec l'adaptation desktop vers mobile point de rupture par point de rupture, mais on éventuellement opter pour des démarches de conception type mobile-first (on part du plus petit dénominateur commun).
– Celui de la détection et de l'utilisation des fonctionnalités offertes(ou pas) par l'agent utilisateur : géolocalisation, accès à la capture audio, vidéo, etc.
– Celui de l'interconnexion avec l'applicatif client : accès aux applications d'agenda, de messagerie, voire de jeux, de réseaux sociaux ou que sais-je encore. Là, c'est encore une autre paire de manche : chaque appareil dispose de son propre environnement applicatif, de son propre contexte, etc.

De ce que je comprends, ce serait plutôt ce dernier point qui t'intéresse.
Pour ton exemple "comment mettre â jour le calendrier d'un téléphone", je ne sais pas trop quoi répondre… tu n'as aucune maîtrise de l'applicatif utilisé/installé, chaque environnement étant différent ça risque d'être compliqué de se lancer vers ce genre de chose sauf à se trouver dans le cadre d'un parc informatique maîtrisé, ce qui n'est a priori pas ton cas

Pour revenir à ta question portant sur les agenda, je pense si tu commence par fournir un flux de données standardisées (format ICal) et que tu propose à l'utilisateur de rattacher ce flux à son agenda, si celui-ci est capable de le faire, tu auras déjà fait une bonne partie du chemin non ?

Mais en tout cas, ça n'a pas vraiment de rapport avec les media queries ou avec les autres points que j'ai détaillé ci-dessus…

Merci de tes réponses.

Le calendrier en iCal, c'est ce que j'ai fait et ça ne semble marcher que sur mobiles Apple (iPhone et iPad); comme je possède ces deux appareils, j'ai pu tester, mais je ne vais pas acheter tous les téléphones et les tablettes du marché, et je n'ai pas d'endroit où poser la question : comment faire pour les autres téléphones? A la limite je pourrais aller sur les sites de chaque producteur de téléphone et rechercher de l'info. Mais ce n'était qu'un exemple.

Le design responsive, ce n'est pas seulement afficher les données en fonction de la taille de l'écran, c'est aussi savoir tirer parti des fonctionnalités des divers appareils.
Si on veut pouvoir faire du design responsive sans avoir une équipe de 30 personnes et un budget élevé d'achat de matériels divers et variés pour faire des tests, il est nécessaire de disposer d'un endroit centralisé où on trouve facilement les infos nécessaires.

A noter que pour les tests sur différents navigateurs, il y a des services pour ça sur Internet, et de plus on peut gratuitement installer les principaux navigateurs sur son propre ordinateur.
Il serait bien d'avoir quelque chose de similaire pour les mobiles et nouveaux appareils qui ne vont pas manquer apparaître sur le marché. Par exemple si on a un réfrigérateur connecté à Internet qui se souvient de ce qu'on a mis dedans et à quelle date, il peut être intéressant pour les entreprises qui vendent des denrées périssables d'avoir une appli qui puisse s"y connecter. Ce marché va rester un marché fermé -- et donc propriété privée des grands acteurs -- si on n'a pas de moyens de tester ce genre d'interface.

Par ailleurs les media queries sont très bien pour les écrans, mais si tu ne sais pas quelles sont les tailles critiques d'écran tu ne vas pas aller très loin dans ton implémentation.
Modifié par PapyJP (28 Feb 2015 - 18:55)

PapyJP a écrit :
Le calendrier en iCal, c'est ce que j'ai fait et ça ne semble marcher que sur mobiles Apple (iPhone et iPad); comme je possède ces deux appareils, j'ai pu tester, mais je ne vais pas acheter tous les téléphones et les tablettes du marché, et je n'ai pas d'endroit où poser la question : comment faire pour les autres téléphones?

Si ces autres appareils ne supportent pas le standard iCal, ça va pas être simple. Cela dit, ça m'étonne qu'il ne soit pas reconnu à peu près unanimement (sauf appareils disposant d'un applicatif bas de gamme, fait à l'arrache, ou trop ancien).

PapyJP a écrit :
Le design responsive, ce n'est pas seulement afficher les données en fonction de la taille de l'écran, c'est aussi savoir tirer parti des fonctionnalités des divers appareils.

Hmm… le design responsive, c'est concevoir une interface pour que son design soit capable de s'adapter au contexte-viewport client.

PapyJP a écrit :
Si on veut pouvoir faire du design responsive sans avoir une équipe de 30 personnes et un budget élevé d'achat de matériels divers et variés pour faire des tests, il est nécessaire de disposer d'un endroit centralisé où on trouve facilement les infos nécessaires.

Il est toujours plus intéressant et pro pour une équipe (même toute petite) de disposer d'une petite flotte d'appareils pour tester une interface, mais ce que tu décris pourrait être bien entendu assez utile.

Si les initiatives comme CanIUse ou mydevice.io/devices/ ne te suffisent pas, à ton tour de lancer une initiative de ce genre!

PapyJP a écrit :
Par ailleurs les media queries sont très bien pour les écrans, mais si tu ne sais pas quelles sont les tailles critiques d'écran tu ne vas pas aller très loin dans ton implémentation.

Au contraire, l'idée du responsive (cf post plus haut) et que tu n'as apparemment pas compris, c'est de lâcher prise par rapport aux points de rupture de chaque device… d'abord parce qu'ils nous mentent, ensuite parce que vu la diversité des appareils, il est bien plus adapté de penser directement design fluide que de s'embêter avec 50 points de rupture qui ne seront plus d'actualités dans 6 mois.
:)
Modifié par audrasjb (02 Mar 2015 - 10:59)

Merci de m'avoir signalé http://www.mydevice.io/devices, c'est déjà un grand pas dans la direction que je recherche.
Je suis d'accord qu'il faut apporter de la fluidité plutôt que de coder en fonction des seuils, mais il n'est pas inutile de savoir quelle va être la taille de l'écran de la prochaine montre connectée, par exemple. Je doute que l'on puisse passer avec fluidité de ce qui marche bien sur un téléphone à ce qu'on fera marcher sur ces futurs engins, de la même facon qu'on ne fait pas la même présentation sur un iPad et un iPhone.

Pour le reste, je veux bien que le mot "responsive" soit exclusivement réservé à l'ergonomie des appareils en fonction de la taille d'écran, mais quel mot utiliser pour désigner l'adaptation de l'ergonomie des applications internet aux possibilités des appareils et pas seulement de l'écran? Je pense par exemple aux difficultés qu'on rencontre en raison de l'absence de souris sur une tablette. Sans compter bien d'autres choses qui sont dans les tuyaux et qui finiront bien par sortir sur le marché.