Bienvenue sur le blog Webdesign d'anonymation !
Graphisme, ergonomie, communication, design, etc..

Faire appel à des professionnels pour créer un site Internet

composition

Voici un billet un peu spécial aujourd’hui.

Nous avons remarqué lors de nos différents stages effectués lorsque j’étais encore auto-entrepreneur, que notre activité paraissait souvent “obscure” à beaucoup de jeunes créateurs d’entreprise et parfois même certaines sociétés confirmées et déjà équipées. Elle est souvent assimilée à un casse tête complexe lorsque ces personnes sont confrontées au jargon technique et souvent nouveau pour eux.

Ce billet s’adresse donc essentiellement à ceux qui n’ont pas encore eu l’expérience d’un projet web encadré par une agence.

Nous allons essayer de répondre, le plus clairement, simplement et concrètement possible, aux questions suivantes :

  • Comment se déroule un projet Internet lorsqu’un client fait appel à nous ?
  • Quelles sont les différentes étapes que nous traversons, du premier contact client jusqu’à la livraison du site ?
  • Où intervient le client dans le processus de création de son image ?

Évidemment cet article n’a pas de prétentions particulières, et malgré les apparences pas de but “commercial”, mais je suis sûr qu’il intéressera beaucoup de monde pour qui la création d’un site Internet est surmonté d’un gros point d’interrogation. Il n’est donc pas représentatif d’une méthode “admise et appliquée” par toutes les agences ou autre créatif susceptible de vous rendre ce service. Chacun voit midi à sa porte ! Nous mettrons en avant les méthodes que nous avons choisi pour mener à bien ce type de projet, mais, globalement, nous devons certainement partager quelques points communs.

Nous attirons aussi votre attention sur le fait que le déroulement des opérations dépend beaucoup du type et de l’envergure du projet, nous ne pouvons donc pas entrer dans le détail, mais sachez que certaines grandes étapes se retrouvent dans tout type de prestation.

Nous espérons donc que cet article vous éclairera sur le coeur de notre métier, et sur tout ce que nous mettons en oeuvre pour obtenir le résultat que vous recherchez.

Dans le web, on trouve de tout !

La concurrence est rude ! Des freelances, des auto-entrepreneurs, des studios et sociétés en tout genre.
Au moment du boom d’Internet dans les années 90, nous avons vu fleurir toutes sortes de prestations visant à vous proposer la création d’un site sur Internet.

C’était l’heure des startup !

Évidemment dans la masse des prestations proposées, nous avions droit à des propositions parfois plus que douteuses, émanant de pseudo-webdesigners et webmasters.

Le web ne demandait pas de compétences très pointues, les langages étaient encore assez simples et la majorité des pages étaient statiques, aussi bien au niveau des interactions et du contenu que du graphisme, d’ailleurs souvent assez sommaire.

Aujourd’hui nous ne parlons plus seulement de site Internet, mais d’application web. Avec l’évolution de la toile et des technologies (web 2.0, maintenant sur la vague 3.0), un site internet ou une application exploite un certain nombre de technologies diverses qui réclament une véritable expertise dans de nombreux domaines. Si bien que différents corps de métiers ont émergé.

  • Graphistes
  • Intégrateurs/monteurs
  • Architectes
  • Développeurs
  • Référenceurs
  • Community managers etc…

Des métiers complexes, évolutifs et complets, qui ne peuvent pas être cumulés par une seule personne.

Pourquoi autant de compétences ?

D’une part, parce que le site doit respecter des standards.

Passer par exemple la validation W3C qui nous permet de vérifier en partie son accessibilité. Nous veillons également à ce qu’il respecte les grands principes d’ergonomie spécifiques au web. Le design est également un point sensible, puisque le web 2.0 (et bientôt 3.0) sont de plus en plus exigeants quand au rendu visuel des pages et nécessitent de véritables compétences artistiques.

Qu’est-ce que le web 2.0 (wiki) ?

Rien que cet aspect demande déjà plusieurs compétences différentes.

  • Une sensibilité artistique,
  • une maîtrise des outils de création graphique,
  • des compétences en ergonomie,
  • une bonne connaissance des standards et des règles d’accessibilité,
  • la maîtrise des langages d’intégration tel que HTML, Javascript et CSS,
  • des compétences en référencement, encore un métier complexe et défini par tout un tas de règles parfois farfelues.

D’autre part, la création d’un site ou d’une application web demande aujourd’hui des compétences techniques très particulières. Dans le cas d’un projet conséquent, c’est-à-dire dont la complexité dépasse celle d’un site Internet classique comme un site vitrine, une véritable réflexion de fond doit être menée pour assurer l’évolutivité et la robustesse du système.

D’autres spécialistes doivent alors intervenir, architectes, développeurs, chefs de projet, etc. Et tout ceci nous demande bien sûr une certaine organisation afin de mener à bien le projet dans des délais respectables.

Bref, vous l’aurez compris, créer un site Internet professionnel demande de l’investissement. Tenter de le faire seul nous parait une mission impossible. Et nous parlons d’un véritable site Internet, pas des solutions “clé en main” qui vous promettent un site réalisé par vos soins en quelques heures, directement en ligne.

Elles sont valables pour les particuliers qui veulent un site pour leur mariage ou pour partager une passion, un peu à l’image d’un blog, nous serions même les premiers à recommander certaines plate-formes.

Cependant nous pensons que ces solutions sont limitées pour les professionnels car :

  • Elles ne sont pas adaptées à la réalisation de besoins spécifiques.
  • Elles sont basées sur des templates communs qui ne permettent pas d’obtenir un site qui va vraiment vous différencier de la concurrence.
  • Vous êtes livré à vous-même.

Par quoi on commence ?

Très souvent, le premier contact est un coup de téléphone ou un e-mail, le client fait rapidement part de son projet.

L’idéal étant d’avoir le cahier des charges, mais malheureusement ce précieux document est bien souvent inexistant. Un bon conseil pour gagner du temps lorsque vous démarchez les agences web : Venez avec un cahier des charges ! Ainsi vous n’aurez pas à expliquer 5 fois votre projet, les devis seront plus précis et donc certainement moins élevés.

Qu’est-ce qu’un cahier des charges (wiki) ?

Nous déclenchons alors un premier rendez-vous, téléphonique ou physique. Nous aimons privilégier les rendez-vous en personne car il améliore l’interaction et permet parfois une meilleure entente avec notre client. Malheureusement, comme vous le savez, ce n’est pas toujours possible.

Ce rendez-vous dure en moyenne entre une heure et trois heures, au cours duquel est généralement présent un chef de projet et éventuellement un graphiste et/ou un technicien en fonction du type de projet.

Ce temps nous sert à écouter, questionner, faire connaissance, cerner les besoins et commencer doucement une réflexion ergonomique et artistique.

Nous y apprenons généralement le nom de la marque ou de la société, et nous sensibilisons immédiatement le client au sujet du dépôt de sa marque et de son logo, mais surtout de la disponibilité du nom de domaine associé.

Effectivement, le nom de domaine est la base de l’adresse internet que devront taper les utilisateurs pour afficher votre site. (ex: anonymation.com) Les clients n’ont pas toujours conscience des contraintes implicites lorsqu’ils choisissent un nom pour leur société. Si vous choisissez un nom de marque ou de société trop “standard”, du type “Mon site internet”, vous risquez d’être déçu en découvrant que vous ne pouvez pas bénéficier du nom de domaine mon-site-internet.com !

Vous pouvez vérifier vous-même la disponibilité de votre nom sur Gandi.net

Lors de ce premier rendez-vous, c’est aussi l’occasion d’apporter nos premières remarques et conseils sur l’orientation de votre projet afin de vous familiariser avec certaines “bonnes pratiques” liées à la communication sur Internet.

Lorsque c’est possible, nous estimons à la louche le temps de travail nécessaire pour vous donner une idée du budget engagé. Cette estimation n’est bien sûr pas définitive et nous réalisons par la suite une estimation détaillée qui abouti sur une proposition de devis.

Etapes d’un projet simple de type site vitrine

