Langage du concepteur Web : un guide pour vos clients

Publié: 2019-11-09

Chaque métier a son propre jargon. En tant que concepteur Web, vous maîtrisez parfaitement la soupe alphabétique des termes de site Web tels que UX, CSS et HTML. Mais vos clients ? Cela pourrait aussi bien être grec pour eux.

Il y a d'énormes avantages à éduquer vos clients sur les termes de conception Web les plus courants avant même de plonger dans le processus de conception. Quel que soit leur niveau de connaissances, lorsque vous ne couvrez pas les bases, vous finissez par passer plus de temps sur les appels téléphoniques à traduire la terminologie, au lieu de discuter de votre travail et de vos idées de conception.

Pour aider vos clients à se tenir au courant, j'ai compilé les termes de conception Web les plus courants et les ai traduits dans un jargon convivial.

Voici 7 termes essentiels de conception de sites Web :

  • Image de héros
  • UX
  • Filaire
  • Architecture des informations
  • Adapté aux mobiles
  • HTML, CSS et JavaScript
  • CMS


Image de héros

Lors de la conception d'un site Web, vous entendrez souvent le terme « image de héros » en référence à la page d'accueil du site Web. Bien que le terme puisse évoquer des images de Batman et de Superman, cela ne signifie pas que votre concepteur met une image de super-héros sur votre site Web.

Un croquis illustré d'un site Web, avec l'image du héros (en haut) étant le point focal principal du site Web
L'image principale est la grande image ou vidéo de présentation dans la section supérieure de la page d'accueil d'un site Web.

L'image principale est la grande image caractéristique ou l'arrière-plan vidéo dans la section supérieure de la page d'accueil d'un site Web. Les gens ont commencé à se référer à cette zone comme une image de héros parce que c'est une partie si importante du site. C'est la première chose que tout visiteur voit lorsqu'il arrive sur votre site Web et, par conséquent, le design doit être captivant et significatif.

Bien que le terme « image de héros » contienne le mot image, cette section du site Web ne doit pas nécessairement être une image statique. Aujourd'hui, les vidéos de héros sont très courantes, jouant généralement en arrière-plan derrière du texte. Selon les objectifs du site et le style de conception, vous pouvez même voir une animation utilisée dans cette zone du site.


UX ou expérience utilisateur

UX est un raccourci pour l'expérience utilisateur. Certains concepteurs de sites Web se spécialisent dans la conception UX - le processus d'amélioration de l'expérience totale d'un visiteur de votre site Web. La conception UX est considérée comme une spécialisation car le concepteur ne se contente pas de créer l'apparence du site, mais considère comment un visiteur vit sa première (et les suivantes !) visites sur le site.

Une analogie simple pour l'expérience utilisateur consiste à la comparer à l'expérience que vous pourriez avoir dans un nouveau restaurant. La nourriture est peut-être excellente, mais si le restaurant met une éternité à vous asseoir et que les salles de bains sont dégoûtantes et que le stationnement est un cauchemar, vous ne voudrez probablement plus y retourner. Il y a beaucoup plus de facteurs que la nourriture qui peuvent avoir un impact sur votre expérience dans un restaurant.

La même chose peut être dite à propos des sites Web, et c'est de cela qu'il s'agit. Engager et garder un visiteur sur votre site Web ne consiste pas seulement à avoir un beau design. Un concepteur Web qui comprend la conception UX considère comment tout sur le site affecte l'expérience globale de l'utilisateur.


Filaire

Au cours de la plupart des projets de site Web, votre équipe Web créera d'abord une structure filaire d'une page Web avant de créer une maquette de conception.

Un wireframe est essentiellement un plan et il montre où certains éléments et textes seront placés sur la page.

Une illustration qui montre une mise en page approximative d'un site Web. Il y a un cercle pour montrer où irait le logo, des cases pour montrer où iraient les sections et les images, et des lignes pointillées pour montrer où se trouverait le texte.
Un wireframe est un plan qui montre où certains éléments et textes seront placés sur la page.

La construction d'un site Web est similaire au processus de construction d'une maison. Vous commencez par un architecte et créez un plan avant que l'architecte d'intérieur ne commence son travail, sinon vous risquez de vous retrouver avec une salle de bain dans la cuisine. Un wireframe est un outil extrêmement utile car il vous permet de collaborer avec le stratège ou le concepteur Web et de déplacer les choses plus facilement qu'une maquette de conception.

Si vous avez déjà vu un exemple de wireframe, vous remarquerez qu'il présente des similitudes avec un plan de construction ; le filaire est généralement en noir et blanc avec des boîtes et des contours de base pour montrer où les éléments seront placés.


Architecture de l'information (AI)

En plus d'un wireframe, vous travaillerez généralement sur l'architecture de l'information de votre site Web au début du processus. L'architecture de l'information, souvent appelée IA, fait référence au processus d'organisation, de hiérarchisation et d'étiquetage du contenu du site Web.

