SlideShare une entreprise Scribd logo
1  sur  28
» Le contenu et le contenant
Introduction




               > Doivent répondre aux attentes utilisateurs

               > Doivent y répondre facilement et rapidement




                                                               www.simaway.com
         1                LPRO – Lionel DAMM - 2008
» En un coup d’œil, l’internaute doit comprendre
  le but du site internet
    >  Site informatif
    >  Site de vente
    >  Site communautaire

» En un coup d’œil, l’internaute doit comprendre
  le secteur d’activité
    >  Le type de produits
    >  Le positionnement de gamme de l’enseigne




                                                   www.simaway.com
2              LPRO – Lionel DAMM - 2008
» Déterminer les fonctionnalités principales du e-
  commerce

     >  Rappel du panier
     >  Retour à la HomePage                 GARDER EN TÊTE
                                                L’OBJECTIF
     >  Ajouter au panier
                                                PRINCIPAL :
     >  Les menus de navigation             AMELIORER LE TAUX
     >  Le moteur de recherche                      DE
                                             TRANSFORMATION
     >  Mon compte
     >  SAV




                                                                www.simaway.com
 3              LPRO – Lionel DAMM - 2008
www.simaway.com
LPRO– Lionel DAMM - 2008
» Permet d’obtenir une vue globale du site
 » Permet de segmenter chaque partie
Construction du site




 » Il regroupe l’ensemble des pages du site avec
   certaines informations clés

 » C’est un document clé du développement
 » Elle peut évoluer avec le temps
 » C’est un des premiers documents créés




                                                                 www.simaway.com
                                                   »  Voir PDF
                5      LPRO – Lionel DAMM - 2008
Construction du site




       6
LPRO – Lionel DAMM - 2008




  www.simaway.com
» Construire son menu en fonction de
   l’arborescence
Construction du site




 » Construire une navigation intuitive pour les
   visiteurs

 » Respecter au maximum la règle des 3 clics
   pour accéder à l’information




                                                   www.simaway.com
                7      LPRO – Lionel DAMM - 2008
» Une navigation intuitive ?

    > Répondre aux attentes des internautes
    > Faire en fonction du comportement de l’internaute
    > Prendre en compte l’âge de la cible
    > Peu importe le niveau de pratique de l’internaute, il
      doit trouver l’information rapidement

           ADAPTER LA NAVIGATION OU OFFRIR
                  PLUSIEURS CHOIX




                                                              www.simaway.com
8               LPRO – Lionel DAMM - 2008
» Le cerveau humain est capable d’intégrer plus
  ou moins 7 éléments dans la mémoire à court
  terme

» Ne pas exagérer sur vos menus de navigation


      PRÉFÉREZ FAIRE UN MENU AVEC DES
       SOUS MENUS PLUTÔT QU’UN MENU
            UNIQUE TROP CHARGÉ




                                                  www.simaway.com
            LPRO – Lionel DAMM - 2008
» Menus par onglets
» Menus déroulants
» Listes déroulantes
» Zone de recherche
» FAQ
» Chemin de navigation




                                       www.simaway.com
10         LPRO – Lionel DAMM - 2008
» Le chemin de navigation (breadcrumbs trail)

     > Connaître facilement sa position dans le site

     > Pouvoir facilement revenir à la rubrique supérieure




                                                             www.simaway.com
11              LPRO – Lionel DAMM - 2008
» Faire un plan du site
     > Plan par catégorie et index alphabétique


» Mettre en avant un bouton « Accueil »
     > Le standard est de mettre ce lien sur le logo du site


» Faire des URLs explicites
     >  http://www.rueducommerce.fr/Ordinateurs/Ordinateur-Portable/Ordinateur-
       Portable-Professionnel/APPLE/389584-MacBook-Pro-17-2-33GHz-Intel-
       Core-2-Duo.htm




                                                                                  www.simaway.com
