Etat de l’art des  sites Internet mobile Thomas Brault
Les résolutions d’écrans <ul><li>Résolutions différentes selon les mobiles.  </li></ul><ul><li>Résolutions correct pour co...
Technologie <ul><li>Les sites mobiles sont composés principalement  d’HTML et CSS </li></ul><ul><li>JavaScript déconseillé...
Analyse de l’existant <ul><li>http://m.youtube.com/   </li></ul><ul><li>Contenu largement allégé </li></ul><ul><li>Informa...
Analyse de l’existant <ul><li>Page de consultation de vidéo simple, avec le contenu principal : description de vidéo, vote...
Analyse de l’existant <ul><li>http://iphone.facebook.com/ </li></ul><ul><li>Menu de navigation à l’horizontal </li></ul><u...
Analyse de l’existant <ul><li>http://m.netvibes.com/ </li></ul><ul><li>Trois niveaux de navigation contextuel:  </li></ul>...
Analyse de l’existant <ul><li>http://m.flickr.com/ </li></ul><ul><li>Affichage simple du menu sur la Home </li></ul><ul><l...
Conclusion <ul><li>Interfaces pauvres graphiquement  </li></ul><ul><li>Navigation et contenus prennent une place différent...
Prochain SlideShare
Chargement dans…5
×

Sites internet mobiles

530 vues

Publié le

Etat de l'art des sites internet mobiles

Publié dans : Technologie
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
530
Sur SlideShare
0
Issues des intégrations
0
Intégrations
29
Actions
Partages
0
Téléchargements
12
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Sites internet mobiles

  1. 1. Etat de l’art des sites Internet mobile Thomas Brault
  2. 2. Les résolutions d’écrans <ul><li>Résolutions différentes selon les mobiles. </li></ul><ul><li>Résolutions correct pour consulter Internet depuis son site mobile: </li></ul><ul><ul><li>176x220 </li></ul></ul><ul><ul><li>320x240 </li></ul></ul><ul><ul><li>Soit un ratio de 1/3 </li></ul></ul>
  3. 3. Technologie <ul><li>Les sites mobiles sont composés principalement d’HTML et CSS </li></ul><ul><li>JavaScript déconseillé afin de ne pas ralentir les appareil souvent limite en fréquence de processeur </li></ul><ul><li>Navigateurs: Internet explorer mobile, Opera mobile, NetFront </li></ul>
  4. 4. Analyse de l’existant <ul><li>http://m.youtube.com/ </li></ul><ul><li>Contenu largement allégé </li></ul><ul><li>Informations principales mises en avant </li></ul><ul><li>Format des vignettes : 40x30px </li></ul><ul><li>Menu vertical en bas de page </li></ul><ul><li>On peut regretter la présence de la pagination uniquement en bas de la page ainsi que l’impossibilité de modifier le nombre de vidéos par page </li></ul>
  5. 5. Analyse de l’existant <ul><li>Page de consultation de vidéo simple, avec le contenu principal : description de vidéo, vote, catégorie, et lien de visionnage </li></ul><ul><li>Les numéros devant les items de menus permettes des accès direct, avec le clavier numérique du téléphone </li></ul>
  6. 6. Analyse de l’existant <ul><li>http://iphone.facebook.com/ </li></ul><ul><li>Menu de navigation à l’horizontal </li></ul><ul><li>Trois niveaux de navigations, dont un principal </li></ul><ul><li>Des boutons large (adapté pour l’iPhone, qui est tactile) </li></ul><ul><li>Interface graphique plus travaillée </li></ul>
  7. 7. Analyse de l’existant <ul><li>http://m.netvibes.com/ </li></ul><ul><li>Trois niveaux de navigation contextuel: </li></ul><ul><ul><li>Navigation du haut permet de naviguer entre les TAB ou entre les articles </li></ul></ul><ul><ul><li>Navigation du bas permet de sélectionner une TAB </li></ul></ul><ul><ul><li>Le contenu central permet d’acceder aux articles </li></ul></ul>
  8. 8. Analyse de l’existant <ul><li>http://m.flickr.com/ </li></ul><ul><li>Affichage simple du menu sur la Home </li></ul><ul><li>Accès direct aux rubriques via pavé numérique </li></ul><ul><li>Affichage du contenu principal simplifié </li></ul><ul><li>Interactivité possible : envoi de commentaire et de photo </li></ul>
  9. 9. Conclusion <ul><li>Interfaces pauvres graphiquement </li></ul><ul><li>Navigation et contenus prennent une place différentes </li></ul><ul><li>La totalité de l’espace écran est usité </li></ul><ul><li>Un adaptation de sites très riches de contenus en espace très restreint bien pensé et mis à l’œuvre: </li></ul><ul><ul><li>On ne manque d’aucune informations </li></ul></ul><ul><ul><li>La quasi-totalité des rubriques sont retranscrites </li></ul></ul><ul><ul><li>L’interactivité est aussi présente : </li></ul></ul><ul><ul><ul><li>Upload de fichier </li></ul></ul></ul><ul><ul><ul><li>Envoi de commentaire </li></ul></ul></ul><ul><ul><ul><li>Notation d’article </li></ul></ul></ul>

×