Web Design vs. UX Design

Crystal Harris .

“Qu’est-ce que tu fais comme métier ?”
C’est une question pourtant simple, mais j’ai souvent du mal à y répondre.
Finalement, je réponds “Webdesigner”, parce que je ne veux pas prendre le temps d’expliquer ce à quoi je passe réellement mes journées.

play-stone-1738160 1920 2

Les gens feignent d’être intéressés, hochet la tête et la conversation glisse sur autre chose.
Mais ce n’est pas cela. Ma réponse est inexacte. Il serait plus exact de dire je suis designer d’expérience utilisateur – mais ce serai encore un abus de langage, et j’en parlerais plus tard.

Comment sommes-nous arrivés dans un monde où il est compliqué d’expliquer un métier en quelques mots compréhensibles, même a des gens du même secteur d’activités ? Et de toute façon, quelle est la différence entre UX et web design ?

L’histoire du design sur le web

Au commencement…

Pour trouver la réponse, remontons le temps de quelques années vers les années 90. (26 ans pour être exact – je sais ça ne me rajeunit pas non plus).

Le CERN vient juste de lancer le premier site web et le premier serveur public. Nommé « Projet WWW », il fournit aux visiteurs des informations techniques, sur la façon de lancer son propre site web, des informations sur d'autres projets W3, et plus encore.

Dans leurs propres termes :

“Le WorldWideWeb (W3) est une initiative de recherche d'information hypermédia étendu visant à donner un accès universel à un grand univers de documents.”

Ou, exprimé plus simplement, c’était un outil pour trouver de l’information ; une bibliothèque des temps modernes au bout de nos doigts.

Le design du site n’était pas du tout travaillé, et c’était tout à fait approprié. Le but du web étant strictement utilitaire, les technologies utilisées l’étaient tout autant.
Même si vous aviez voulu introduire des éléments visuels, vos possibilités étaient assez limitées. En fait, la balise <img> ne sera introduite que trois plus tard en 1993.

Le premier serveur – on peut encore lire l’étiquette manuscrite “Cette machine est un serveur. NE PAS L’ETEINDRE !!” .
(Par Coolcaesar at the English language Wikipedia, CC BY-SA 3.0)

 cumputeur

La même année, le navigateur Mosaic est sorti, et le World Wide Web gagnant en popularité, les gens commencèrent à l’utiliser pour faire toutes sortes de choses, y compris
des achats en lignes, des bannières de pubs et oui, même des rencontres !

Puis, en l’espace de quelques années, l’objet de l’autoroute de l’information s’est élargi de la simple interconnexion entre individus à beaucoup, beaucoup plus que cela.

Il était clair que pour être efficace, les gens et les entreprises ont dû faire preuve de créativité et ont dû se démarquer.

Les tables à la rescousse !

Avec les navigateurs supportant enfin les images, il semblait qu’un web beau et utile était juste à portée de main. Sauf, que… cela n’a pas été le cas.

Arrivèrent les <table>. Vous vous en rappelez n’est-ce pas ?

Faute d’une solution plus efficace, et pour répondre aux besoins des clients et satisfaire les designers, les développeurs ont utilisé un élément html conçu pour l'organisation de valeurs et l'on détourné de son but initial. Cela a marché et pendant une longue période “le tranchage” des designs fut la norme. Après tout, les seules choses limitatives dans une conception complexe étaient d’une part l’intelligence du développeur et d’autre part le fait de savoir comment les tables seraient imbriquées les unes dans les autres.

La norme CSS 1.0 a été introduite en 1996, et bien qu'elle ait essentiellement inclus des propriétés pour les polices et les couleurs, chaque petite avancée fut utile.

Avec ces outils, la créativité fut florissante, et des pépites comme le site SpaceJam sont nées.

Les gens en voulurent plus, ils désiraient des choses nouvelles, des choses différentes - alors la technologie s'est développée pour les leur fournir.