» Eviter l’utilisation du Flash
12                    LPRO – Lionel DAMM - 2008
» Les liens

     > Mettre en avant les liens cliquables
        •  Couleur, épaisseur, soulignement…
     > Mettre en avant les liens visités


» Offre une navigation plus rapide et plus
  intuitive

» Définir la destination du lien (pdf, externe,




                                                  www.simaway.com
  image, langue)
13               LPRO – Lionel DAMM - 2008
www.simaway.com
LPRO– Lionel DAMM - 2008
» Choisir la bonne taille
Construction du site




 » En fonction des statistiques de son
   lectorat




                                                   www.simaway.com
        15             LPRO – Lionel DAMM - 2008
» Choisir la bonne présentation
                       > En fonction du nombre d’informations
                       > Du nombre de menus
Construction du site




                       > De la publicité éventuelle


 » Permet de choisir un navigation à droite ou à
   gauche


 » Permet de choisir la largeur des colonnes




                                                                www.simaway.com
        16                        LPRO – Lionel DAMM - 2008
» Choisir la bonne présentation
Construction du site




                                                   www.simaway.com
        17             LPRO – Lionel DAMM - 2008
» Choisir la bonne présentation
Construction du site




                                                   www.simaway.com
        18             LPRO – Lionel DAMM - 2008
» Choisir la bonne présentation
Construction du site




                                                   www.simaway.com
        19             LPRO – Lionel DAMM - 2008
» Le site doit être accessible pour tous quelque
  soit :

     > Le navigateur
     > L’OS
     > La taille d’écran / les couleurs
     > Les plugins installés (flash, quicktime, java…)
     > La connexion internet




                                                         www.simaway.com
20              LPRO – Lionel DAMM - 2008
» Développer le site sur des standards web
  d’accessibilité

» Utilisation du XHTML et CSS pour
  l’optimisation des pages
     > Poids plus léger
     > Accessibilité pour les non voyants


» Lisibilité accrue pour tous




                                              www.simaway.com
     > Limiter l’accès aux plugins externes
21              LPRO – Lionel DAMM - 2008
» Structurer l’information

     > Utiliser des typologies identiques pour les items
       semblables

     > Utiliser la même mise en forme
       •  Couleur, espacement, alignement…


     > Mettre en avant les éléments importants




                                                           www.simaway.com
     > Bien nommer les pages
22              LPRO – Lionel DAMM - 2008
» Attention à la compatibilité entre les
  ordinateurs
» Ne pas utiliser de polices « exotiques »
» Utiliser uniquement 1 ou 2 polices sur
  l’ensemble du site
» Utiliser des polices standards
     > Verdana, tahoma, times, lucida, helvetica
» Respecter les tailles en fonction :
     > De l’importance de l’information




                                                   www.simaway.com
     > De la hiérarchisation
23              LPRO – Lionel DAMM - 2008
» Images ? Animations ? Vidéos ?

 » Bien choisir ses images en fonction de ses
La mise en forme




   besoins
                   > JPG
                   > PNG
                   > GIF


 » Flash




                                                          www.simaway.com
                   > Présentation de produit
      24                      LPRO – Lionel DAMM - 2008
» Image ou couleur
 » Permet de créer une ambiance
 » Peut faciliter la lecture
La mise en forme




 » Attention à l’intégration et à la lisibilité
 » Problème de contraste sur une couleur
 » Problème d’image et de transparence




                                                  www.simaway.com
      25           LPRO – Lionel DAMM - 2008
» Certaines icones ont des significations fortes




                                                   www.simaway.com
26          LPRO – Lionel DAMM - 2008
www.simaway.com
LPRO– Lionel DAMM - 2008
» Le graphisme du site doit être en accord avec
  la cible client (couleur, forme, technologie)
» Le fond est important mais la forme
  également.
     > Elle facilite la lecture
     > Elle facilite l’adhésion
     > Elle facilite la reconnaissance
     > Elle développe l’image
     > Elle fidélise




                                                  www.simaway.com
28               LPRO – Lionel DAMM - 2008

Contenu connexe

En vedette

Tremblement de terre en haïti stacey vero
Tremblement de terre en haïti stacey veroTremblement de terre en haïti stacey vero
Tremblement de terre en haïti stacey veroVerCar0143
 
Le+costa+concordia+la+mort+d'un+geant
Le+costa+concordia+la+mort+d'un+geantLe+costa+concordia+la+mort+d'un+geant
Le+costa+concordia+la+mort+d'un+geantGeorge Martin
 
Anses led report
Anses led reportAnses led report
Anses led reportMugsMan
 
Support pratic 090410_2
Support pratic 090410_2Support pratic 090410_2
Support pratic 090410_2FormaVia
 
Los Sistemas De InformacióN En La Empresa
Los Sistemas De InformacióN En La EmpresaLos Sistemas De InformacióN En La Empresa
Los Sistemas De InformacióN En La EmpresaFinancieros2008
 
Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014
Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014
Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014Colegio Camilo Henríquez
 
Periodismo y redes sociales
Periodismo y redes socialesPeriodismo y redes sociales
Periodismo y redes socialesAnahiLovato
 
Pres fduport
Pres fduportPres fduport
Pres fduportFormaVia
 
Bibliothèques rurales (taqefni)
Bibliothèques rurales (taqefni) Bibliothèques rurales (taqefni)
Bibliothèques rurales (taqefni) Mohamed Rahmo
 
SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...
SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...
SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...Alfonso Alcántara YORIENTO
 

En vedette (20)

Tremblement de terre en haïti stacey vero
Tremblement de terre en haïti stacey veroTremblement de terre en haïti stacey vero
Tremblement de terre en haïti stacey vero
 
Le+costa+concordia+la+mort+d'un+geant
Le+costa+concordia+la+mort+d'un+geantLe+costa+concordia+la+mort+d'un+geant
Le+costa+concordia+la+mort+d'un+geant
 
Anses led report
Anses led reportAnses led report
Anses led report
 
Support pratic 090410_2
Support pratic 090410_2Support pratic 090410_2
Support pratic 090410_2
 
Grupo Educativo
Grupo EducativoGrupo Educativo
Grupo Educativo
 
M4,L1 SOHCAHTOA
M4,L1 SOHCAHTOAM4,L1 SOHCAHTOA
M4,L1 SOHCAHTOA
 
Asamblea De Herramientas
Asamblea De HerramientasAsamblea De Herramientas
Asamblea De Herramientas
 
3º basico b
3º basico b3º basico b
3º basico b
 
Los Sistemas De InformacióN En La Empresa
Los Sistemas De InformacióN En La EmpresaLos Sistemas De InformacióN En La Empresa
Los Sistemas De InformacióN En La Empresa
 
327 Portraiture
327 Portraiture327 Portraiture
327 Portraiture
 
Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014
Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014
Informativo n°35 -_5°_basico_a_-_14_de_noviembre_de_2014
 
Savez-vous vendre?
Savez-vous vendre?Savez-vous vendre?
Savez-vous vendre?
 
Periodismo y redes sociales
Periodismo y redes socialesPeriodismo y redes sociales
Periodismo y redes sociales
 
M7,l5
M7,l5M7,l5
M7,l5
 
Pres fduport
Pres fduportPres fduport
Pres fduport
 
Bibliothèques rurales (taqefni)
Bibliothèques rurales (taqefni) Bibliothèques rurales (taqefni)
Bibliothèques rurales (taqefni)
 
4º basico a 15 de mayo
4º basico a  15 de mayo4º basico a  15 de mayo
4º basico a 15 de mayo
 
SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...
SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...
SocialConfirming: El poder de la ciudadanía mediante el consumo. Manolo Recio...
 
Moonlight 43
Moonlight 43Moonlight 43
Moonlight 43
 
1º basico a 07 de agosto
1º basico a  07 de agosto1º basico a  07 de agosto
1º basico a 07 de agosto
 

Similaire à ergonomie

Introduction à Silverlight
Introduction à SilverlightIntroduction à Silverlight
Introduction à Silverlightkemenaran
 
Formation Marketing online, les outils de la fidélisation
Formation Marketing online, les outils de la fidélisationFormation Marketing online, les outils de la fidélisation
Formation Marketing online, les outils de la fidélisationSimaWay Simaway
 
Journée Logiciel Libre Reims 2008
Journée Logiciel Libre Reims 2008Journée Logiciel Libre Reims 2008
Journée Logiciel Libre Reims 2008Nicolas Ogier
 
Adobe LiveCycle Data Services
Adobe LiveCycle Data ServicesAdobe LiveCycle Data Services
Adobe LiveCycle Data ServicesMichael Chaize
 
Formation E-tourisme Reussir Son Site Internet (hotel et gite)
Formation E-tourisme Reussir Son Site Internet (hotel et gite)Formation E-tourisme Reussir Son Site Internet (hotel et gite)
Formation E-tourisme Reussir Son Site Internet (hotel et gite)SimaWay Simaway
 
Presentation Ai3 Journée Web Agency
Presentation Ai3   Journée Web AgencyPresentation Ai3   Journée Web Agency
Presentation Ai3 Journée Web Agencyxavier.raymond
 
Formation referencement : optimisez sa positionnement, Niveau 2
Formation referencement : optimisez sa positionnement, Niveau 2Formation referencement : optimisez sa positionnement, Niveau 2
Formation referencement : optimisez sa positionnement, Niveau 2SimaWay Simaway
 
Friday Web 16 01 2009
Friday Web 16 01 2009Friday Web 16 01 2009
Friday Web 16 01 2009Arnaud_Pukan
 
Améliorez la vitesse de chargement de votre site - Webisland 2018
Améliorez la vitesse de chargement de votre site - Webisland 2018Améliorez la vitesse de chargement de votre site - Webisland 2018
Améliorez la vitesse de chargement de votre site - Webisland 2018Aymen Loukil
 
Créer l'Intranet de son entreprise avec SharePoint Online
Créer l'Intranet de son entreprise avec SharePoint OnlineCréer l'Intranet de son entreprise avec SharePoint Online
Créer l'Intranet de son entreprise avec SharePoint OnlineJulien Chable
 

Similaire à ergonomie (11)

Introduction à Silverlight
Introduction à SilverlightIntroduction à Silverlight
Introduction à Silverlight
 
Formation Marketing online, les outils de la fidélisation
Formation Marketing online, les outils de la fidélisationFormation Marketing online, les outils de la fidélisation
Formation Marketing online, les outils de la fidélisation
 
Journée Logiciel Libre Reims 2008
Journée Logiciel Libre Reims 2008Journée Logiciel Libre Reims 2008
Journée Logiciel Libre Reims 2008
 
Adobe LiveCycle Data Services
Adobe LiveCycle Data ServicesAdobe LiveCycle Data Services
Adobe LiveCycle Data Services
 
Formation E-tourisme Reussir Son Site Internet (hotel et gite)
Formation E-tourisme Reussir Son Site Internet (hotel et gite)Formation E-tourisme Reussir Son Site Internet (hotel et gite)
Formation E-tourisme Reussir Son Site Internet (hotel et gite)
 
Presentation Ai3 Journée Web Agency
Presentation Ai3   Journée Web AgencyPresentation Ai3   Journée Web Agency
Presentation Ai3 Journée Web Agency
 
Formation referencement : optimisez sa positionnement, Niveau 2
Formation referencement : optimisez sa positionnement, Niveau 2Formation referencement : optimisez sa positionnement, Niveau 2
Formation referencement : optimisez sa positionnement, Niveau 2
 
