Améliorer votre site – 10 pistes à explorer
Pourquoi attendre qu’un site devienne obsolète pour le changer ou l’améliorer? La promesse de tout CMS est de séparer le contenu du contenant.
Pourtant, combien de fois avez-vous changé de contenant? La réponse est souvent: jamais.
Le nouveau site d’Enigma a été lancé en février 2012. En un an, nous avons connu tant de développements, A/B testé tant d’options qu’il était devenu nécessaire de réaliser une nouvelle version pour garder notre plate-forme web à jour.
Toute l’équipe d’Enigma est heureuse de partager avec vous quelques-unes des améliorations que nous avons faites pour que vous puissiez les reproduire sur votre présence web.
Bienvenue sur la version 1.2 d’enigmaprod.ch
1/ Menu flottant
Le menu du site vous suit. Plus besoin de retourner en haut ou en bas du site pour accéder à l’une des barres de navigation, elle est toujours là pour faciliter les déplacements.
2/ Ajout de mouvement sur mobile
Les menus prennent beaucoup de place sur un mobile. Même le système de roulette n’est pas très agréable. D’un swipe de gauche à droite vous accédez au menu et de droite à gauche aux contacts. Ce comportement tend à se généraliser sur les applications de type Facebook ou Google+. Pourquoi ne pas s’en inspirer ?
3/ Pictogrammes
Que ce soit pour les contacts ou le menu hamburger, les pictogrammes donnent une information en une image. On peut aussi affiner leur design et les unifier pour augmenter la cohérence de la marque.
4/ Affiner la grille de lecture
Utiliser des boxes ou des ombres pour signifier un bouton, ou imiter une enveloppe pour un formulaire de contact sont souvent des solutions de facilité. Mais sans eux, un site peut sembler manquer de clarté. Une conclusion hâtive dirait que le skeuomorphisme permet de rendre plus accessible et plus compréhensible le site web. En fait, c’est la preuve que l’architecture du site n’est pas assez constante et qu’on a besoin des artifices du design pour cacher des faiblesses fonctionnelles de maquette.
En travaillant sur les espaces négatifs et en noir et blanc, on peut s’assurer que le design est clair. On doit aussi unifier la grille sur toutes les pages pour que les colonnes et les gouttières soient toujours au même endroit.
grid system enigma service
5/ Taille des textes
Les grands écrans se placent plus loin des yeux ; il faut donc augmenter la taille des caractères.
6/ Une seule manière de naviguer par type de contenu
La tentation peut être grande de réviser le design de chaque page. La manière de naviguer doit être cohérente et s’adapter au type de contenu.
Voici différents types de contenu :
A/ Blog
Il faut privilégier une présentation des articles invitant à la lecture, en perturbant le moins possible le texte. A partir de Y pixel, une colonne de gauche présente les autres articles de la même catégorie. Le but n’est pas seulement de proposer une suite de lecture, mais surtout de limiter la longueur des lignes et de rendre la lecture plus agréable.
B/ Services
Les pages sont conçues pour présenter en un coup d’œil plusieurs articles appartenant à un même thème, créant ainsi une unité. Les textes peuvent être rédigés sur deux colonnes pour rendre la lecture plus rapide et plus efficace.
C/ Nouveautés
Le but est d’identifier plus vite les nouveaux projets présentés en star en haut.
Vous pouvez afficher cette page de deux manières, en images seulement, ou en images avec un titre.
7/ Chargement automatique des postes
Arrivé au bas de la page, le chargement des postes est lancé automatiquement, aussi bien dans le blog que dans les réalisations.
Le concept de page est d’ailleurs assez étrange sur Internet ; il tend de plus en plus a disparaitre. Le Newsfeed de Facebook ou de Twitter n’a pas de pagination. Le seul endroit où la pagination reste de mise est peut être google.com. Mais même la recherche d’image est en train d’abandonner les « pages ». Il ne sera pas surprenant de remarquer le même changement dans les recherches classiques.
8/ Vitesse
Comme la vitesse est importante pour les internautes et pour google, il faut optimiser les processus de manière à offrir un contenu toujours aussi beau et richement illustré, mais encore plus rapidement.
9/ Retina
Vous avez un écran Retina? Nous avons pensé à vous. Tous les pictogramme et tous les logos du site ont deux versions, Retina et classique. Les images ne sont pas encore optimisées en mode Retina car aucun système ne nous a convaincu comme étant rapide et efficace. Ce sera dans la prochaine version. Mais si vous regardez bien, vous verrez que certains modules sont en train d’être testés sur certaines pages.
10/ CDN
Pour améliorer la vitesse, la disponibilité et l’accès également international, on peut mettre en place un service de Content Delivery Network. De cette manière vous consultez toujours le site comme s’il était hébergé près de chez vous.