5 choses à savoir pour le webdesign

Assurer des travaux de webdesign implique de bien connaitre l’environnement web. Voici quelques éléments de base à connaitre pour un webdesigner :

Résolution d’écran
On conçoit le design d’un site web (sauf dans le cas d’un design extensible) pour une résolution minimale. En général on conçoit la page dans un bloc légèrement inférieur à la largeur de la résolution minimale (par exemple 996px pour une résolution minimale de 1024px x 768px). On ajoute ensuite une marge si le site est centré ou 2 marges si le site est aligné sur un côté.

Design extensible
Même si il est parfois difficile de bien concevoir un site complètement extensible, la multitude format d’écran (4/3, 16/9, mobiles,….) et de résolutions (mini-pc,, 800×600, 1600×1284) justifie la conception d’un design extensible. C’est un design qui va s’adapter à la résolution d’un écran et les différentes zones (hormis les images) vont augmenter ou réduire leur largeur en fonction de la résolution. exemple de site extensible : http://www.siteduzero.com/

Utilisation de la typographie
Pour des questions d’optimisation, d’accessibilité et de référencement, il importe qu’un maximum de texte d’une page web soit du texte directement écrit dans le code html et non pas du texte affiché à l’intérieur d’une image (fichier type jpg, gif ou png).
Le problème de la typographie    HTML est qu’elle se limite à un nombre de police très réduit.

En effet, le navigateur utilise des  polices qui doivent être déjà présentes sur l’ordinateur de l’internaute. Il importe donc que ce soit des polices standards.
Pour un site dynamique (actualisable à partir d’une interface privée), il est impératif que les textes actualisables soit du texte directement écrit ne HTML.

Images de fond répétées
Les propriétés (notamment des blocs CSS) de pages webs, permettent d’ajouter des images de fond à des zones de la page. Ces images de fond peuvent être répétées. On utilise souvent cette propriété d’image de fond répétée car lorsqu’une image est répétée de manière à avoir des pages graphiques et légère.
Certains outils en lignes permettent de générer de motifs pour image de fonds répétées de site :
http://bgpatterns.com/
http://www.stripegenerator.com/
http://stripedbgs.com/

Navigation
Les éléments de navigation doivent ressortir visuellement du reste du contenu d’une page. On utilise souvent une couleur forte (relativement aux autres teintes de la page), les zones interactives devront être proches les unes des autres. On tentera, de garder le même système de navigation de page en page (afin que l’internaute n’ai pas besoin de rechercher le mode de navigation à chaque page). L’utilisation de systèmes généralisés sur le web (menu horizontaux ou à gauche, menus déroulants) évite de dérouter l’internaute. Le coin haut droit est souvent fui par l’œil de l’internaute.

Résolution d’écran

On conçoit le design d’un site web (sauf dans le cas d’un design extensible) pour une résolution minimale. En général on conçoit la page dans un bloc légèrement inférieur à la largeur de la résolution minimale (par exemple 996px pour une résolution minimale de 1024px x 768px). On ajoute ensuite une marge si le site est centré ou 2 marges si le site est aligné sur un côté.