Intro Aquarium Paris Printemps 2009
Intro Aquarium Paris Printemps 2009Intro Aquarium Paris Printemps 2009
Intro Aquarium Paris Printemps 2009
 
Friday Web 16 01 2009
Friday Web 16 01 2009Friday Web 16 01 2009
Friday Web 16 01 2009
 
Améliorez la vitesse de chargement de votre site - Webisland 2018
Améliorez la vitesse de chargement de votre site - Webisland 2018Améliorez la vitesse de chargement de votre site - Webisland 2018
Améliorez la vitesse de chargement de votre site - Webisland 2018
 
Créer l'Intranet de son entreprise avec SharePoint Online
Créer l'Intranet de son entreprise avec SharePoint OnlineCréer l'Intranet de son entreprise avec SharePoint Online
Créer l'Intranet de son entreprise avec SharePoint Online
 

Dernier

PIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdfPIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdfRiDaHAziz
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx   Film     françaisPas de vagues.  pptx   Film     français
Pas de vagues. pptx Film françaisTxaruka
 
Chana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienneChana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienneTxaruka
 
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptxPrésentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptxJCAC
 
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...Bibdoc 37
 
PIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdfPIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdfRiDaHAziz
 
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdfBibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdfBibdoc 37
 
Bernard Réquichot.pptx Peintre français
Bernard Réquichot.pptx   Peintre françaisBernard Réquichot.pptx   Peintre français
Bernard Réquichot.pptx Peintre françaisTxaruka
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx      Film   françaisPas de vagues.  pptx      Film   français
Pas de vagues. pptx Film françaisTxaruka
 
Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)Gabriel Gay-Para
 
Cours de Management des Systèmes d'information
Cours de Management des Systèmes d'informationCours de Management des Systèmes d'information
Cours de Management des Systèmes d'informationpapediallo3
 
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdfVulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdfSylvianeBachy
 
La Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdfLa Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdfbdp12
 
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...NaimDoumissi
 
Apprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceursApprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceursStagiaireLearningmat
 
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptxDIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptxMartin M Flynn
 
Bibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdfBibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdfBibdoc 37
 

Dernier (18)

PIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdfPIE-A2-P 5- Supports stagiaires.pptx.pdf
PIE-A2-P 5- Supports stagiaires.pptx.pdf
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx   Film     françaisPas de vagues.  pptx   Film     français
Pas de vagues. pptx Film français
 
Chana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienneChana Orloff.pptx Sculptrice franco-ukranienne
Chana Orloff.pptx Sculptrice franco-ukranienne
 
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptxPrésentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
Présentation - Initiatives - CECOSDA - OIF - Fact Checking.pptx
 
Bulletin des bibliotheques Burkina Faso mars 2024
Bulletin des bibliotheques Burkina Faso mars 2024Bulletin des bibliotheques Burkina Faso mars 2024
Bulletin des bibliotheques Burkina Faso mars 2024
 
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
Bibdoc 2024 - L’Éducation aux Médias et à l’Information face à l’intelligence...
 
PIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdfPIE-A2-P4-support stagiaires sept 22-validé.pdf
PIE-A2-P4-support stagiaires sept 22-validé.pdf
 
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdfBibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
Bibdoc 2024 - Les maillons de la chaine du livre face aux enjeux écologiques.pdf
 
Bernard Réquichot.pptx Peintre français
Bernard Réquichot.pptx   Peintre françaisBernard Réquichot.pptx   Peintre français
Bernard Réquichot.pptx Peintre français
 
Pas de vagues. pptx Film français
Pas de vagues.  pptx      Film   françaisPas de vagues.  pptx      Film   français
Pas de vagues. pptx Film français
 
Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)Faut-il avoir peur de la technique ? (G. Gay-Para)
Faut-il avoir peur de la technique ? (G. Gay-Para)
 
