Au début du web, soit les années 95-96, le design des pages était calqués sur celui du print.  Il fallait que cela ressemble à ce que l'on trouve dans les magazines et la presse en général. Petit à petit le web a trouvé sa propre identité visuelle en intégrant différents médias mais en proposant également une navigation différente entre les contenus.  L'ajout d'effet visuel à apporter définitivement une expérience utilisateur différente d'une lecture conventionnelle.

Mise en valeur du Web Design

Pour tous les médias le contenu n'est pas suffisant; le contenant ne doit pas être négligé. Le web ne déroge pas à la règle, et est capable d'offrir une interface bien plus complexe, dynamique et interractive que tous les autres supports. Le contenu est extrêmement varié (images, sons, vidéos, animation, jeux…) et sa présentation doit le mettre en valeur.
Un design aussi plat soit-il peut révéler bien plus en terme d'interaction avec l'utilisateur : une zone qui se découvre au survole, des images qui se positionnent automatiquement en fonction de leur taille ou bien un menu toujours présent en transparence. Les exemples ne manquent pas. Le web design englobe à la fois le design traditionnel (formes, couleurs, polices...) et l'ergonomie. 

Il faut penser non seulement à l'espace disponible (desktop, tablette, smartphone...) mais également au contenu que l'on veut mettre en avant. Pour le site d'un restaurant, par exemple, le visiteur ne cherche pas le même contenu suivant qu'il utilise son smartphone ou son ordinateur portable ; en mobilité il recherche plutôt l'adresse du restaurant ou les horaires d'ouverture, tandis que s'il utilise son ordinateur c'est peut-être davantage pour decouvrir la cuisine ou le comparer à d'autre restaurants. Le contenu mis en avant n'est donc pas toujours le même suivant l'appareil utilisé. Le graphiste doit donc tenir compte de ce facteur et l'intégrer dans la conception des maquettes.  

Le "Print" est statique par nature, le web est dynamique, les effets doivent être utilisés et ne sont pas facilement représentable sur le papier. Le meilleur outil de création dynamique pour simuler un site (transition, transformation, scrolling, objet toujours présents…)1 est encore le navigateur. On parle alors de inbrowser design. Il n'y a pas d'aplat.

Au début les désigner faisaient du beau et précis au pixel près. La page web était jolie, quant elle ne ressemblait pas à une vraie page ! Aujourd'hui on est loin du concept de page figée, le design doit servir avant tout l'utilisateur. On n'a moins besoin d'embelissement que de contenu. L'internaute est passé du stade de spectateur à celui d'acteur (web 2.0) et c'est toute l'approche ergonomique qui doit être repensée.
Le design ne sert plus que la présentation mais aussi l'utilisateur en proposant une interface appropriée. 
Le design n'en est pas pour autant désuet, bien au contraire, il doit se réinventer pour devenir WEB DESIGN. les outils de présentation dynamique et adaptif sont sous exploités par manque de connaissance. Ils existent pourtant depuis longtemps (à l'échelle du web, 5 ans en arrière correspond à la préhistoire). JQuery reste une technologie fantastique, même si d'autres complètent l'offre. 

Le design doit intégrer les interactions avec ce que l'on voit du site, mais également ce que l'on ne perçoit pas encore : comment des événements en temps réel se manifestent-ils à l'utilisateur? Ces problématiques sont bien connues des applis mobiles, mais restent à imaginer pour le Web. Le désigner doit avoir une vision à la fois des éléments statiques et des interactions qu'offrent les technologies purement Web. 

Le meilleur graphiste au monde n'est pas un bon Web désigner ! Comment peut-on offrir une expérience unique au visiteur si l'on ignore les outils de Web ? Aux compétences de graphiste s'ajoutent des compétences techniques indispensables. Il ne s'agit pas pour autant d'intégration HTML/CSS ou de Javascript, mais plus simplement de connaître et découvrir les plugins qui ajoutent de la valeur à un site en améliorant l'expérience utilisateur. Ce sont ces plugins qui apportent un plus au niveau de la présentation et qui font que le Web est bien différent du "print".

"Voici le calque de la maquette, posons le sur l'écran et comparons !" Quelle idée ! Le graphiste et l'integrateur sont contents, mais qu'ont ils apporté à l'utilisateur ? Rien. Cette approche du pixel près est à bannir car elle ne correspond en rien à la réalité et pire encore elle est contre productive : qui va tester un site sur 50 navigateurs ou applis mobiles afin de coller aux maquettes ? Qui veut passer des heures à faire en sorte que des navigateurs differents et de generation disparate affichent un site strictement de la même facon ? Par contre on souhaite qu'un site respecte le design global voulu, avec en plus la faculté de s'adapter. C'est le responsive design. Le pixel près est mort, vive la flexibilité !

Il est important de comprendre qu'un Webdesigner aujourd'hui doit être aussi un développeur dans le sens oû il ne peut pas rester ignorant les technos propres au web. Comment appréhender le responsive design sans connaître les contraintes techniques que cela implique et les différentes solutions à mettre en œuvre ? Le Webdesigner a une casquette de designer traditionnel, mais il doit aussi faire de la veille autour des tendances du web et des nouveaux outils qui fleurissent sans cesse.  Avoir toutes ces compétences n'est pas chose simple, mais ouvrent des perspectives et des opportunités extrement intéressantes sur le plan professionnel. La rareté est toujours récompensée d'une façon ou d'une autre. 

Dans la même catégorie

CMS Drupal

Drupal : LE CMS pour les professionnels ?


Drupal et les structures de données

Que reste-t-il à Drupal ?


Drupal et les structures de données

Drupal et les structures de données