Web Design : Définition et termes à connaître

Web Design : Définition et termes à connaître

Le web design, par définition, est l’art de créer des sites web adaptatifs (responsive). C’est donc plus qu’une jolie interface et des liens faciles à trouver sur votre page !

Bien que l’esthétique d’une page web soit importante, le web design, c’est plus que du paraître. Le web design, en définition, englobe également :

  • La maintenance du site ;
  • Le code standardisé et les logiciels propriétaires ;
  • Le design de l’interface ;
  • La création de contenu ;
  • L’optimisation du site pour les moteurs de recherche ;

Comme vous pouvez le constater, il y a beaucoup d’éléments qui compose le web design même si sa définition est généralement réduite à l’esthétique de l’interface.

Les spécialistes en design de sites WordPress de notre agence web à Montréal ont décidé de créer ce guide pratique du web design. Découvrez le web design et sa définition ainsi que les termes importants à se rappeler qui compose l’univers du design web. Nous sommes ravis de vous aider à mieux comprendre le web design et sa définition.

Web design en définition : qu’est-ce que le web design, exactement ?

Le web design en définition, c’est l’ensemble des processus nécessaires pour assurer une expérience utilisateur de qualité. Cela englobe non seulement l’esthétique de l’interface, mais également la maintenance du site en lui-même. On ne peut donc par parler de design web sans parler de l’expérience utilisateur. Le principe à la base même du design web est centré sur l’utilisateur.

Le travail d’un designer web est de réfléchir aux utilisateurs du site et de créer un design qui comprend la façon dont les utilisateurs pensent et ce qui les influencent. Un bon design web, par définition, mettra de l’avant les éléments pertinents aux utilisateurs. En d’autres termes, le designer web doit user de deux types de sciences : la science cognitive (pensée humaine) et la science de l’interaction humain-machine.

Découvrez maintenant les concepts du design web.

UCD : un design centré sur l’utilisateur

L’UCD est le concept du design web qui prend en considération et comprend les besoins des utilisateurs. L’utilisateur est donc impliqué dans toutes les sphères du design et de l’évaluation de celui-ci. Afin de créer un design UCD, les designers web procèdent en quatre phases distinctes :

  • Compréhension du contexte dans lequel le système est utilisé ;
  • Spécification des exigences des utilisateurs ;
  • Création d’un premier design ;
  • Évaluation du design par les utilisateurs ;

Suite à l’évaluation, le design évolue et les quatre phases sont répétées jusqu’à ce que le niveau de satisfaction de l’utilisateur soit optimal.

Le concept du design UX

Le design UX, quant à lui, cherche à améliorer l’expérience utilisateur en mettant l’accent sur l’utilisabilité, l’accessibilité et la satisfaction de l’utilisateur à interagir avec le produit ou service. En terme plus simple, le design UX est ce qui rallie l’entreprise et l’utilisateur.

Voici d’ailleurs les 5 disciplines du design UX :

  • L’utilisabilité : définie par la norme ISO 9241-11 : 1998, l’utilisabilité est la discipline qui utilise et s’appuie sur des données pour justifier et déterminer les décisions prises en matière de design web ;
  • L’architecture de l’information : pour rendre l’information (le contenu) plus compréhensible et connecter les gens aux entreprises ;
  • Design d’interaction : considère l’interaction humain-machine ;
  • Prototypage : la création d’un design web de base qui permettra l’évolution et le développement du design final ;
  • Design visuel : l’aspect esthétique du produit final (interface) afin d’améliorer l’expérience des utilisateurs ;

Peu importe le concept utilisé pour bâtir un design web, il est important de comprendre que le travail d’un designer web est beaucoup plus que de simplement « embellir » une page web. Les designers web modernes doivent donc posséder une variété de talents comme le design graphique, le branding, le marketing, la programmation, etc. Ils doivent également être en mesure, avec l’interface :

  • D’être cohérent dans le choix de couleurs et de typographie ;
  • De créer un équilibre des espaces et des textes ;
  • D’être pertinent avec l’iconographie ;
  • De faire la hiérarchisation de l’information de façon à mettre de l’avant ce qui est le plus pertinent pour l’utilisateur ;

