Trucs et astuces - ?· Trucs et astuces pour un site beau pratique etpour un site beau, pratique et…

  • View
    212

  • Download
    0

Embed Size (px)

Transcript

  • 26/05/2009

    1

    Trucs et astucespour un site beau pratique etpour un site beau, pratique et efficace

    Un observatoire sur lconomie numrique en Aquitaine

    Lchangeur Bordeaux AquitaineAcclrer lintgration des TIC dans la PME

    http://echangeurba.wordpress.com

    Un service de dmonstrations et de diffusion des usages TIC dans lentreprise

    Le rfrent rgional Passeport Numrique

    Le distributeur local des certificats de signature lectronique Chambersign

    Un service de visio-confrence

  • 26/05/2009

    2

    Prsentation de l'atelier 51 ses services

    Atelier 51www.atelier51.com

    Prsentation de l atelier 51, ses services

    Partenaire Echangeur / CCI

    Partenaire ChamberSign

    Contexte

    1. Les grands prceptes

    Sommaire

    2. Les aspects techniques et fonctionnels

    3. La navigation

    4. Le graphisme

    5. Le contenu

  • 26/05/2009

    3

    ContexteContexteLinternaute aujourdhui

    34 millions dinternautes, soit 63,5% des franais (2009)65% dinternautes achtent en ligne

    Internet en 2008

    g

    186,7 millions de sites Web dans le monde

    97% des cyber-acheteurs sont satisfaits de leur achat

    56% ont consult un site avant dacheter en magasin

    33% se sont rendu en magasin avant dacheter sur Internet

    Sofres avril 2007Mdiamtrie 2009/ Fevad 2008

  • 26/05/2009

    4

    Internet : ce qui a chang

    Il y a encore 10 ans, lInternet tait litiste.

    Aujourd'hui, Internet fait partie de la vie de tous les jours. C'est devenu un outil fonctionnel.

    Pratique, il sera utilis ;

    Mal ais, il n'aura aucun succs.

    Avec la multiplication des sites, les utilisateurs sont de moins en moins tolrants envers ceux difficiles utiliser.

    Chaque erreur de conception peut se traduire par une perte d'activit.

    L'utilisabilit est donc plus importante que jamais.

    Les fondamentaux de lergonomie sont encore trop souvent ngligs

    75% des internautes rencontrent des difficults pour trouver ce quils cherchent sur les sites quils consultent

    Ce quen pensent les internautes

    q 58% sont confronts des problmes de navigation 66% trouvent les contenus des sites souvent mal prsents 47% jugent lallure de la page daccueil peu engageante

    Un site peut perdre en moins dune minute prs de la moiti de ses nouveaux visiteurs ! Et pas de seconde chance : plus de 7 internautes sur 10 ne reviennent pas sur un site o ils ont rencontr des problmes de navigation ou dorientation.des problmes de navigation ou d orientation.

    Benchmark group , janvier 2009

  • 26/05/2009

    5

    Un surfeur averti exigeant

    Un zappeur fou press

    Linternaute aujourdhui

    press intransigeant

    Il vient chercher de linfo. prcise

    oprationnelleexhaustive (tarif, horaires, accs...)

    fiable ( jour)

    L j it f l ti l thti La majorit prfre le pratique lesthtique

    10 secondes, cest le temps moyen dont un site

    Sites Web : les enjeux

    dispose pour convaincre les visiteurs de rester.

    Dans ce laps de temps, l'internaute doit comprendre : qui il a faire

    De quoi a parle Comment naviguerg

  • 26/05/2009

    6

    www.HotkeyServices.fr 11

    Qu'avez-vous vendre, proposer ?

    Avant de se lancer

    Dfinissez bien vos objectifs, vos cibles

    Quel est votre public ?

    Qu'attendez-vous de votre site ?

    Les rponses supposent : une tude de march, de faisabilit, la mise en place dun cahier des charges, davoir rassembl toutes les sources de contenu

    NB L i it d it t i t d dNB : Les visiteurs du site ne sont pas ncessairement des as de l'informatique. Le site doit tre pens pour l'utilisateur le moins expriment

  • 26/05/2009

    7

    1 Grands prceptes

    Ton objectif, tu dfiniras

    La premire question se poser est :A quoi va servir mon site ?

    L t d it d b i d l'i t tLe contenu doit rpondre un besoin de l'internaute utilit globale micro-utilits

    Rassemblez toutes les sources de contenu le site existant les acteurs du projet les concurrents les besoins (supposs ou exprims) de vos clients/internautes

  • 26/05/2009

    8

    Ta cible, tu convoiteras

    Le site doit tre construit en fonction de sa cible :

    Sur internet c'est l'utilisateur qui contrle l'usage du logicielSur internet, c est l utilisateur qui contrle l usage du logiciel Il n'existe pas de solution "prt porter", chaque solution doit tre construite

    "sur mesure" Il faut dterminer le couple utilisateur-utilisation Le site doit tre structur selon le point de vue des utilisateurs viss

    (tri de cartes) La ralisation de mesures ou de tests utilisateurs fournira des apprciations

    objectives pour valuer les choix ergonomiques j p g q

    La main, tu tendras

    Il est important de guider linternaute Explicitement (lgendes, textes explicatifs) Implicitement (organisation visuelle, format)

    Reprage

    tout moment le visiteur doit pouvoir de se reprer

    logo prsent sur toutes les pages, au mme emplacement

    charte graphique uniforme sur l'ensemble des pages

    plan du site prsent

    mentions lgales prsentesg p

    moteur de recherche

  • 26/05/2009

    9

    Ton persona, tu creras

    Un persona est un faux utilisateur cr de toutes pices pour des besoins mthodologiques : il a toutes les caractristiques de votre cible

    Intrt des personaso vous force vous pencher rellement sur votre cibleo humanise votre cibleo donne des objectifs votre cible

    Persona primaire (cur de cible), secondaire (utilisateurs moins frquents) et tertiaire (complmentaires, prescripteurs...)

    Dcrivez vos personas comme des personnes relles (nom, travail, vieDcrivez vos personas comme des personnes relles (nom, travail, vie familiale, habitudes, envies, etc.) et faites-les vivre tout au long du projet

    Tes concurrents, tu utiliseras

    L'analyse concurrentielle consiste aller voir chez les autres ce qu'il y a de bien pour soi...

    Sl ti d' l d t t tif d d i Slection d'un panel de concurrents reprsentatif du domaine :o on prend les bonnes ideso on vite les erreurs

    Pensez rutiliser des ides :o fonctionnelles,o mais aussi terminologiques !

    >> Utilisez les conventions et trouvez les moyens de faire la diffrence !

  • 26/05/2009

    10

    Organis, tu seras

    Le site doit tre bien rang, on doit sy reprer aisment

    Il faut limiter la surcharge visuelle : tout ne sera pas peru Tous les endroits de la page nont pas la mme valeur

    La masse de contenus recueillie doit tre organise pour construire l'architecture de l'information du site. Deux tapes :

    Catgorisation

    Organis, tu seras

    Catgorisation

    Structuration

  • 26/05/2009

    11

    Des standards, tu respecteras

    Vous ntes pas le premier sur Internet

    Lergonomie ne sert pas tre originalL ergonomie ne sert pas tre original

    Il existe des standards et les internautes ont des habitudes

    Tes outils, tu adapteras

    L'ergonomie ne s'apprcie pas en fonction du nombre de fonctionnalits :

    Le site doit rpondre aux attentes de ses utilisateurs.

    Exemple : Google. Site ultra-simplistissime (si, si) qui fait ce qu'on attend de lui trs efficacement. Ce qui lui a valu une grande part de son succs.

    Les outils prsents dans cet atelier seront choisis en fonction de leur pertinence dans le projet

  • 26/05/2009

    12

    Une maquette, tu prpareras

    Prparer une maquette du site aide construire un habillage graphique adapt au contenu.

    La dmarche crative est souvent inverse : on essaye de placer des contenus a y pposteriori dans un habillage finalement trop restrictif.

    Cheminement idal :

    1. Construction du zoning2. Ralisation d'une maquette conceptuelle3. Cration graphique

    Un TRUC, tu construiras

    Pour Jakob Nielsen, grand gourou de la conception web, les bons sites ont tous un TRUC :

    Tlchargement rapide

    Rgularit et frquence des mises jour

    Utilisation facile du site

    Contenu de qualit (et utile aux visiteurs)

  • 26/05/2009

    13

    2 Aspects techniques et fonctionnels

    Les pages pousent-elles bien les crans ?

    Laffichage

    A tous, tu seras accessible

    L affichage

    La conception de page sur une largeur de 760 pixels est prfrable (760x400).

    On peut conseiller aussi de prvoir une interface extensible. Si ce nest pas le cas, il faut rflchir sur la gestion de lespace lors de rsolutions suprieures 800x600.

  • 26/05/2009

    14

    Frames en 800/600

    En 1280/1024, le contenu occupe 30

    % de lespace !

  • 26/05/2009

    15

    Et ct navigateur ?

    Un site web pourra se comporter diffremment sur IE ou Firefox, sur PC ou sur Mac. Cela va de petites variations visuelles de rels dysfonctionnements.

    A tous, tu seras accessible

    Il faut donc tester et corriger toutes les pages sur diffrentes combinaisons de navigateurs et de plate-formes.

    Utiliser les systmes de

    A connatre tes visiteurs, tu tappliqueras

    mesures des visiteurs d'un site fournit une multitude d'informations prcieuses pour amliorer l'ergonomie d'un site.

    Exemple Google Analytics :

  • 26/05/2009

    16

    A demain, tu penseras

    Danimations folles, tu nabuseras pas

    Les introductions FLASH provoquent lirritation des utilisateurs dans leur grosse majorit ( utiliser avec parcimonie !).

    Le recours au multimdia est loin dtre ncessaire dans tous les cas et peut conduire une impression d'agitation qui donne envie d'aller se reposer ailleurs.

    Cela pose une srie de problmes (la compatibilit, lerg