Design internet, un graphisme mobile
La première étape pour la conception graphique d’un site web consiste, comme pour une identité visuelle, à bien connaître et comprendre son client, vous. Cela nous permettra de définir votre identité de marque et vos cibles. C’est une étape indispensable, elle m’aiguillera pour définir les éléments graphiques (formes, typographies, couleurs, iconographie) qui serviront à créer le graphisme de votre site internet. L’ambiance visuelle de votre site doit vous représenter et aussi séduire vos cibles.
L’utilisabilité (l’expérience utilisateur) de votre site est un des points à ne pas négliger. Pour cela, un site web doit être conçu en intégrant une bonne ergonomie, vos visiteurs doivent trouver, en minimisant le nombre de clics, ce qu’ils cherchent. Une ergonomie efficiente passe par un rubricage réfléchi, un cheminement intuitif, une hiérarchie visuelle adéquate, une accessibilité irréprochable et tous ces aspects seront renforcés par une conception graphique claire et pertinente.
Je pense également au moment de la conception graphique à intégrer la composante responsive design en anticipant certains éléments qui seront redesigné ou éliminé au moment du passe sur petits écrans de type smartphone.
N’oubliez pas de rédiger des textes optimisés pour les moteurs de recherche (SEO), qui renforceront le fameux référencement naturel. Deux règles : dévoilez rapidement l’objet principal de votre texte et accompagnez-le de mots clés pertinents.
La conception graphique du site d’Action First
Toujours dans le cadre de la refonte de l’image de cet organisme de formation, j’ai conçu ce nouveau site en partenariat avec le développeur avec lequel j’ai l’habitude de travailler.
Ce type de site fourmille d’informations et l’idée pricipale qui a mené mon graphisme était de proposer quelque chose d’aussi clair et hiérarchisé que possible.
J’ai utilisé les couleurs de la charte graphique, sur une base de blanc et avec l’appui d’un gris clair.
Pour minimiser les textes superflus j’ai eu recours à l’utilisation de pictogrammes, leur simplicité de compréhension et le peu place qu’ils occupent m’ont permis de gagner en lisibilité et d’ahérer le contenu.
Pour le texte lui même j’ai employé la typographie Roboto, une linéale sobre et efficace pour renforcer la lisibilité en jouant beaucoup sur les tailles employée pour hiérarchiser les informations.
Pour ce site le contenu textuel n’a pas été difficile à produire puisqu’il découle en grande partie des fiches formations proposées par les formateurs et d’actualité mise à jour régulièrement.
Dans le cadre de l’expérience utilisateur, des choix ont été faits d’après les directives du client. Il s’agissait principalement d’accéder le plus rapidement possible à des formations, ce qui explique le moteur de recherche dans le header, présent sur tout le site. Et nous avons renforcé cet outil en proposant un moteur à base de menus déroulants sur l’image principal de la page d’accueil. Enfin, trois formations sont proposées juste en dessous. Cela fait pas moins de trois façons de découvrir le catalogue très fourni proposé par Action First.
Ce site a bien entendu été pensé et conçu de manière à s’adapter à tous les types d’écrans (responsive design).