Découvrez maintenant les termes spécifiques au domaine du design web afin de mieux comprendre son univers.

Web design définition : les termes à se rappeler

Si vous êtes intéressé par l’univers du web design, il est important de bien connaître ces termes.

  • . AI: il s’agit du format des documents (images vectorielles) d’Adobe Illustrator.
  • Anticrénelage : traduit de l’anglais antialiasing, il s’agit du procédé qui consiste à réduire les effets de la pixellisation des éléments graphiques.
  • Arborescence : Le principe d’organisation logique des pages qui consistent un site web.
  • Bannière : Contenu publicitaire. Souvent une image fixe ou animée qui cherche à obtenir plus de clics.
  • Baseline: est une expression qui définit bien l’univers du produits ou service offert. Généralement, la baseline est placée sous le logo ou en signature.
  • Charte éditoriale : Charte qui définit l’homogénéité des contenus écrits du site. Elle inclut le calibrage des libellés, le registre lexical, le découpage du texte, et plus encore.
  • CMS : Acronyme du terme anglais content management system est le système de gestion des contenus qui permet de gérer un site. WordPress est sans aucun doute le CMS le plus utilisé dans le monde
  • CSS : le code informatique qui détermine l’apparence du site web, sans prendre en considération le contenu ;
  • CTA : Acronyme du terme anglais call to action, il s’agit d’un bouton ou un visuel qui cherche à attirer le regard des utilisateurs pour obtenir une inscription, un clic, ou tout autre objectif du CTA.
  • DPI: en français, il s’agit de « point par pouce ». Le DPI est la résolution d’une image. En règle générale, l’affichage web est à 72 DPI.
  • EM : unité de mesure de la typographie. Elle permet d’ajuster sa taille, ce qui est très pratique pour la création de sites responsives ;
  • Ergonomie : le principe de l’ergonomie d’un site web consiste à reconduire rapidement et naturellement l’utilisateur vers l’information recherchée, tout en offrant un confort de navigation.
  • Footer: le bas de page. Une navigation détaillée du site web est généralement située dans son pied de page.
  • Header: la bande horizontale en haut de page. Elle contient généralement le logo de l’entreprise et des images ou messages pertinents qui peuvent accrocher le regard des utilisateurs.
  • Interface : La partie visible du site web pour les utilisateurs.
  • Mobile-first: le principe de concevoir un site web pour sa version mobile en premier, puis à adapter celui-ci pour les écrans plus grands.
  • Optimisation : l’art de réduire le poids des images en utilisant le fichier source PSD afin que celles-ci soient les plus légères possible. Cela permet au site de générer les pages plus rapidement pour les utilisateurs.
  • Pictogramme : Des icônes ou représentations graphiques minimalistes qui permettent aux utilisateurs de trouver rapidement ce qu’ils cherchent ;
  • Prototype : Pages tests fonctionnelles et interactives pour les tests utilisateurs.
  • Responsive design: Dit d’un design qui s’adapte à tous les écrans (pc, tablette, téléphone, etc.)
  • RVB : Format de codage des couleurs, utilisé dans les codes HTML.
  • Template: aussi appelée gabarit, il s’agit d’une page modèle qui peut être utilisée pour la création d’autres pages. Les templates diffèrent des pages statiques, car chaque page statique est différente, alors que les templates créent des pages multiples qui se ressemblent pour lister des produits, des pages types, etc.
  • UI: désigne le user interface ou l’interaction entre l’homme et la machine. L’UI sert à créer un système visuel qui facilite l’accès au contenu pertinent pour les utilisateurs.
  • UX : représente l’expérience utilisateur en matière d’utilisabilité, d’accessibilité et de satisfaction des utilisateurs.
  • Wireframe : maquette d’un site web qui sert à structurer la page et améliorer la communication entre les différents designers impliqués dans la conception d’un site.

Pour toutes questions concernant le web design, sa définition, ses termes ainsi que notre expérience dans le domaine contactez-nous ! Nos experts sont ravis de partager leur savoir avec vous.

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée.