Le webdesign est très différent de la conception graphique pour le print. Pour un graphiste "print", le passage au web est souvent un casse-tête tellement les contraintes changent, voici quelques règles essentielles pour passer le pas sans (trop) de difficultés et pourvoir livrer une interface qui ne pose pas de problème à l'intégration.

Le webdesigner utilise Photoshop

Tout webdesigner sensibilisé à l'intégration xhtml d'un site sait que c'est sous Photoshop qu'il devra travailler, et non Illustrator ; d'autant que Photoshop gère les formes vectorielles et les effets de texte depuis longtemps.

Tailles, unités et typos : on parle "standards" et pixels !

Le web s'affiche sur écran, et qui dit écran dit pixels. Pour la résolution, votre interface devra utiliser une définition à 72  pixels/pouce.

N'oubliez pas que la résolution d'écran n'est pas la résolution de l'espace d'affichage d'une fenêtre de navigateur... personne ne navigue en plein écran. Si vous optez pour une optimisation destinées aux écrans 1024x768, conservez une largeur d'interface maximum à 960px.

Côté typos, le choix est limité. Utilisez des typos standards qui sont communes à la majorité des systèmes (Arial, Verdana ou Times par exemple), sans anti aliasing pour un rendu de texte proche du rendu navigateur, sans césure, et sans jouer sur l'espacement inter-caractères. Réservez les typos "graphiques" à des éléments de titres qui pourront être intégrés avec des images. Et là encore, exprimez les tailles en pixels plutôt qu'en points.

Effets, styles, couleurs pour le web

Conséquence de l'affichage sur écran à nouveau, l'espace colorimétrique est en RVB et non en CMJN. Les couleurs ne sont plus limitées aux 256 couleurs web sécurisées, fort heureusement, les écrans d'aujourd'hui sont capables de rendre des millions de nuances de couleurs.

Une intégration de qualité demandera un travail graphique à partir de la maquette d'interface. Chaque effet appliqué à un calque ou à un texte doit pouvoir être reproduit à l'identique. Il est donc impératif de créer effets et styles directement dans Photoshop et de les laisser sur des calques et/ou styles séparés.

Et pour l'inspiration ? Pas de recette miracle : naviguez, naviguez, naviguez ;-)