Le client désire :

  1. La création d’un logo
  2. La création d’une charte web
  3. L’intégration d’une page d’accueil
  4. L’intégration de pages de contenu
  5. Développement des pages dynamiques du site
  6. Un hébergement avec une mise en ligne et une maintenance du site.

1 – La création du logo

Tout commence avec le graphiste, dont la mission sera principalement d’écouter le client afin de s’imprégner de l’ambiance recherchée, et tenter de la transposer dans le logo.

Très souvent, l’idée de l’image est déjà existante mais il manque la “patte artistique” qui va permettre de la matérialiser. D’autres fois, le graphiste a carte blanche et peut laisser libre cours à son imagination.

En moyenne, la création d’un logo demande une journée complète de travail. Tout dépend du nombre d’aller-retours avec le client.

2 – Création d’une charte web

Lorsque le logo a été validé, nous réalisons une charte graphique “web” à partir de toutes les informations que nous avons pu réunir (cahier des charges, rencontres, logo).

La plupart du temps nos clients n’ont malheureusement pas le budget nécessaire pour réaliser une charte graphique “complète” regroupant l’ensemble des règles encadrant leur communication.

Qu’est-ce qu’une charte graphique ? (wiki)

C’est un document assez onéreux et nécessaire surtout aux grosses structures qui souhaitent uniformiser leur communication. Des règles strictes mais éprouvées. Si vous pouvez vous le permettre, c’est un document précieux qui vous suivra très longtemps et vous fera gagner un temps considérable.

Ce n’est bien sûr pas obligatoire et pour pallier à ce manque nous réalisons ce que nous appelons, une charte web. C’est en quelque sorte une charte graphique simplifiée, beaucoup moins stricte.

Elle se présente sous la forme d’un fichier .PSD (Photoshop) ou .PDF et représente généralement la page d’accueil du site. Elle peut éventuellement contenir la représentation d’autres pages spécifiques. Par exemple une fiche produit, s’il s’agit d’un projet de e-commerce.

Elle n’implique pas des règles aussi strictes qu’une charte “classique”, mais permet de poser de bonnes bases pour le site et d’harmoniser correctement sa communication sur Internet à moindre coût. Elle peut fixer entre autre l’utilisation d’une police particulière et de couleurs spécifiques, qui deviennent des références lorsque nous sommes amenés à créer un habillage pour une page twitter, un blog, une en-tête de lettre, des cartes de visite, ou encore lors de la création d’un e-mail type, toujours dans un souci de cohérence qui accroît votre crédibilité.

En ce qui nous concerne, le graphiste aura posé quelques questions du type :

  • Pouvez-vous me donner quelques adjectifs pour décrire votre activité ?
  • Quel ambiance voulez-vous faire transparaître ?
  • Avez-vous des références de site Internet qui vous ont accroché ?

Le moindre indice que le client nous apporte est important dans le processus de création. A l’instar du logo, la réalisation de cette charte web représente un peu plus d’une journée de travail. Cela dépend vraiment de l’ampleur du projet et encore une fois du nombre de retours de la part du client.

3 – L’intégration de la page d’accueil du site

Lorsque la maquette graphique est validée, une première intégration de la page d’accueil est effectuée. L’intégration consiste à transformer une maquette (une image non cliquable) en une version interactive dans les navigateurs web. L’intégrateur, dont c’est le métier, va construire à l’aide de certains langages de programmation (HTML, CSS, parfois Javascript) une version web que le client pourra tester et visualiser dans un contexte proche du rendu final.

Cette étape est très délicate car l’intégrateur doit se conformer au graphisme et à l’ergonomie proposés par la maquette tout en respectant les différentes règles d’intégration et d’accessibilité, et en assurant la compatibilité avec tous les navigateurs internet, et ils sont nombreux ! (Internet Explorer, Firefox, Chrome, Opera, Safari, etc.).

C’est aussi très souvent l’intégrateur qui détermine la sémantique de la page, c’est-à-dire une cohérence dans la construction du document, notamment dans la hiérarchie et la structure du contenu (titres, images, textes, liens, etc.). Ce travail est très important car il aide les moteurs de recherche à mieux comprendre votre site et à déterminer les éléments clés de vos contenus (“zones chaudes”). Tout ceci contribue non seulement à l’optimisation de votre site pour le référencement mais représente aussi un gage de qualité.

