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

LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...
LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...
LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...Faga1939
 
Grammaire pour les élèves de la 6ème.doc
Grammaire pour les élèves de la  6ème.docGrammaire pour les élèves de la  6ème.doc
Grammaire pour les élèves de la 6ème.docKarimKhrifech
 
666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx
666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx
666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptxSAID MASHATE
 
systeme expert_systeme expert_systeme expert
systeme expert_systeme expert_systeme expertsysteme expert_systeme expert_systeme expert
systeme expert_systeme expert_systeme expertChristianMbip
 
presentation l'interactionnisme symbolique finale.pptx
presentation l'interactionnisme symbolique  finale.pptxpresentation l'interactionnisme symbolique  finale.pptx
presentation l'interactionnisme symbolique finale.pptxMalikaIdseaid1
 
SUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptx
SUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptxSUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptx
SUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptxssuserbd075f
 
Approche-des-risques-par-l’analyse-des-accidents-1.pptx
Approche-des-risques-par-l’analyse-des-accidents-1.pptxApproche-des-risques-par-l’analyse-des-accidents-1.pptx
Approche-des-risques-par-l’analyse-des-accidents-1.pptxssusercbaa22
 
gestion des conflits dans les entreprises
gestion des  conflits dans les entreprisesgestion des  conflits dans les entreprises
gestion des conflits dans les entreprisesMajdaKtiri2
 
Boléro. pptx Film français réalisé par une femme.
Boléro.  pptx   Film   français   réalisé  par une  femme.Boléro.  pptx   Film   français   réalisé  par une  femme.
Boléro. pptx Film français réalisé par une femme.Txaruka
 
La nouvelle femme . pptx Film français
La   nouvelle   femme  . pptx  Film françaisLa   nouvelle   femme  . pptx  Film français
La nouvelle femme . pptx Film françaisTxaruka
 
Présentation de cartes d'extension zhr..pptx
Présentation de cartes d'extension zhr..pptxPrésentation de cartes d'extension zhr..pptx
Présentation de cartes d'extension zhr..pptxpopzair
 
Fondation Louis Vuitton. pptx
Fondation      Louis      Vuitton.   pptxFondation      Louis      Vuitton.   pptx
Fondation Louis Vuitton. pptxTxaruka
 
COURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdf
COURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdfCOURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdf
COURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdfabatanebureau
 
MaintenanceLa Maintenance Corrective.ppt
MaintenanceLa Maintenance Corrective.pptMaintenanceLa Maintenance Corrective.ppt
MaintenanceLa Maintenance Corrective.pptssusercbaa22
 
Formation M2i - Intelligence Artificielle Comment booster votre productivité ...
Formation M2i - Intelligence Artificielle Comment booster votre productivité ...Formation M2i - Intelligence Artificielle Comment booster votre productivité ...
Formation M2i - Intelligence Artificielle Comment booster votre productivité ...M2i Formation
 
A3iFormations, organisme de formations certifié qualiopi.
A3iFormations, organisme de formations certifié qualiopi.A3iFormations, organisme de formations certifié qualiopi.
A3iFormations, organisme de formations certifié qualiopi.Franck Apolis
 
Mécanique Automobile LE TURBOCOMPRESSEUR.ppt
Mécanique Automobile LE TURBOCOMPRESSEUR.pptMécanique Automobile LE TURBOCOMPRESSEUR.ppt
Mécanique Automobile LE TURBOCOMPRESSEUR.pptssusercbaa22
 
MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdf
MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdfMICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdf
MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdfssuser40e112
 

Dernier (20)

LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...
LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...
LA MONTÉE DE L'ÉDUCATION DANS LE MONDE DE LA PRÉHISTOIRE À L'ÈRE CONTEMPORAIN...
 
Grammaire pour les élèves de la 6ème.doc
Grammaire pour les élèves de la  6ème.docGrammaire pour les élèves de la  6ème.doc
Grammaire pour les élèves de la 6ème.doc
 