À ce stade, vous déciderez quelles pages du site Web seront incluses dans la navigation supérieure du site Web et comment le contenu sera structuré. La navigation supérieure est la série de liens en haut de la page. Cette navigation supérieure se trouve sur chaque page du site Web et aide à guider les visiteurs Web vers le contenu le plus important.

Semblable au wireframe, l'architecture d'information finale est une représentation organisationnelle de votre site Web. Il ressemble souvent à un diagramme et constitue un outil essentiel pour guider l'équipe Web afin de s'assurer que le site Web final est logique et intuitif à naviguer.


Adapté aux mobiles

Aujourd'hui, chaque site Web doit fonctionner pour une variété d'appareils, tels que les téléphones, les tablettes et les ordinateurs de bureau. C'est dans ce contexte que vous entendrez souvent un concepteur de sites Web utiliser le terme « mobile-responsive ».

Mobile-responsive signifie qu'il existe déjà une technologie intégrée à la plate-forme elle-même.

La majorité des plates-formes de sites Web comme WordPress sont adaptées aux mobiles, ce qui signifie qu'il existe déjà une technologie intégrée à la plate-forme elle-même afin que le contenu s'adapte automatiquement à la taille de l'appareil de l'utilisateur.

Pensez au fonctionnement de votre téléphone mobile. Si vous tournez votre téléphone horizontalement, le contenu du téléphone s'ajuste automatiquement.

Ceci est très similaire à ce qui se passe sur le site Web. Grâce à la technologie mobile, les concepteurs et développeurs Web n'ont plus besoin de créer une 2e version de votre site Web pour les appareils plus petits. Le même contenu et la même conception s'afficheront de manière appropriée sur différentes tailles d'appareils.

Un concepteur Web qualifié en tient compte lors de la conception du site et peut vous guider dans la rédaction de contenu qui fonctionne à la fois sur les appareils mobiles et les écrans plus grands.


HTML, CSS et JavaScript

Ne laissez pas ces termes techniques vous intimider. Chacun se rapporte à la façon dont votre conception passe d'une image statique à une page Web interactive en direct. En règle générale, vous commencerez à créer votre site Web avec un concepteur Web spécialisé dans l'apparence et l'organisation du site. Ensuite, vous travaillerez avec un développeur Web ou une équipe de développement qui codera le site.

Vous êtes plus susceptible d'entendre ces termes pendant la phase de développement de la création de votre site, mais ils peuvent également apparaître dans les discussions sur la conception.

HTML signifie HyperText Markup Language et permet à une équipe Web de dire à un navigateur Web comment afficher un morceau de texte. HTML utilise différentes balises pour indiquer si le texte est un titre, un sous-titre ou un paragraphe. Vous pouvez voir un designer étiqueter un titre dans votre conception comme H1. Cela fait référence à la balise HTML qui sera utilisée pour indiquer au navigateur que tout le texte avec cette étiquette doit être dans la même taille de police.

Les feuilles de style en cascade (CSS) aident un concepteur et développeur Web à définir l'apparence du site Web. Le HTML en lui-même n'est ni attrayant ni séduisant. CSS fait toute la différence dans la création d'un beau design de page Web.

JavaScript est un langage de script que les développeurs utilisent pour créer les interactions sur le site Web. Avec juste HTML et CSS, vous avez une belle page Web, mais rien ne peut arriver avec ces deux-là. Lorsque vous recherchez un développeur Web ou une équipe de développement, recherchez quelqu'un qui connaît bien plus que JavaScript et assurez-vous que votre équipe est expérimentée dans la plate-forme sur laquelle vous construisez le site.


CMS

Nous terminerons avec un terme assez simple : système de gestion de contenu, autrement connu sous le nom de CMS. Vous entendrez souvent ce terme en relation avec WordPress (un autre système de gestion de contenu).

En fait, WordPress est le système de gestion de contenu le plus populaire au monde. Un CMS est un outil back-end sur le site Web et il vous permet de modifier ou d'ajouter facilement du contenu au site.

L'énorme avantage de créer votre site sur un CMS comme WordPress est que vous n'avez pas besoin d'être un concepteur Web ou un développeur Web pour modifier le texte, ajouter des images ou ajouter des pages après le lancement du site Web. Vous n'aurez pas à appeler votre développeur Web chaque fois que vous aurez besoin d'ajouter une virgule à une page.

Parce que WordPress est extrêmement flexible et personnalisable, vous obtenez le meilleur des deux mondes avec un beau site Web qui reste facile à gérer pour votre entreprise.


Découvrez plus de contenu WordPress !

local-wordpress-developpement-environnement-pourquoi-grand

WordPress est le système de gestion de contenu le plus populaire au monde et est utilisé chaque jour par de plus en plus de créatifs. En savoir plus sur WordPress ici. Peu importe que vous soyez débutant ou que vous connaissiez WordPress comme votre poche, nous avons des ressources et des articles pour tout le monde !

Continuez à lire ici.