Cours de Management des Systèmes d'information
Cours de Management des Systèmes d'informationCours de Management des Systèmes d'information
Cours de Management des Systèmes d'information
 
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdfVulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
Vulnérabilité numérique d’usage : un enjeu pour l’aide à la réussitepdf
 
La Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdfLa Base unique départementale - Quel bilan, au bout de 5 ans .pdf
La Base unique départementale - Quel bilan, au bout de 5 ans .pdf
 
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
Potentiel du Maroc en Produits du Terroir et Stratégie Adoptée pour le dévelo...
 
Apprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceursApprendre avec des top et nano influenceurs
Apprendre avec des top et nano influenceurs
 
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptxDIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
DIGNITAS INFINITA - DIGNITÉ HUMAINE; déclaration du dicastère .pptx
 
Bibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdfBibdoc 2024 - Ecologie du livre et creation de badge.pdf
Bibdoc 2024 - Ecologie du livre et creation de badge.pdf
 

ergonomie

  • 1. » Le contenu et le contenant Introduction > Doivent répondre aux attentes utilisateurs > Doivent y répondre facilement et rapidement www.simaway.com 1 LPRO – Lionel DAMM - 2008
  • 2. » En un coup d’œil, l’internaute doit comprendre le but du site internet >  Site informatif >  Site de vente >  Site communautaire » En un coup d’œil, l’internaute doit comprendre le secteur d’activité >  Le type de produits >  Le positionnement de gamme de l’enseigne www.simaway.com 2 LPRO – Lionel DAMM - 2008
  • 3. » Déterminer les fonctionnalités principales du e- commerce >  Rappel du panier >  Retour à la HomePage GARDER EN TÊTE L’OBJECTIF >  Ajouter au panier PRINCIPAL : >  Les menus de navigation AMELIORER LE TAUX >  Le moteur de recherche DE TRANSFORMATION >  Mon compte >  SAV www.simaway.com 3 LPRO – Lionel DAMM - 2008
  • 5. » Permet d’obtenir une vue globale du site » Permet de segmenter chaque partie Construction du site » Il regroupe l’ensemble des pages du site avec certaines informations clés » C’est un document clé du développement » Elle peut évoluer avec le temps » C’est un des premiers documents créés www.simaway.com »  Voir PDF 5 LPRO – Lionel DAMM - 2008
  • 6. Construction du site 6 LPRO – Lionel DAMM - 2008 www.simaway.com
  • 7. » Construire son menu en fonction de l’arborescence Construction du site » Construire une navigation intuitive pour les visiteurs » Respecter au maximum la règle des 3 clics pour accéder à l’information www.simaway.com 7 LPRO – Lionel DAMM - 2008
  • 8. » Une navigation intuitive ? > Répondre aux attentes des internautes > Faire en fonction du comportement de l’internaute > Prendre en compte l’âge de la cible > Peu importe le niveau de pratique de l’internaute, il doit trouver l’information rapidement ADAPTER LA NAVIGATION OU OFFRIR PLUSIEURS CHOIX www.simaway.com 8 LPRO – Lionel DAMM - 2008
  • 9. » Le cerveau humain est capable d’intégrer plus ou moins 7 éléments dans la mémoire à court terme » Ne pas exagérer sur vos menus de navigation PRÉFÉREZ FAIRE UN MENU AVEC DES SOUS MENUS PLUTÔT QU’UN MENU UNIQUE TROP CHARGÉ www.simaway.com LPRO – Lionel DAMM - 2008
  • 10. » Menus par onglets » Menus déroulants » Listes déroulantes » Zone de recherche » FAQ » Chemin de navigation www.simaway.com 10 LPRO – Lionel DAMM - 2008
  • 11. » Le chemin de navigation (breadcrumbs trail) > Connaître facilement sa position dans le site > Pouvoir facilement revenir à la rubrique supérieure www.simaway.com 11 LPRO – Lionel DAMM - 2008
  • 12. » Faire un plan du site > Plan par catégorie et index alphabétique » Mettre en avant un bouton « Accueil » > Le standard est de mettre ce lien sur le logo du site » Faire des URLs explicites >  http://www.rueducommerce.fr/Ordinateurs/Ordinateur-Portable/Ordinateur- Portable-Professionnel/APPLE/389584-MacBook-Pro-17-2-33GHz-Intel- Core-2-Duo.htm www.simaway.com » Eviter l’utilisation du Flash 12 LPRO – Lionel DAMM - 2008
  • 13. » Les liens > Mettre en avant les liens cliquables •  Couleur, épaisseur, soulignement… > Mettre en avant les liens visités » Offre une navigation plus rapide et plus intuitive » Définir la destination du lien (pdf, externe, www.simaway.com image, langue) 13 LPRO – Lionel DAMM - 2008
  • 15. » Choisir la bonne taille Construction du site » En fonction des statistiques de son lectorat www.simaway.com 15 LPRO – Lionel DAMM - 2008
  • 16. » Choisir la bonne présentation > En fonction du nombre d’informations > Du nombre de menus Construction du site > De la publicité éventuelle » Permet de choisir un navigation à droite ou à gauche » Permet de choisir la largeur des colonnes www.simaway.com 16 LPRO – Lionel DAMM - 2008
  • 17. » Choisir la bonne présentation Construction du site www.simaway.com 17 LPRO – Lionel DAMM - 2008
  • 18. » Choisir la bonne présentation Construction du site www.simaway.com 18 LPRO – Lionel DAMM - 2008
  • 19. » Choisir la bonne présentation Construction du site www.simaway.com 19 LPRO – Lionel DAMM - 2008
  • 20. » Le site doit être accessible pour tous quelque soit : > Le navigateur > L’OS > La taille d’écran / les couleurs > Les plugins installés (flash, quicktime, java…) > La connexion internet www.simaway.com 20 LPRO – Lionel DAMM - 2008
  • 21. » Développer le site sur des standards web d’accessibilité » Utilisation du XHTML et CSS pour l’optimisation des pages > Poids plus léger > Accessibilité pour les non voyants » Lisibilité accrue pour tous www.simaway.com > Limiter l’accès aux plugins externes 21 LPRO – Lionel DAMM - 2008
  • 22. » Structurer l’information > Utiliser des typologies identiques pour les items semblables > Utiliser la même mise en forme •  Couleur, espacement, alignement… > Mettre en avant les éléments importants www.simaway.com > Bien nommer les pages 22 LPRO – Lionel DAMM - 2008
  • 23. » Attention à la compatibilité entre les ordinateurs » Ne pas utiliser de polices « exotiques » » Utiliser uniquement 1 ou 2 polices sur l’ensemble du site » Utiliser des polices standards > Verdana, tahoma, times, lucida, helvetica » Respecter les tailles en fonction : > De l’importance de l’information www.simaway.com > De la hiérarchisation 23 LPRO – Lionel DAMM - 2008
  • 24. » Images ? Animations ? Vidéos ? » Bien choisir ses images en fonction de ses La mise en forme besoins > JPG > PNG > GIF » Flash www.simaway.com > Présentation de produit 24 LPRO – Lionel DAMM - 2008
  • 25. » Image ou couleur » Permet de créer une ambiance » Peut faciliter la lecture La mise en forme » Attention à l’intégration et à la lisibilité » Problème de contraste sur une couleur » Problème d’image et de transparence www.simaway.com 25 LPRO – Lionel DAMM - 2008
  • 26. » Certaines icones ont des significations fortes www.simaway.com 26 LPRO – Lionel DAMM - 2008
  • 28. » Le graphisme du site doit être en accord avec la cible client (couleur, forme, technologie) » Le fond est important mais la forme également. > Elle facilite la lecture > Elle facilite l’adhésion > Elle facilite la reconnaissance > Elle développe l’image > Elle fidélise www.simaway.com 28 LPRO – Lionel DAMM - 2008