ERGONOMIE optimiser une page d`accueil

Infos & conseils pour votre site
mars 2012
DESIGN
les bonnes idées à piocher et
les erreurs à éviter
MOBILITÉ
offrir une bonne expérience
utilisateur
JOOMLA
la dernière version
toutes les nouveautés de
la version 2.5
ERGONOMIE
optimiser une page d'accueil
SOMMAIRE
NEWS
4 quoi de neuf dans la websphère
?
LES MOTS 2.0
6 décryptage de 3 nouveaux mots
du web 2.0
DESIGN
8 bonnes idées à piocher et
erreurs à éviter
MOBILITÉ
11 offrir une bonne expérience
utilisateur en mobilité
ERGONOMIE
14 optimiser une page d'accueil de
site web
JOOMLA
16 suivez les nouveautés apportées
par la version 2.5
ON EN PARLE
18 la gestion électronique de
documents
page 2
Edito
Crédits
Directrice de rédaction
Agathe Bonnin
Rédaction
OPEN21
Crédit photos
www.photo-libre.fr
David Ken
Kadal - Fotolia
JWM Pap
Scanrail
Absolutvision
OPEN21
Les Docks Numériques
1 promenade du Rhin
21000 Dijon
RCS 497 537 712
Un printemps pour agir
Nous entrons dans le printemps, période propice aux
grands nettoyages en tous genres ! Et si c'était aussi le
moment de faire le ménage dans votre communication
numérique ?
En matière de design ou d'ergonomie, repenser sa page
d'accueil pour l'optimiser... Il n'est jamais trop tard pour
bien faire les choses et pour agir !
Ce numéro vous propose des éléments de réflexion et
des conseils pour éviter les erreurs et adopter les bonnes
pratiques en design, en ergonomie de page d'accueil et
en matière de mobilité.
C'est aussi pour moi l'occasion de vous présenter les
principales nouveautés qui apparaissent sur Joomla 2.5
par rapport à la version 1.5.
Et vous retrouvez vos rubriques d'actualités, les Mots
2.0, et l'interview, bien sûr.
Bonne lecture.
Agathe Bonnin
Directrice OPEN21
page 3
NEWS ECO & TECH
EN BOURGOGNE
Les ELFES
Cette association de femmes chefs
d'entreprises et d'influence a été créée il
y a quelques mois en Côte d'Or.
[email protected] et Facebook
Atelier E-commerce
Quels sont les facteurs clés de succès
qui transforment un visiteur en acheteur?
Quelles sont les bonnes pratiques de la
vente en ligne, les implications légales?
Un atelier gratuit vous est proposé par
l'Espace Numérique Professionnel de
l'Yonne pour tout savoir !
16 avril de 15h à 17h, CCI d'Auxerre
Salon Apprentissimo
Le rendez-vous récurrent des jeunes en
apprentissage et des entreprises de Côte
d'Or se déroule les 18 et 19 avril au
Palais des Congrès de Dijon. Multimédia,
conseils,
métiers,
recrutement,
animations et tables rondes rythment ces
rencontres durant deux jours. Plus d'info:
www.apprentissimo-bourgogne.fr
page 4
QUOI DE 9
SUR LE WEB ?
CNIL: Campagne de sensibilisation
Une vidéo met en scène des personnes
en situation de publier ou pas des
éléments privés sur internet. Vidéo à voir
sur YouTube.
Publicité très ciblée
Grâce à un brevet déposé par Google,
les annonceurs pourront bientôt envoyer
des publicités ciblées en fonction de
l'environnement de l'utilisateur d'un
smartphone : température, lumière, son,
composition de l'air, etc.
Interfaces des ordinateurs
La prochaine sortie de Windows 8
montre à quel point les interfaces des
ordinateurs se rapprochent de celles des
smartphones : icônes, navigation... Une
tendance qui prépare l'avenir des
matériels numériques, toujours plus
mobiles !
page 5
LES MOTS 2.0
Tout s'explique !
page 6
Followers
Short Link
Le mot anglais « Followers » signifie
en français « Suiveurs ».
Ce terme est utilisé sur le réseau
social Twitter. Les « followers » sont
les personnes qui sont abonnées à vos
actualités, et qui suivent donc toutes
vos publications, autrement dit, vos
tweets.
Le « short link » est une adresse
courte remplaçant une URL trop
longue. Cette adresse est composée
de seulement quelques caractères.
On peut bien sûr être soi-même un
suiveur, en s'abonnant aux nouvelles
d'une personne ou d'une entreprise.
Vous verrez apparaître toutes les
dernières publications (tweets) du
compte que vous suivez.
Des sites comme tinyurl.com ou
bitly.com fournissent de tels services.
Une extension peut être ajoutée à
votre navigateur pour raccourcir en un
clic toutes les URL que vous
souhaitez.
NSFW
MON ENTREPRISE SUR TWITTER
Sur les réseaux sociaux, comme
Twitter, vous avez peut-être déjà
remarqué ces 4 lettres qui semblent
bien énigmatiques. En fait, cet
acronyme vient de l'anglais « Not Safe
For Work » qui signifie « Ne Pas Ouvrir
Au Travail ».
Après 6 années d'existence, Twitter
commence à séduire de plus en plus
d'entreprises. Elles y voient en effet un
moyen pratique et concret de rester en
contact avec leurs clients et leurs
cibles.
Généralement, il est suivi d'un lien vers
un contenu qui n'est pas vraiment
approprié
dans
un
contexte
professionnel. Il tient donc lieu
d'avertissement.
En effet, si vous êtes sur votre lieu de
travail, proche de vos collègues,
associés ou clients, il est conseillé de
ne pas cliquer sur le lien qui porte cette
mention !
Sur Twitter, ces shorts links sont très
utilisés car les tweets sont limités à
140 caractères.
Ce réseau social a d'abord accroché
les geeks et les personnes dotées d'un
sens aigü de la communication :
blogueurs, spécialistes du marketing,
etc.
Puis,
cette
population
a
naturellement
attiré
journalistes,
publicitaires et politiques, avant
d'entrer de plein pied dans l'entreprise
aujourd'hui.
page 7
DESIGN
les bons points
page 8
Bonnes idées et
erreurs de design web
M
ême si les goûts ne se discutent pas, paraît-il, le design d'un site
ne doit pas être vu comme une affaire personnelle ! En effet, peu
importent vos propres goûts, vos couleurs préférées. Ce qui va
compter au final, c'est le sentiment des utilisateurs de votre site.
“Que ressent-on en voyant un site, sans
même regarder ses contenus ?”
Ce sentiment est donné au premier coup d'oeil, dès l'arrivée sur un site web,
grâce à l'impact émotionnel véhiculé par le design. Que ressent-on en voyant
un site, sans même regarder ses contenus : de la peur ? un bien-être ? de la
chaleur ?
Cet impact est donné à la fois par le choix des couleurs et des visuels. Pour
créer une impulsion positive, rien de mieux qu'une belle photo.
Le choix du type de visuel va dépendre de l'élément que l'on souhaite faire
ressortir en premier. Si c'est le contact humain qui prime, on peut placer un
visuel avec des plans resserrés sur des parties du visage ou des mains, par
exemple. Si c'est l'esprit d'ouverture que l'on veut mettre en avant, un paysage
panoramique urbain ou naturel fonctionne bien. Pour le site d'une boutique, il
n'y a pas de meilleur choix que de mettre en valeur les produits vendus.
Attention, trop souvent des photos de produits de mauvaise qualité et à la
réalisation approximative ont un impact très négatif sur l'utilisateur du site. Il
est préférable d'investir quelques centaines d'euros dans une prise de vue
réalisée par un photographe professionnel.
Le soin apporté à la qualité des visuels du site (photos, illustrations, plans,
graphiques...) est un des éléments les plus importants, car il va rassurer
l'utilisateur sur le professionnalisme et la fiabilité de l'entreprise.
page 9
Le design général du site doit rester
cohérent avec les valeurs véhiculées
par l'entreprise.
On optera alors plutôt pour un design
minimaliste et très épuré pour exprimer
la rigueur et la sécurité, ou bien des
couleurs vives et toniques pour
exprimer la convivialité.
Outre les couleurs, les éléments du
design, tels que les boutons, icônes,
menus, doivent également être en
accord avec le style de design choisi.
Pour qu'un site reste agréable à
regarder et à naviguer, mieux vaut
éviter toute surenchère, en matière de
design.
Veillez à ce que les polices d'écriture
soient simples et lisibles avant tout. De
même, oubliez les animations Flash à
profusion, les images et icônes qui
clignottent ou sautillent.
Car n'oubliez pas que le design est au
service de vos produits ou vos
prestations. Il doit les mettre en valeur
et pas les écraser...
“Le design est au service de vos produits ou
vos prestations. Il doit les mettre en valeur.”
Le style peut être fantaisie, strict,
contemporain, etc. C'est alors à
l'ensemble des éléments du site et des
couleurs de dégager l'impression
voulue.
De manière générale, quelque soit le
style graphique que l'on souhaite
donner à son site, il est préférable
d'éviter la surcharge d'images, de
logos et de visuels. Au risque sinon
que l'utilisateur ne sache plus où
regarder !
Attention également au poids des
images et des photos intégrées au site.
Inutile d'alourdir le site avec des
images sorties tout droit d'un appareil
photo numérique, lorsqu'elles pèsent
encore plus d'1 Mo chacune !
Il est préférable de limiter les effets
graphiques trop complexes ou trop
nombreux. L'ensemble du design du
site doit servir à inviter les utilisateurs
à en savoir plus sur vos compétences,
vos produits. Ne les aveuglez pas avec
un design trop fort et trop présent.
Le design doit correspondre aussi au
public visé et au type de produits ou
services vendus. Si vous vendez des
produits tendances, destinés à un
public jeune et urbain, cela doit se
ressentir immédiatement sur le site :
des couleurs sobres comme le gris et
le noir, ponctuées de touches de
couleurs peps, par exemple.
Le tout est de donner la bonne
impression, dès la première fois !
page 10
MOBILITÉ
bien naviguer
page 11
Offrir une bonne
expérience utilisateur
N
ous sommes plus de 45 millions de français à utiliser un téléphone
mobile, et la part des consommateurs utilisant un smartphone pour
naviguer sur internet est sans cesse plus importante.
“L'idée est de proposer une offre
commerciale ultra-ciblée.”
C'est pourquoi une entreprise doit aujourd'hui se préoccuper d'accueillir au
mieux les utilisateurs en mobilité.
On entend souvent parler indistinctement d'application mobile et de site
mobile. La différence est pourtant très grande. Une application est un logiciel,
spécifiquement développé pour fonctionner sur un système d'exploitation
mobile : Iphone ou Androïd, par exemple. Un site mobile est une version
optimisée du site web de l'entreprise, qui rendra la navigation sur un
smartphone agréable. L'application a des inconvénients non négligeables.
D'une part elle oblige l'utilisateur à télécharger le logiciel, et à le mettre à jour
régulièrement. D'autre part, le développement même de l'application la rendra
non compatible d'un système à l'autre. Il faut alors développer une application
pour Iphone et une autre pour Androïd, afin de toucher un maximum de public.
Un site web mobile est plus flexible et plus simple à mettre en place pour les
entreprises. Il sera accessible à tous les utilisateurs de smartphone, quelque
soit leur système ou leur navigateur. De plus, une mise à jour du site web de
l'entreprise est immédiatement visible sur la version mobile.
En réalité, un site web mobile est une adaptation de la navigation du site
classique : tailles des polices et des photos, boutons, icônes, menus, tout est
redimensionné et disposé de façon à être aisément navigable sur un petit
écran. Pour faciliter l'expérience mobile de l'utilisateur d'un site, il faut
concentrer son attention sur les menus permettant d'accéder aux différentes
pages, et favoriser une disposition des éléments en hauteur.
page 12
En effet, un site web est souvent
conçu selon un format "paysage" qui
correspond à l'orientation des écrans
d'ordinateurs. A l'inverse, sur un
téléphone mobile on navigue plutôt
selon un format "portrait".
Il ne faut pas oublier que les
animations Flash ne sont pas
accessibles aux possesseurs d'Iphone,
donc mieux vaut l'oublier pour une
expérience
utilisateur
idéale.
Aujourd'hui, de plus en plus de CMS
tels que Joomla ou WordPress
proposent des facilités de configuration
d'un site mobile, en complément du
site dans sa version classique.
Ci-contre, le site Google Play, la
nouvelle boutique pour télécharger des
applications pour système Androïd, qui
va remplacer Androïd Market.
page 13
Optimiser
une page d'accueil
L
a page d'accueil d'un site est bien souvent la plus
visitée par les utilisateurs. C'est donc un aspect
essentiel du site, auquel les entreprises attachent
beaucoup d'importance. C'est une bonne raison pour
l'optimiser, la travailler et y apporter du soin.
Différents types de pages d'accueil sont réalisables, en fonction des objectifs
et de la cible recherchée. Toutefois, il y a quelques erreurs à ne pas
commettre.
La première erreur, mais qui se voit heureusement de moins en moins,
consiste à créer une pré-page d'accueil.
En effet, une page qui demande à l'utilisateur de cliquer sur une image ou une
animation pour entrer dans le site est aussi efficace qu'une porte fermée pour
inciter à entrer dans une boutique ! Une page d'accueil doit véritablement
accueillir l'utilisateur et l'accompagner dans sa navigation et sa découverte de
l'entreprise.
La deuxième erreur consiste à vouloir une page d'accueil très esthétique,
uniquement composée de photos, et sans textes. D'une part ce type de page
d'accueil ne permet pas à l'utilisateur de bien comprendre les produits ou
services proposés par l'entreprise. D'autre part, elle est un vrai frein au
référencement naturel par les moteurs de recherche.
Sur une page d'accueil, mettre un peu de texte est toujours préférable. Celui-ci
peut présenter l'entreprise, mettre en avant ses produits phares ou ses
principaux services, tout en permettant l'accès à des pages d'explications plus
détaillées.
Le ou les menus du site doivent également être accessibles dès la page
d'accueil, et rester aux mêmes emplacements sur tout le site. La page
d'accueil peut aussi mettre en valeur certains aspects importants de
l'entreprise : labels ou certifications, prix ou récompenses gagnées, etc. Dans
le cas du site d'un commerce, on peut afficher les nouveaux produits et
promotions dès la page d'accueil. D'autres éléments faisant partie intégrante
de la communication de l'entreprise peuvent venir se placer sur la page
d'accueil : actualités, conseils, dernier article du blog professionnel, ainsi que
des liens vers les réseaux sociaux de l'entreprise.
Une bonne page d'accueil, c'est comme un bon hall d'entrée dans un
bâtiment: il doit être plaisant et conduire facilement aux différentes pièces !
page 15
Les nouveautés de
Joomla 2.5
L
a nouvelle version de Joomla est une version avec un
support à long terme. Cela signifie que cette version
2.5 bénéficiera d'un support et de mises à jour
régulières pendant au moins 18 mois.
Des
améliorations notables y ont été apportées.
Certaines de ces améliorations étaient déjà présentes dans les versions à
support court précédentes, la 1.6 et la 1.7. S'il n'est pas possible de lister ici
toutes les nouveautés apportées à cette nouvelle version par rapport à la 1.5,
en voici cependant les principales.
Des sites multilingues plus faciles
Joomla 2.5 permet de créer des sites en plusieurs langues plus facilement.
Menus, contenus, formulaires de contacts peuvent bénéficier d'une traduction
dans la langue de votre choix, en y ajoutant vos propres contenus traduits,
naturellement.
La création de multisites
Joomla 2.5 est un CMS bien approprié pour créer un site multiple. C'est-à-dire
que vous pouvez créer plusieurs sites en un, avec un design différent pour
chaque. Cette fonctionnalité peut être utilisée par exemple par une fédération
qui doit mettre en ligne à la fois un portail web généraliste et un sous-site web
pour chacune de ses associations. Chaque site d'association aura alors ses
propres couleurs, son propre logo et ses contenus spécifiques, le tout étant
unifié dans une administration commune.
Meilleure gestion des groupes d'utilisateurs
Il est désormais possible de créer des groupes d'utilisateurs, et de fixer un
niveau d'autorisation pour chaque groupe. Ainsi une entreprise peut créer un
groupe Clients, qui accèdera simplement à des contenus qui lui sont réservés;
un groupe Communication, qui permettra au service communication de
modifier les contenus qui le concernent, etc.
Catégories récursives
Par rapport à la version 1.5, les sections ont été supprimées au profit des
seules catégories. On peut créer autant de catégories et de sous-catégories
que nécessaire, ce qui permet de créer plus facilement une bonne
arborescence de site.
page 16
Meilleure gestion de
l'autopublication
Auparavant, on pouvait seulement prépublier et dépublier automatiquement
les articles. Désormais on peut décider
également de la publication
automatique des modules, menus,
composants, au jour et à l'heure
choisis.
Un référencement amélioré
Enfin, la grande innovation de la
version 2.5 de Joomla est une
optimisation des possibilités de
référencement naturel du site.
Pour en savoir plus : joomla.org
Ci-dessus, le panneau d'administration
de Joomla 2.5
page 17
ON EN PARLE
La GED...
Tony Galmiche, Dirigeant de InfoSaône, nous
explique la Gestion Electronique de Documents
On entend parler de plus en plus de
Gestion Electronique de Documents
(GED). En quoi cela consiste-t-il ?
Tout d'abord, il existe deux grandes
catégories de GED :
1 - celle destinée à l'archivage sous
forme électronique des documents
dans le but principal de gagner de la
place et de permettre la consultation
par plusieurs personnes en même
temps. Ce type de GED sert
essentiellement pour archiver les
factures ou les fiches de paies.
2 - celle destinée à organiser le
processus de suivi et de validation de
tout type de documents. Ce type de
GED intègre un système permettant de
paramétrer des workflows (cycles de
vie) pour chaque type de document à
traiter. Ce type de GED permet
également de paramétrer des champs
pour classifier les documents. Pour
finir l'accès aux documents dépend de
plusieurs
paramètres
(type
de
document, état dans le cycle de vie,
...).
InfoSaône est spécialisée dans la mise
en œuvre du deuxième type de GED.
InfoSaône utilise exclusivement des
logiciels libres et en particulier le
logiciel
Dynacase.
Ce
système
s'installe sur un serveur sous Linux,
mais les utilisateurs n'ont besoin que
d'un navigateur pour y accéder (mode
web). Ce système permet par exemple
de gérer les plans d'actions, les
processus qualité, la documentation
technique, le suivi des devis, les
réclamations, la gestion du courrier
entrant ou sortant,...
Quels types d'entreprises peuvent
utiliser un système de GED ?
Toutes les entreprises intéressées par
une structuration de leurs informations.
page 18
- gérer les processus de suivi et de
validation des documents (workflow)
- retrouver facilement les documents
- historique des modifications des
documents
- accès à distance aux documents
(mode web)
- accès sécurisé aux documents en
fonction des droits définis et de son
état dans le workflow (ex : un
document validé ne doit plus être
modifiable)
Avant la mise en place d'une GED, les
documents sont en général traités
avec les outils bureautiques (Office ou
OpenOffice) mais cela ne permet
aucun suivi, aucune validation et la
recherche
des
informations
est
souvent laborieuse.
Comment la GED modifie-t-elle la
manière
de
communiquer
et
d'échanger au sein d'une entreprise ?
La GED permet :
- de limiter la manipulation du papier
car le document est consultable
électroniquement
“La GED organise le processus de suivi et de
validation de tout type de documents.”
La GED permet de résoudre tous ces
problèmes.
InfoSaône
travaille
avec
des
entreprises de 5 à 2000 salariés du
domaine public ou privé.
Quels sont les principaux avantages
de la mise en place d'un système de
GED ?
Voici les 5 principaux avantages:
- de relancer automatiquement le
responsable des actions à réaliser sur
les documents en fonction des dates
indiquées
- un accès à distance aux documents
lors des déplacements ou pour les
entreprises multi-sites
- de sécuriser l'accès aux documents
aux
personnes
autorisées
et
d'historiser leurs modifications pour
une meilleure traçabilité.
www.infosaone.com
page 19