Au secours, c’est quoi un web design ?

Publié le 27 octobre 2009 par 11st

Bonjour,

Aujourd’hui, je réponds à un appel au secours de Capucine :

Apprenant à faire des designs pour sites web, j’ai fait des recherches sur ce qu’est le webdesign. Et les réponses sont plutôt contradictoires : un coup c’est tout ce qui concerne le codage et rien que ça (le design n’entre pas en ligne de compte) et un autre coup ça concerne aussi le design à proprement parler.

Donc : “Au secours ! C’est quoi un webdesign ?”

Je vais essayer de répondre le mieux possible à cette question et en plusieurs points comme d’habitude, avec des petites réflexions et conseils.

1. Définition

Créer un webdesign, c’est tout simplement créer une interface web. L’image que j’ai choisi pour illustrer mon article répond tout à fait à ça. Le webdesigner peint la toile… (ohoh)

2. L’idée reçus

Oh qu’elles sont nombreuses les fausses idées que l’on se fait du webdesign. En regardant les forums, on s’aperçoit que pour beaucoup de communautés, le web design s’arrête à l’image fournie par le logiciel. Et ce n’est pas la vérité. (J’ai l’impression de lancer le scoop du siècle qui va briser des familles entières, heureusement ce n’est pas le cas )

L’expression web design, qui est, comme son nom l’indique, anglo-saxonne, regroupe tout un tas de compétences qu’il faut avoir pour se prétendre webdesigner.

3. Dis papa, il faut faire quoi pour être Web Designer ?

Pour être un bon web designer il vous faut avoir les compétences ou notions suivantes :

  • Connaitre le développement Front-Office (XHTML/CSS) : Le web designer doit pouvoir préparer son interface graphique parfaitement pour que l’intégrateur ou lui même intègre de la manière la plus simple et la plus rapide.
  • Avoir des notions d’ergonomie et d’interactivité : L’ergonomie d’un site ne se résume pas à placer un menu en haut ou à droite de la page. Tout est pris en compte, Visibilité, architecture de l’information etc…
  • Connaître les contraintes liées aux développement d’un site : C’est effectivement la base, si vous travaillez sur un site, avec à la clé développement lourd derrière, veillez à éviter bien des misères à vos amis développeurs, simplifez-leur la vie. Et si vous avez un doute sur la possibilité de réaliser telle ou telle chose en code, posez la question ou établissez au préalable un cahier des charges.

Pas besoin de compétences graphique ?

Si vous avez déjà les compétences ci-dessus, c’est que vous savez créer une interface web, ensuite il suffit d’avoir du goût pour que l’interface soit agréable à regarder.

4. Étape par étape de la création d’une interface web

Voici rapidement, la méthode que j’emploie et les questions que je me pose lors de la création d’une page web.

  1. Je définis un besoin : Le besoin c’est le thème de votre page, de quoi allez vous parler ? Est-ce que internet à besoin de votre site web ?
  2. J’écris un cahier des charges : Quelles sont les caractéristiques techniques de mon site ? Qu’est-ce que je veux voir dedans (lecteur MP3) ? Combien de pages seront créées graphiquement ? Combien de pages seront créées dynamiquement ?
  3. Je définis l’arborescence de mon site. L’arborescence c’est en fait l’arbre généalogique de mon site. Je définis ainsi les menus, les sous-menus.
  4. Premier acte créatif, réflexion autour de l’ergonomie, de l’architecture de l’information, avec une feuille de papier et un stylo, je dessine le zoning. Où placer mon menu ? Où placer le logo ? Où placer mes blocks ? Pourquoi je mets en avant ce block et l’autre block en retrait ? Le zoning est la partie fondamentale de votre site. Quand vous avez défini un zoning qui vous plait, refaites-le au propre sur photoshop ou illustrator.
  5. Petite étape intermédiaire, vous pouvez dessiner le design sur un papier aussi pour vous donner un aperçu de votre idée, c’est un croquis.
  6. Ouvrez votre logiciel préféré (Fireworks, photoshop, illustrator, les 3), mettez votre zoning en calque verrouiller, et vous avez plus qu’a suivre le plan.

6 étapes pour arriver à une image. Ces 5 premières étapes vous font gagner du temps pour la suite du travail,

Vu que tout est déjà réfléchi, l’intégration est une formalité technique.

Et votre travail s’arrête dès que vous envoyez le webdesign en développement back-office. S’il y en a un.

Pour conclure,

  • Ne pensez pas qu’un web design c’est une image
  • Pensez à ceux qui vont travailler avec vous sur ce projet
  • Facilitez-vous la vie en réfléchissant à l’avance à toutes les contraintes que vous pouvez rencontrer

J’espère avoir répondu à ta question Capucine.

Le prochain au secours traitera de la motivation, l’inspiration et le temps.

A tout à l’heure

Crédit photo : Mauro Saivezzo – Fotolia.com