666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx
666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx
666148532-Formation-Habilitation-ELECTRIQUE-ENTREPRISE-MARS-2017.pptx
 
systeme expert_systeme expert_systeme expert
systeme expert_systeme expert_systeme expertsysteme expert_systeme expert_systeme expert
systeme expert_systeme expert_systeme expert
 
presentation l'interactionnisme symbolique finale.pptx
presentation l'interactionnisme symbolique  finale.pptxpresentation l'interactionnisme symbolique  finale.pptx
presentation l'interactionnisme symbolique finale.pptx
 
SUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptx
SUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptxSUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptx
SUPPORT DE SUR COURS_GOUVERNANCE_SI_M2.pptx
 
Approche-des-risques-par-l’analyse-des-accidents-1.pptx
Approche-des-risques-par-l’analyse-des-accidents-1.pptxApproche-des-risques-par-l’analyse-des-accidents-1.pptx
Approche-des-risques-par-l’analyse-des-accidents-1.pptx
 
gestion des conflits dans les entreprises
gestion des  conflits dans les entreprisesgestion des  conflits dans les entreprises
gestion des conflits dans les entreprises
 
Boléro. pptx Film français réalisé par une femme.
Boléro.  pptx   Film   français   réalisé  par une  femme.Boléro.  pptx   Film   français   réalisé  par une  femme.
Boléro. pptx Film français réalisé par une femme.
 
La nouvelle femme . pptx Film français
La   nouvelle   femme  . pptx  Film françaisLa   nouvelle   femme  . pptx  Film français
La nouvelle femme . pptx Film français
 
Evaluación Alumnos de Ecole Victor Hugo
Evaluación Alumnos de Ecole  Victor HugoEvaluación Alumnos de Ecole  Victor Hugo
Evaluación Alumnos de Ecole Victor Hugo
 
Présentation de cartes d'extension zhr..pptx
Présentation de cartes d'extension zhr..pptxPrésentation de cartes d'extension zhr..pptx
Présentation de cartes d'extension zhr..pptx
 
Fondation Louis Vuitton. pptx
Fondation      Louis      Vuitton.   pptxFondation      Louis      Vuitton.   pptx
Fondation Louis Vuitton. pptx
 
COURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdf
COURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdfCOURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdf
COURS SVT 3 EME ANNEE COLLEGE 2EME SEM.pdf
 
Pâques de Sainte Marie-Euphrasie Pelletier
Pâques de Sainte Marie-Euphrasie PelletierPâques de Sainte Marie-Euphrasie Pelletier
Pâques de Sainte Marie-Euphrasie Pelletier
 
MaintenanceLa Maintenance Corrective.ppt
MaintenanceLa Maintenance Corrective.pptMaintenanceLa Maintenance Corrective.ppt
MaintenanceLa Maintenance Corrective.ppt
 
Formation M2i - Intelligence Artificielle Comment booster votre productivité ...
Formation M2i - Intelligence Artificielle Comment booster votre productivité ...Formation M2i - Intelligence Artificielle Comment booster votre productivité ...
Formation M2i - Intelligence Artificielle Comment booster votre productivité ...
 
A3iFormations, organisme de formations certifié qualiopi.
A3iFormations, organisme de formations certifié qualiopi.A3iFormations, organisme de formations certifié qualiopi.
A3iFormations, organisme de formations certifié qualiopi.
 
Mécanique Automobile LE TURBOCOMPRESSEUR.ppt
Mécanique Automobile LE TURBOCOMPRESSEUR.pptMécanique Automobile LE TURBOCOMPRESSEUR.ppt
Mécanique Automobile LE TURBOCOMPRESSEUR.ppt
 
MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdf
MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdfMICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.pdf
MICROBIOLOGIE ENDODONTIQUE english and frensh 25 nov 2020.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