Vous l’aurez compris, ce travail qui semble au premier abord assez simple s’avère en fait plutôt difficile, et seul un intégrateur professionnel et averti sera capable d’arriver à un résultat de grande qualité.

Lorsque la première version de l’intégration est achevée, nous communiquons une adresse internet (url) de test à consulter régulièrement pour suivre l’avancée des travaux. Il est très important pour nous que le client soit impliqué dans l’avancée du projet, car il a alors la possibilité de nous faire des retours au fur et à mesure, ce qui nous permet de répondre exactement à ses besoins.

4 – Les pages de contenu

Voici un des points les plus sensibles : créer ses contenus, son texte. L’étape sans doute la plus pénible pour le client et pourtant essentielle.

Quels avantages a-t-on à produire des contenus de qualité ?

En premier lieu, tout simplement pour donner envie aux visiteurs d’en savoir plus. Pour faire passer un message, pour donner en quelques mots une bonne image de votre société, de votre activité et renforcer votre crédibilité.

Ensuite, améliorer la visibilité du site et optimiser son référencement auprès des moteurs de recherche (Google par ex.).

Qu’est-ce que ça veut dire ?

Les moteurs de recherche référencent et positionnent les sites internet en fonction de critères très précis. Parmi les critères importants, nous retrouvons les titres, les liens et les textes du site.

Nous ne rentrerons pas dans le détail concernant les techniques de référencement car il nous faudrait plusieurs jours pour vous les expliquer mais sachez simplement que le positionnement sur un moteur de recherche est très stratégique. Il se fait sur certains termes et expressions, ou mots clés. Comme vous le savez peut-être, le but est que le site apparaisse dans les premiers résultats pour des recherches sur des expressions compétitives et naturelles (ce que saisirait naturellement un internaute). Pour cela, toutes les zones de textes du site doivent être articulées autour de ces quelques “mots clés”.

La rédaction des textes devient alors pénible et compliquée. Nous sommes en mesure d’apporter des conseils pour cette tâche. Le client peut alors demander une demi-journée, voir plusieurs, de formation pour se familiariser avec les méthodes à utiliser pour rédiger ses textes et comprendre l’importance et l’impact de ce travail.

Mais le référencement est devenu un métier complexe, à part entière, qui demande beaucoup de temps et une veille permanente, si bien qu’il peut nous arriver de faire appel à des agences spécialisées en fonction des attentes du client.

Notez donc que nous n’exerçons pas l’activité de référenceur, nous pouvons apporter quelques conseils dans le domaine, mais pour une approche plus pointue, l’intervention d’un professionnel du référencement est nécessaire.

5 – Développement des pages dynamiques du site

Qu’est-ce qu’une page dynamique ?

Une page dynamique, par opposition à une page statique, est une page dont le contenu peut varier en fonction de certaines informations. Ou encore une page nécessitant un traitement particulier en programmation pour fonctionner et donc l’utilisation d’un langage de programmation approprié (par exemple PHP).

Par exemple, une page contenant un formulaire de saisi (contact) est une page dynamique. La soumission du formulaire nécessite un traitement particulier qui est créé par un développeur.

Le temps nécessaire à cette tâche est très variable et dépend du nombre de pages dynamiques à créer et de leurs complexités.

6 – Mise en ligne et maintenance

Enfin, après avoir traversé toutes ces étapes, une fois que le site a été entièrement testé et validé par le client, nous effectuons ce que nous appelons une “mise en production” (ou recette).

Il existe deux cas de figure pour cette étape. Soit le client possède son propre hébergement, soit nous hébergeons le site sur un de nos serveurs.

Dans les deux cas, nous nous assurons de la mise en ligne du site et de le rendre accessible via le nom de domaine qui aura été préalablement déposé. Le site sera alors rendu public et sera accessible par tous via un navigateur internet.

Ce travail nécessite l’intervention d’un administrateur système. L’administration de serveur est également un métier complexe et pointu, nécessitant des compétences particulières. Parfois, les développeurs assurent eux-mêmes la mise en production d’un site, mais il est quand même recommandé de confier ceci à un administrateur compétent qui saura faire face à tout problème éventuel.