Il est encore en ligne !
(Visitez le ici http://www.warnerbros.com/archive/spacejam/movie/jam.htm)

2017-04-07-at-13.18.57

Flash et les âges sombres

Flash est sorti fin 1996, et un an plus tard tous les navigateurs modernes le supportaient. Au départ le but de Flash était assez simple – il permettait à l’utilisateur de jouer des sons et de créer des animations simples.

Finalement, il a évolué au point de supporter la vidéo, les interactions avancées et les développeurs ont été capables de réaliser des sites entiers uniquement à l’aide de Flash et l’ActionScript. Comparé à ce qui étaitdisponible à cette époque, c’était (et cela reste) un outil très puissant. Mais comme on dit, un grand pouvoir implique de grandes responsabilités.

Il ne fallut pas longtemps avant que tous les designers “cool” n’utilisent Flash pour tout, et parfois juste pour le plaisir de la démo. Comme trop souvent, cependant, cette technologie nouvelle et cool a été malmenée au détriment de l'expérience de l’utilisateur. Les sites en Flash lourds mettaient des siècles à charger, et bien que les effets visuels soient magnifiques, c'était un mauvais compromis pour la plupart des utilisateurs qui voulaient juste obtenir quelque chose.

L’illumination CSS

Vers la même époque, la norme CSS 2.0 fut introduite, et adoptée par les principaux navigateurs vers fin 2000.
Pendant longtemps cependant, elle fut négligée par les designers en faveur de l’habituel design en tranches et tableaux, et la puissance des sites en Flash.

Pour encourager les concepteurs et les développeurs à construire d’avantage de sites en utilisant les CSS, et “faire comprendre ce que c’est tous ces trucs en CSS”, CSS Zen Garden est né en 2003. 

Comme le site original le déclarait : 

“Il y est clairement nécessaire pour les CSS d’être prises au sérieux par les artistes graphiques. Le Jardin Zen a pour but d’exalter, d’inspirer et d’encourager la participation. Pour commencer, regardez quelques-uns des designs existants dans la liste. En cliquant sur n‘importe lequel, cela va charger la feuille de styles correspondante dans cette même page. Le code reste le même, la seule chose qui as changée est le fichier CSS externe. Oui, vraiment. “… à ce jour, la plupart des exemples d’astuces et de hacks CSS ont été réalisées par des développeurs. Les designers ont encore à y imprimer leur marque. Cela doit changer.”

Pour beaucoup de designers, y compris moi-même, ce fut une source d’inspiration et un excellent outil d’apprentissage. Alors que les sites en Flash mangeurs de bande passante restaient populaires, sortaient de plus en plus de beaux sites statiques, construits à base de CSS et mettant le contenu au premier plan.

Doucement, les sites en CSS ont gagné, car les utilisateurs commencèrent à montrer leur préférence pour les sites se chargeant rapidement et leur offrant une meilleure expérience.

Le site CSS Zen Garden original, en novembre 2003. 

zen-garden-copy 

La révolution mobile

Avec l’introduction de téléphones capables de naviguer sans limites sur le web (c’est de toi que je parle iPhone), les choses commencèrent à bouger rapidement.

Le matériel et les logiciels évoluèrent rapidement, surpassant leurs prédécesseurs, avec l’avènement du spécifique mobile… non attendez... basé sur des grilles, non attendez… responsive design, et les tendances vont et viennent au fil des saisons.

Attendez… c’est encore ce qui est en train de se passer.

C’est le monde dans lequel nous vivons actuellement.
Avec la technologie à notre disposition aujourd’hui, les designers sont libres de tirer parti des tendances et des idées actuelles pour créer des sites web (et des web apps, et des applications natives, et plus encore) qui répondent le mieux aux besoins de leurs clients et des utilisateurs.
C’est fantastique.

Mais alors, pourquoi un tel maelstrom de titres dans nos métiers ? Nous avions des Web designeret des graphistes ; nous avons maintenant des UI Designer, UI Developer, Visual Designer, Interaction Designer et UX Designer

Ah, tiens cette phrase à nouveau – UX Design.
Comment s’y retrouver dans tout cela ?

Designer l’expérience utilisateur

Bien que l’intitulé du job soit relativement nouveau, le fait de porter attention à l’expérience utilisateur ne l’est pas lui. (Après tout, pour qui faisons-nous donc ces sites web ?).

Jetez un coup d’oeil à la première moitié de cet article.
Certaines parties sont mises en valeur dans chacune des sections, et une fois les points reliés nous obtenons :

Il était clair que pour être efficace, les gens et les entreprises ont dû faire preuve de créativité et ont dû se démarquer. Les gens en voulurent plus, ils désireraient des choses nouvelles, des choses différentes - alors la technologie s'est développée pour les leur fournir.

Comme trop souvent, cependant, cette technologie nouvelle et cool a été malmenée au détriment de l'expérience de l’utilisateur. C’était un mauvais compromis pour la plupart des utilisateurs qui voulaient juste obtenir quelque chose.

Les utilisateurs commencèrent à montrer leur préférence pour les sites se chargeant rapidement et leur offrant une meilleure expérience.

Avec la technologie à notre disposition aujourd’hui, les designers sont libres de tirer parti des tendances et des idées actuelles pour créer des sites web (et des web app, et des applications natives, et plus encore) qui répondent le mieux aux besoins de leurs clients et des utilisateurs.

Bien que ce ne soit pas toujours intentionnel, on peut voir qu’avec le temps l’expérience utilisateur a évoluée – et finalement des pans entiers de technologie ont été abandonnés et de nouvelles technologies se sont développées en faveur de l’expérience.
Telle est la puissance de l’utilisateur.

À l'origine, cet article visait à expliquer la différence entre web design et UX design. Cependant, il est rapidement devenu évident que ce serait comme essayer d'expliquer la différence entre une goutte d'eau et une flaque d'eau – le web design est juste une petite partie de ce qui se passe dans l'expérience d'un utilisateur.

Aujourd’hui, quand on dit “web design”, la plupart des gens font référence à l’aspect conception visuelle d’un site web. Un terme plus “moderne” serait UI design ou design d’interface utilisateur – les rôles sont similaires.

Cependant un web designer avait l’habitude de penser à bien plus que juste le look and feel.

En fait, beaucoup de choses qu’un UX designer fait maintenant correspondent à ce qu’aurait fait un web designer il y a 10 ou 15 ans. Avec l’expérience et le temps, ces processus ont été affinés avec des choses comme :

  • Les personas (des personnes semi-fictives, façonnées à travers des recherches et des interviews d’utilisateurs réels, qui nous aident à identifier et à se rappeler à qui est destiné le site en cours de construction)
  • Les flux utilisateur (workflows idéals suivant lesquels nos utilisateurs accomplissent une action ou naviguent dans un site)
  • Prototypage (création d'une version de test simple de notre produit pour mettre nos hypothèses à l’épreuve)
  • Et beaucoup, beaucoup plus, en fonction du client et du projet.

Bien qu’une partie soit purement visuelle, la majeure partie de l’UX design se concentre sur la recherche, les données, les tests et l'analyse - ce qui explique pourquoi j'insiste sur le fait qu’UX “design” est trompeur. 

Après tout, l'expérience d'un utilisateur est une réaction à un produit fin et nous n’avons pas le contrôle absolu sur leurs réactions.

Toutefois, nous avons un certain contrôle sur les facteurs qui l'influencent, et c'est ce sur quoi nous nous concentrons comme consultants UX.

Pourquoi s’en soucier ?

Avez-vous lu ce que j’ai dit plus haut ? Par la puissance collective de millions d'utilisateurs, des technologies entières ont disparues. A quand remonte votre dernière visite d’un site en Flash ?

Bien que ce soit sur une échelle beaucoup plus grande, le coût d’une mauvaise UX est beaucoup plus élevé que l'investissement nécessaire pour en créer une bonne.
Si vous avez déjà entendu l’expression “les gens votent avec leur portefeuille”, et bien une des façons de le faire passe par leurs habitudes de navigation. Une bonne expérience utilisateur fait que les utilisateurs reviennent.

D’une manière plus générale, fournir une bonne expérience utilisateur est en partie le reflet de votre honnêteté.
Cela peut sembler idiot, mais votre site web génère des expériences émotionnelles pour les gens. Comment voulez-vous qu’ils se sentent quand ils quittent votre site ?

L’UX est là pour longtemps

À mesure que nous nous éloignons de dispositifs impersonnels comme nos ordinateurs et que nous allons vers des expériences plus intégrées (comme l’internet des objets, et l’intelligence artificielle) le web design peut devenir sans objet.
L’expérience utilisateur non.

Quand la technologie change, les processus spécifiques que nous utilisons peuvent évoluer – mais l’étude de ceux qui l’utilise et comment les servir au mieux a toujours été importante et le sera toujours. 

Lors de votre prochain projet de site web, je vous encourage à parler avec vos utilisateurs. Cela fait sens au niveau business, ça aide à préparer le futur et c’est tout simplement la bonne chose à faire.

La prochaine fois qu’on vous demandera ce que vous faites, vous pourrez dire “Je conçois des expériences utilisateurs” et en être fier !

Sources :

http://info.cern.ch/hypertext/WWW/TheProject.html
http://www.evolutionoftheweb.com/
http://www.pewinternet.org/2014/03/11/world-wide-webtimeline/
http://mezzoblue.com/archives/2003/05/07/css_zen_gard/

À propos de l'auteur

Crystal Harris

Chanteuse, designer, globe trotteur, épouse. Pas nécessairement dans cet ordre. Tchèco-Américaine, habitant en Grèce.

Sur ce site, nous utilisons des cookies.