Rendre son site compatible avecRendre son site compatible avec
les nouveaux usages du WEBles nouveaux usages du WEB
Websch...
Votre site WEB est-ilVotre site WEB est-il
« compatible » mobile ?« compatible » mobile ?
• Bannir les applications FlashB...
Concevoir un site WEB dédié mobile,Concevoir un site WEB dédié mobile,
bonne ou mauvaise idée ?bonne ou mauvaise idée ?
• ...
Le "responsive design"Le "responsive design"
Le concept : ne plus de créer autant de pages qu'il yLe concept : ne plus de ...
La bonne technique de conceptionLa bonne technique de conception
THINK MOBILE FIRSTTHINK MOBILE FIRST
Privilégier la const...
La bonne technique de conceptionLa bonne technique de conception
THINK MOBILE FIRSTTHINK MOBILE FIRST
Privilégier la const...
Prochain SlideShare
Chargement dans…5
×

Webmobile - Rendre son site compatible avec les nouveaux usages du WEB

861 vues

Publié le

Webschool du Jura - Webmobile - Rendre son site compatible avec les nouveaux usages du WEB

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
861
Sur SlideShare
0
Issues des intégrations
0
Intégrations
488
Actions
Partages
0
Téléchargements
8
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Webmobile - Rendre son site compatible avec les nouveaux usages du WEB

  1. 1. Rendre son site compatible avecRendre son site compatible avec les nouveaux usages du WEBles nouveaux usages du WEB Webschool de la CCI du Jura 24 mars 2014 par François Bonneville - ARICIA
  2. 2. Votre site WEB est-ilVotre site WEB est-il « compatible » mobile ?« compatible » mobile ? • Bannir les applications FlashBannir les applications Flash – Non supportées par certains système IOS (Apple)Non supportées par certains système IOS (Apple) • Vérifier l'efficience des mécanismesVérifier l'efficience des mécanismes d'interactivitéd'interactivité – Les menus « déployer - cliquer »Les menus « déployer - cliquer » – La taille et le fonctionnement des formulairesLa taille et le fonctionnement des formulaires – Eviter les popupsEviter les popups • Ne pas avoir des pages trop largesNe pas avoir des pages trop larges
  3. 3. Concevoir un site WEB dédié mobile,Concevoir un site WEB dédié mobile, bonne ou mauvaise idée ?bonne ou mauvaise idée ? • Qu'est-ce qu'un site WEB dédié mobile ?Qu'est-ce qu'un site WEB dédié mobile ? Exemple : http://m.haut-jura.comExemple : http://m.haut-jura.com • AvantagesAvantages – Ergonomie conçue spécifiquement pour les mobilesErgonomie conçue spécifiquement pour les mobiles – Contenu pouvant être adapté à des visiteurs nomadesContenu pouvant être adapté à des visiteurs nomades  InconvénientsInconvénients – Coût de création importantCoût de création important – Maintenance parfois compliquée (2 sites à gérer)Maintenance parfois compliquée (2 sites à gérer)
  4. 4. Le "responsive design"Le "responsive design" Le concept : ne plus de créer autant de pages qu'il yLe concept : ne plus de créer autant de pages qu'il y a de famille de terminaux mais concevoir unea de famille de terminaux mais concevoir une seule interface auto-adaptableseule interface auto-adaptable Grâce à de nouvelles normes de développementGrâce à de nouvelles normes de développement WEB :WEB : • Media queries : règles conditionnelles pour styler uneMedia queries : règles conditionnelles pour styler une page en fonction de la résolutionpage en fonction de la résolution • Le concept de grille fluide : dimensionnement relatifLe concept de grille fluide : dimensionnement relatif des différents blocs de la page.des différents blocs de la page. • Images dimensionnées en unité relative, afin de prévenirImages dimensionnées en unité relative, afin de prévenir un éventuel débordement du contenuun éventuel débordement du contenu
  5. 5. La bonne technique de conceptionLa bonne technique de conception THINK MOBILE FIRSTTHINK MOBILE FIRST Privilégier la construction d'une interface ergonomique pourPrivilégier la construction d'une interface ergonomique pour terminaux mobilesterminaux mobiles La contrainte d'un faible espace d'affichage force à épurerLa contrainte d'un faible espace d'affichage force à épurer au maximum les éléments visiblesau maximum les éléments visibles Ensuite enrichir l'interface pour les supports « bureau »Ensuite enrichir l'interface pour les supports « bureau » Méthode très difficile à faire accepter aux graphistesMéthode très difficile à faire accepter aux graphistes
  6. 6. La bonne technique de conceptionLa bonne technique de conception THINK MOBILE FIRSTTHINK MOBILE FIRST Privilégier la construction d'une interface ergonomique pourPrivilégier la construction d'une interface ergonomique pour terminaux mobilesterminaux mobiles La contrainte d'un faible espace d'affichage force à épurerLa contrainte d'un faible espace d'affichage force à épurer au maximum les éléments visiblesau maximum les éléments visibles Ensuite enrichir l'interface pour les supports « bureau »Ensuite enrichir l'interface pour les supports « bureau » Méthode très difficile à faire accepter aux graphistesMéthode très difficile à faire accepter aux graphistes

×