ERGONOMIE optimiser une page d'accueil

Transcription

1 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

2 SOMMAIRE NEWS 4 quoi de neuf dans la websphère? LES MOTS 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

3 Edito Crédits Directrice de rédaction Agathe Bonnin Rédaction OPEN21 Crédit photos David Ken Kadal - Fotolia JWM Pap Scanrail Absolutvision OPEN21 Les Docks Numériques 1 promenade du Rhin Dijon RCS 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

4 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. elfes.contact@gmail.com 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: page 4

5 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 matériels qui prépare l'avenir numériques, toujours des plus mobiles! page 5

6 LES MOTS 2.0 Tout s'explique! page 6

7 Followers 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. 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. Short Link Le «short link» est une adresse courte remplaçant une URL trop longue. Cette adresse est composée de seulement quelques caractères. Sur Twitter, ces shorts links sont très utilisés car les tweets sont limités à 140 caractères. 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 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». 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! MON ENTREPRISE SUR TWITTER 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. 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

8 DESIGN les bons points page 8

9 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

10 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

11 MOBILITÉ bien naviguer page 11

12 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

13 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

14

15 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

16 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

17 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

18 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

19 - 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é. page 19

20