Projets complexes et sur-mesure ?

Nous avons détaillé les étapes d’un projet simple, mais néanmoins le plus courant.

Qu’en est-il pour un projet complexe ?

Un projet complexe nécessite une toute autre organisation, interne mais aussi avec le client. Certaines étapes sont les mêmes, le premier contact, la création du logo et de la charte graphique. Mais la suite du projet nécessite souvent l’intervention d’autres spécialistes et une gestion beaucoup plus fine.

Ici, le rôle du chef de projet est primordial. C’est lui, ou elle, qui va orchestrer le déroulement des opérations. Chez anonymation, nous pratiquons les méthodes agiles, arrangées à notre échelle et à la dimension du projet.

La méthode agile repose sur une implication maximale du client et sur des méthodologies de développement particulières. Le but est d’atteindre une réelle satisfaction du client et non de remplir “comme on peut” les termes du contrat. Pour rendre cela possible, le développement du projet se fait de manière itérative et incrémentale. Toutes les fonctionnalités sont mises à plat et leur développement est découpé en tâches. Chaque incrément, appelé “sprint”, représente la réalisation d’un certain nombre de tâches. Le but est de pouvoir montrer et faire tester une fonctionnalité au client à la fin de chaque sprint (entre 7 jours et 1 mois, en fonction de l’ampleur du projet).

Le client intervient donc dans toute la durée du développement, ce qui permet une validation continue des fonctionnalités et assure une satisfaction maximale, par opposition à une méthode de développement classique, dans laquelle le client ne voit le résultat qu’à la fin du développement et se rend parfois compte que ça ne correspond pas du tout à ce qu’il attendait.

Les méthodes agiles sont aussi centrées sur l’humain et repose sur la motivation de l’équipe de développement.

Plus d’informations : Méthode agile (wiki)

Ce type de projet demande la plupart du temps une grosse réflexion au départ et nécessite l’intervention d’un architecte logiciel qui va concevoir (sur le papier) l’application et déterminer les outils et les concepts à utiliser pour assurer la qualité du produit et sa pérennité. Un travail très important, effectué avant même de commencer à “programmer”.

L’aspect graphique et ergonomique est souvent traité en parallèle dès le début du projet.

Comme vous le voyez, la réalisation d’un projet peut demander une organisation complexe qu’il est très difficile de décrire avec précision en quelques lignes. Nous espérons quand même que ces quelques indications vous donneront une idée de ce qui se passe derrière un “gros” projet.

Conclusion

Evidemment, cet article pourrait-être complété d’un bon millier de conditions aux vues de la diversité et de la complexité des demandes auxquelles nous sommes confrontés.

J’ai pris volontairement le parti de “vulgariser” ces étapes ici pour donner une petite idée de ce qu’implique la création d’un site simple dans une agence web.

Je n’aborde pas certains points comme, les droits à l’image, les considérations techniques au niveau de l’architecture web et de l’hébergement, les contrats, le référencement, la maintenance, et bien d’autres aspects qui nécessiteraient l’écriture d’un livre en plusieurs tomes !

Quoiqu’il en soit, j’espère que cette article vous aura un peu éclairé sur le processus de création d’un site si vous passez par une agence.

Merci à Benjamin Dulau qui a largement participé à la rédaction de cet article !


Merci à Florian Fromentin (Photographe – Flexgraph) pour ses photos vraiment sublimes.
flickr de Florian Fromentin

1 commentaire :

  1. graff cathy :

    Merci pour cet article, clair et adapté pour des personnes comme moi qui faut l’avouer sont totalement incultes dans ce domaine. J’ai un projet d’ouverture d’e-boutique et là je me heurte réellement au sujet principal à savoir ” le site”, comment dois-je faire, à qui faire appel etc ??? vous apportez des réponses claires, et je reste sur mon idée première qu’il faut confier cela à des personnes dont c’est le travail et la passion !

    Merci encore pour cet éclairage ;-)

    Cordialement

    cathy Graff