SlideShare une entreprise Scribd logo
1  sur  54
Télécharger pour lire hors ligne
 
  2	
  
	
  
	
  
	
  
	
  
Master	
  1ère	
  année	
  
Mention	
  Information	
  Communication	
  	
  
	
  
	
  
	
  
	
  
Penser l’ergonomie et l’expérience
utilisateur d’un site internet :
l’art du web designer
	
  
	
  
L’apport et le rôle du métier de web designer au sein d’une agence
de communication/web
	
  
	
  
	
  
	
  
	
  
	
  
Stage	
  réalisé	
  au	
  Luxembourg,	
  
	
  
Sous	
  la	
  tutelle	
  de	
  Rudolphe	
  Aben,	
  directeur	
  d’agence	
  &	
  commercial	
  
	
  
	
  
Par	
  
Camille PERAZZI
	
  
Dates	
  du	
  stage	
  
04.04.2016	
  –	
  01.06.2016	
  
	
  
	
  
	
  
Tuteur	
  universitaire	
  :	
  	
  
Sébastien	
  Albert	
  
Année universitaire 2015-2016
  3	
  
Sommaire
	
  
INTRODUCTION	
  DU	
  PROPOS	
  ……………………………..…….……………………..	
  4-­‐8	
  
	
  
INTRODUCTION	
  …………….…………………………………………………………………….……….…………..	
  4	
  
PROJET	
  PROFESSIONNEL	
  &	
  OBJECTIFS	
  ……………………………….……………………….....……..	
  5-­‐6	
  
PLAN	
  DU	
  RAPPORT	
  DE	
  STAGE	
  PROBLÉMATISÉ	
  ………………….……………………..…………...	
  6-­‐8	
  
	
  
PRÉSENTATION	
  DU	
  CADRE	
  DU	
  STAGE	
  ………………………………………….	
  8-­‐12	
  
	
  
PRÉSENTATION	
  DE	
  L’ENTREPRISE	
  D’ACCUEIL	
  &	
  SES	
  OBJECTIFS	
  ……………….…………..	
  8-­‐9	
  
LISTE	
  DES	
  MISSIONS	
  ………………………………………………………………………….………………..	
  9-­‐11	
  
LE	
  CADRE	
  DE	
  LA	
  PROBLÉMATIQUE	
  …………………………….………….…………...……………..	
  11-­‐12	
  
	
  
PRÉSENTATION	
  DE	
  LA	
  PROBLÉMATIQUE	
  ….………………..……………..	
  12-­‐16	
  
	
  
ENONCIATION	
  DE	
  LA	
  RÉFLEXION	
  PROBLÉMATISÉE	
  …………….…..…….…………………..	
  12-­‐14	
  
LES	
  CRITÈRES	
  &	
  FINALITÉS	
  QUI	
  FONDENT	
  LA	
  PERTINENCE	
  DE	
  LA	
  RÉFLEXION	
  
PROBLÉMATISÉE	
  ……………………………………………………………………….………………………14-­‐16	
  
	
  
TRAITEMENT	
  DE	
  LA	
  PROBLÉMATIQUE	
  ………………..….……….………..	
  16-­‐33	
  
	
  
INTRODUCTION	
  ………………………………………………………..………………..………….…………..	
  16-­‐18	
  
PENSER	
  L’EXPÉRIENCE	
  UTILISATEUR	
  :	
  UNE	
  ÉTAPE	
  PRIMORDIALE	
  DANS	
  LA	
  
RÉALISATION	
  D’UN	
  SITE	
  WEB	
  	
  ……………………………………………………..….…………….…..	
  19-­‐26	
  
	
  
	
   ERGONOMIE	
  &	
  UTILISABILITÉ	
  …………………………………………………………………...…………………….	
  19-­‐21	
  
	
   WEB	
  DESIGNER	
  :	
  LE	
  TRAVAIL	
  EN	
  AMONT	
  POUR	
  PENSER	
  L’INTERFACE	
  	
  
HOMME-­‐MACHINE	
  (IHM)	
  ………………………………………………………………………………..……………….	
  21-­‐23	
  
	
   LE	
  DESIGN	
  PERSUASIF,	
  UNE	
  CLEF	
  POUR	
  SÉDUIRE	
  &	
  SATISFAIRE	
  ?	
  …………………………..……….	
  23-­‐26	
  
	
  
LES	
  ATOUTS	
  &	
  LES	
  LIMITES	
  DE	
  L’USAGE	
  DES	
  TEMPLATES	
  	
  ………..………………..……..	
  25-­‐32	
  
	
  
	
   DE	
  LA	
  FICHE	
  DE	
  STYLE	
  À	
  WIX	
  EN	
  PASSANT	
  PAR	
  WORDPRESS,	
  QUEL	
  SENS	
  ?	
  …………………….	
  26-­‐28	
  
	
   VERS	
  UNE	
  STANDARDISATION	
  DES	
  SITES	
  ?	
  …………………………………………………………..………….	
  28-­‐31	
  
	
   AVANT	
  TOUT	
  UNE	
  ENVIE	
  DES	
  CLIENTS	
  :	
  UNE	
  LOGIQUE	
  D’ADAPTATION……………..…………….	
  31-­‐32	
  
	
  
CONCLUSION	
  ………………………………………………………………………………..……….…………..	
  33-­‐35	
  
	
  
RÉFÉRENCES	
  ……………………………………………………………………...……..……..	
  36	
  
	
  
REMERCIEMENTS	
  ……………………………………………………………..……………..	
  37	
  
	
  
ANNEXES	
  ……………………………………………………………………..……………..	
  38-­‐49	
  
	
  
ÉVALUATION	
  DU	
  STAGE	
  ………………………………………………………...………..	
  51	
  
	
  
	
  
  4	
  
I. Introduction du propos.
1. Introduction.
Relativement différent du programme de licence 3 en terme d’approfondissement des
notions et de pratique, le master 1 en information et communication parcours création de
projets numériques offre davantage de matières et d’outils afin de nous professionnaliser et de
concrétiser notre projet futur. Durant cette année nous avons ainsi manipuler davantage
certaines notions notamment l’HTML/CSS mais nous avons également fait du benchmarking,
du web design etc. Tous ces éléments qui, rassemblés, nous plongent dans le monde du
travail. De plus, nous avons vu en profondeur ce qu’était le métier de chef de projet lors du
lancement et de la création du projet fil rouge, une réelle mise en situation de ce qui nous
attend dans le monde professionnel : travail en équipe, collaboration, contact avec le client,
respect du cahier des charges, les délais etc. Le stage est venu compléter et concrétiser cela en
mettant directement en application nos connaissances et acquis universtaire. Celui-ci sert ainsi
à lier nos facultés et à les mettre en oeuvre au service de l’entreprise qui nous accueille. En
retour, celle-ci doit également nous apporter son savoir, savoir-faire et façon de travailler afin
que nous ayons une approche plus précise du métier convoité et d’enrichir nos connaissances
dans la communication numérique. Chaque entreprise est différente, qu’elle soit agence de
communication, agence web ou plus grande société, leur approche, leur façon de
communiquer et de répondre aux besoins des clients restent différentes.
En tant que stagiaire dans une structure, il est important de développer et montrer nos
acquis, qu’ils soient universitaire ou non, en tant que plus-value à apporter à l’agence qui
nous accueille. Il sert également à nous projeter dans un métier proche ou égal à celui que
nous convoitons et les tâches confiées seront des expériences qui viendront, ou non, confirmer
nos choix. Cette mise en situation est bénéfique afin de voir le déroulement total ou partiel
d’un projet, de voir la communication de l’entreprise et également comment elle se
positionne. Cette immersion professionnelle est également un excellent moyen de se
perfectionner puisqu’en étant directement en situation dans un contexte donné, il est plus
facile d’appréhender et d’apprivoiser la tâche confiée. En outre, il est judicieux d’être stratège
et tacticien dans la recherche du stage ainsi que dans la structure suivant les missions à
effectuer pour, au mieux, avoir une vision positive qui pourrait nous conforter dans notre idée
de départ en terme professionnel.
  5	
  
2. Projet professionnel et objectifs.
Du point de vue personnel, j’ai suivi le parcours “logique” puisque j’ai validé ma
licence en information et communication l’année dernière et que mon objectif était, et est
toujours, de mener à bien ce même master. Grâce à ce parcours, je bénéficie déjà d’une
expérience professionnelle issue du même domaine à l’aide du stage réalisé en lience 3 dans
une agence de communication chez Mescudi1
. Ce stage, qui avait pour mission principale
d’être infographiste, m’avait également montré le métier de chef de projet tout en restant
actrice de celui-ci puisque ce n’était pas ma tâche principale. Suite à ce stage je possède déjà
des notions concernant la gestion de projet (les budgets, les tâches, les délais, les relations
avec les clients etc.) tout en restant extérieure à ce métier. En somme, ma mission principale
consistait à créer des logos, des cartes de visite, des visuels, des flyers en dehors des tâches
secondaires pour suppléer les employés dans leurs réalisations. Ce stage était enrichissant
puisqu’il vient parfaitement compléter mon projet futur qui consiste à devenir chef de projet
spécialisé web designer. En tant que web designer il est important de maitriser, au minimum,
les bases des outils de la suite adobe tels que Photoshop et Illustrator et c’est justement mon
précédent stage qui m’a permis d’acquérir ces compétences très utiles pour le futur. Par
conséquent, mon stage réalisé en licence 3 était une parfaite mise en situation dans laquelle
j’ai pu être spectatrice du métier que je convoite en tant que chef de projet, et les cours de
master 1 sont venus intensifier cela avec davantage d’exemples et de notions comme la
création des devis et le travail en équipe, par exemple.
Mon souhait est de travailler dans une agence de communication web, une structure où
la polyvalence serait maitre. Je convoite une agence réunissant une petite équipe où l’entraide,
l’écoute et la communication seraient primordiales. Au sein de l’équipe je n’hésiterai donc
pas à être polyvalente : être chef de projet, être web designer ainsi que conseiller et écouter
mes collègues.
Au sein du stage de master 1 c’est principalement la polyvalence qui est ressortie,
puisque, nous le verrons par la suite, j’ai assisté mon maitre de stage et j’ai également mener à
bien diverses tâches réalisables au sein d’une agence web (community management, web
développeur, graphiste, photographe etc).
En débutant en tant que chef de projet junior et d’après mon expérience je pense être en
mesure de gérer l’ensemble d’un projet et de répondre aux besoins exprimés des clients suite
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
1
Agence de communication - Thionville
  6	
  
au cahier des charges. Mon sens de l’observation, ma curiosité, mon sens relationnel et mon
sérieux sont des qualités importantes qui respecterons la qualité du travail effectué mais aussi
les délais et le budget suivant les projets. Concernant la spécialité du métier de web designer
cela serait une réelle passion de mettre en oeuvre mes connaissances et expériences avec
internet pour répondre à la demande du client à l’aide d’un dispositif créatif, original,
moderne et innovant, en veillant bien évidemment à respecter le cahier des charges défini
auparavant. Concevoir un site internet en pensant sa structure, son design et les interactions
qui vont découler tout en étant à la fois chef de projet serait tout à fait crédible et possible
dans une agence de communication/web d’une petite structure.
Ce sont mes deux expériences précédentes, mon savoir, mes acquis universitaires et
ma façon d’être qui me confortent dans l’idée de métier que je souhaite exercer l’année
prochaine : chef de projet spécialisé web designer.
3. Plan du rapport de stage problématisé.
Nous l’aborderons plus en détail dans la partie suivante qui présentera l’entreprise,
l’agence qui m’a accueillie est constituée de deux associés qui ont pour mission principale de
créer des sites internet. Leurs valeurs sont les suivantes : répondre au plus vite à la demande
des clients en les satisfaisant à l’aide d’un site sobre, simple et un devis proportionnel. De ce
fait, cette dernière juge qu’un web designer n’est pas primordial pour la réalisation d’un site
web du fait qu’avec ce métier on ne peut donc pas lier rapidité et simplicité dans la
conception d’un site internet.
Web designer étant le métier que je souhaite intégrer dans mon futur métier, j’ai donc
jugé important de traiter le rôle de celui-ci au sein de la problématisation de mon stage. Grâce
aux cours reçus en licence 1 et principalement grâce à Olivier Beining2
qui nous a offert ses
connaissances et fait découvrrir son métier, je juge cette fonction comme était indispensable à
la réalisation d’un site internet qui réponde au mieux à la demande des clients mais, avant
tout, des internautes qui vont naviguer sur le site.
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
2
Professeur du cours de Web Design – Semestre 1 Master 1
  7	
  
Du point de vue de l’entreprise d’accueil, Business Casanova, la réalisation de leurs
sites internet se fait via le CMS3
Wordpress et, le plus souvent, avec l’aide du thème Divi qui
permet des possibilités multiples et reste assez souple dans son utilisation. Il va de soit
qu’avoir un web designer au sein de son équipe permet de développer la créativité et
l’orignalité d’un site internet en le démarquant ainsi des autres. En utilisant des templates4
présents sur Wordpress et en prônant la rapidité et la simplicité nous verrons que cela peut
être un frein à la démarcation et l’innovation au sein du web. Cependant, nous sommes
conscients que l’écoute du client est nécessaire et qu’il faut ainsi tenir compte avant tout de
ses besoins auxquels répond positivement l’agence Business Casanova en satisfaisant les
demandes.
Nous aborderons donc au fil de la rédaction du mémoire de stage quels sont les
avantages et les inconvénients d’avoir recours à des layouts en pensant le métier de web
designer comme étant utile en terme d’inventivité mais aussi en ce qui concerne l’expérience
utilisateur. Il faut penser l’apport du métier de web designer comme efficace pour aborder
l’ergonomie et l’utilisabilité d’un dispositif, en l’occurrence d’un site internet. A travers ce
mémoire de stage, il sera intéressant de définir les tâches du métier de web designer et ce qu’il
englobe pour penser l’interaction homme-machine. Pour illustrer cela nous pourrons évoquer
cette relation internaute-site internet à l’aide du design persuasif relevant ainsi du métier de
web designer comme étant positif pour cette interaction.
Dans un second temps nous traiterons des limites de l’usage des gabarits ainsi que leurs atouts
en retrançant l’évolution de l’élaboration des sites internet en partant de la fiche de style en
passant par Wordpress et Wix. Dans cette approche il sera approprié de s’orienter vers la
question suivante : sommes-nous en train de tomber dans une standardisation des sites via ces
usages ? Mais avant tout, les métiers de la communication doivent répondre à la demande des
clients qui est l’acteur décisif du projet, notamment pour le délai, les étapes de validation, le
budget et pour la notoriété de l’agence de communication/web en elle-même.
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
3
Un CMS – ou SGC – (système de gestion de contenu) : “programme informatique utilisant
une base de données et permettant de gérer de A à Z l’apparence et le contenu d’un site web.”
– www.cms.fr
4
Synonymes récurrents au sein de ce rapport : layout, gabarit, modèle de page. Ce sont de
modèles préconçus sur lequel les web développeurs se basent pour confectionner les sites.
  8	
  
C’est donc autour de cette problématique que sera rédigé mon rapport de stage en tentant de
convaincre que la présence et le travail d’un web designer est bénéfique pour une agence de
communication.
II. Présentation du cadre du stage.
1. Présentation de l’entreprise d’accueil et ses objectifs.
L’entreprise Business Casanova est une agence web située au Luxembourg. Présente
sur le marché depuis 1 an et demi, cette dernière a déjà à son actif des références
conséquentes pour parfaire son image et sa réputation.
Constituée de deux principaux acteurs que sont Rudolphe ABEN et Emilien JOURDAN, ces
derniers ont développé l’agence en vue de créer une communication web efficace pour leur
clientèle.
Leur façon de travailler est peu commune dans le monde de la communication
puisqu’ils privilégient le travail à distance, soit le télétravail. Dans cet environnement de
travail chacun a une tâche bien définie :
-­‐ Rudolphe : le commercial chargé de trouver les clients et leur vendre le produit. Il
assure également la partie administrative, notamment la confection des devis et la
gestion du produit en se rendant directement chez le client lui présenter leurs
créations.
-­‐ Emilien : le web développeur chargé de répondre à la demande des clients en leur
créant le site internet souhaité.
L’agence en elle-même a donc pour finalité de concevoir des sites internet en
répondant à la demande des clients. Il peut s’agir de site vitrine ou d’e-commerce, selon la
visée souhaitée. Pour ce faire, l’entreprise est friande du CMS Wordpress qui est leur outil de
développement qu’ils jugent souple, maniable et simple d’utilisation pour eux et leurs clients.
Pour accompagner le site web, ils proposent également la confection des réseaux sociaux
utiles au bon développement de l’entreprise de leur clientèle ainsi que pour avoir une
communication plus efficace. Elle propose également de référencer au mieux leurs
productions afin de générer du trafic et positionner le site sur la toile, toujours suivant la
volonté du client. Pour compléter cela, Business Casanova propose de faire des campagnes e-
  9	
  
mailing dans le but de fidéliser les clients et/ou d’attirer des prospects à l’aide de ces
campagnes modernes et intelligentes.
Un point propre à l’agence est à noter, cette dernière démarche les clients par téléphone
afin de leur proposer leurs services et convenir d’un rendez-vous pour présenter le devis.
Autrement dit, les clients ne viennent pas directement à l’agence puisque Business Casanova
ne possède qu’un bureau pour y travailler lorsqu’ils ne privilégient pas le télétravail. C’est
cette partie que Rudolphe prend en main afin de gagner des clients.
2. Liste des missions.
Mission Client Détails de la mission
Gestion des réseaux
sociaux – Community
Management
-­‐ Textinova
-­‐ The Best Key
-­‐ Yves Braun
-­‐ Hortos Fleurs
Intégration de contenus (textes et
images), création de concours,
interaction avec les clients.
Création d’infographies
-­‐ Business Casanova
-­‐ Yves Braun
-­‐ The Best Key
-­‐ Textinova
Réalisation d’un diaporama
présentant l’entreprise (valeurs,
travail, référence).
Modernisation de logos et création
pour des réseaux sociaux.
Audit
-­‐ Textinova Comprendre et analyser le client
ainsi que son site existant. Proposer
des améliorations pour vendre et
mieux référencer le site. Trouver
des markets place pour mettre les
articles.
Traduction -­‐ Textinova Traduction du site entier en italien.
Photographies
-­‐ Tommys Box
-­‐ Hortos Fleurs
-­‐ Tapis d’Orient
-­‐ Frising Decoration
-­‐ Yves Braun
Photographies réalisées à l’aide de
mon reflex pour mettre à jour le
contenu image des sites des clients.
-­‐ Tommys Box : plats
japonais.
  10	
  
-­‐ Hortos Fleurs : compositons
florales et bijoux.
-­‐ Tapis d’Orient : tapis;
-­‐ Frising Decoration :
devanture de la boutique.
-­‐ Yves Braun : ses nouveauté.
Intégration de contenus
-­‐ Tommys Box
-­‐ Hortos Fleurs
Intégration des photographies prises
pour innover, moderniser le site et
pour proposer des contenus non
existants pour un site en création.
Découverte e-
commerce
-­‐ Textinova Création de codes promotionnels
pour qu’ils soient applicables lors
des concours annoncés sur
Facebook.
Création de
Newsletters
-­‐ Tous les clients de
l’agence
Pour Textinova : création et envoi
de la première newsletter pour la
cliente. Création du visuel, du texte,
du code promotionnel et de l’envoi
grâce au dispositif MailChimp.
Pour les autres clients : création du
design des newsletter de
présentation de leur entreprise.
Création de site
-­‐ The Dog Company Refonte totale d’un site existant à
l’aide de Wordpress et du thème
Divi. Création des pages, du texte et
de la navigation complète.
Récupération du contenu déjà
existant (texte et image).
Création du logo et de la charte
graphique.
Finalité : créer un site moderne, à
l’image de l’entreprise et
responsive.
  11	
  
Formations
-­‐ Gisèle (seconde
stagiaire de
l’agence)
-­‐ Wordpress (présentation du
tableau de bord, création de
pages, présentation de thème
divi + installation d'autres
thèmes, création d'un menu,
intégration de contenus)
-­‐ Réseaux sociaux (création
de Facebook, Instagram,
Twitter)
-­‐ Mailchimp (Création de
compte + création templates
+ créer une liste)
-­‐ Trello (présentation de
l'outil)
-­‐ Formation à distance à
l’aide d’une vidéo.
3. Le cadre de la problématisation.
Rappelons le, Business Casanova ne souhaite pas intégrer de web designer au sein de son
agence. Etant donné que je souhaite mettre en avant mes compétences et savoirs acquis lors
de mes années universitaires, je suis en mesure de juger la présence d’un web designer
comme étant primordiale au bon déroulement du processus de création d’un site web.
Business Casanova est une petite structure composée de deux membres, la polyvalence est
ainsi maîtresse. Après de longues discussions avec mon maitre de stage, Rudolphe Aben, je
suis parvenue à mieux cerner leur façon de travailler : travailler vite et le moins cher possible
pour répondre à la demande du client. Ce faisant, l’agence ne juge pas important d’avoir un
web designer dans la conception puisqu’il s’agirait d’une perte de temps et d’argent. Penser
l’expérience utilisateur avant le lancement du site est mineur pour eux puisqu’ils fonctionnent
de la sorte : c’est eux qui proposent un site au client, ce n’est pas le client qui vient à eux pour
qu’ils réalisent sa demande. En se rendant ainsi chez le client pour le démarcher, Rudolphe
  12	
  
prend des notes sur son carnet et transmet cela oralement à son associé Emilien qui réalise le
site internet. Les étapes en amont de la création d’un site web ne sont donc pas nécessaires et
importantes pour concevoir un site internet selon Business Casanova.
Le cadre de mon mémoire de stage consiste donc à démontrer que pour rendre
l’expérience utilisateur la plus positive possible lors de la mise en ligne du site, il y a des
étapes à prendre en compte afin de penser cette expérience avant le produit mais également
que le rôle du web designer est utile d’un point de vue timing. A travers des exemples
concrets dont j’ai été témoin pendant mon stage nous verrons qu’il accélère le productivité et
donc le gain de temps. Outre la créativité, l’innovation et l’originalité que pourrait apporter un
web designer grâce à ses compétences, il faut mettre en avant que son rôle consiste à anticiper
l’usage du site en répondant aux attentes des internautes. Pour accentuer cela, nous pouvons
également évoquer les tâches du web designer UX qui va encore plus loin en ayant recours à
diverses méthodes (brainstorming, cartes d’idéation, expérience maps etc.) concernant cette
expérience homme-machine. Ce travail aurait été important d’approfondir mais je pense
sincèrement que cela résulte d’un travail de mémoire de recherche et non de mémoire de
stage. C’est pourquoi je vais me concentrer sur le métier de web designer qui réalise les
étapes en amont de la conception en recourant à la méthode dite “maquettage”.
III. Présentation de la problématique.
1. Enonciation de la réflexion problématisée.
Du fait que l’entreprise Business Casanova n’utilise que le CMS Wordpress et
principalement le thème Divi et, plus ancien, Modern Interior pour satisfaire les demandes des
clients, nous pouvons remarquer au fil de leurs réalisations une certaine “standardisation” et
redondance des sites. Pour cette agence, l’utilisation de templates vient accentuer l’idée que le
web designer n’est pas nécessaire pour penser l’interface, l’ergonomie ainsi que le design du
futur site. C’est de ce point de vue que sera donc orienté mon mémoire de stage où le recours
à des layouts permet à une agence de se passer d’un web designer.
Suite à cela, nous pouvons poser la problématique suivante :
Quelles sont les limites de l’usage des templates et quels sont les apports spécifiques du
web designer dans la conception web ?
  13	
  
Pour concevoir un site internet, il est primordial de penser l’interaction des futurs
usagers avec le site en question. L’ergonomie est donc un point à prendre en compte de la part
d’un web designer, il doit en effet adapter le site afin qu’il soit fonctionnel, simple
d’utilisation, qu’il réponde tout simplement aux besoins des usagers suivant la finalité du site
(site vitrine ou e-commerce par exemple). Pour faire cela au mieux il existe diverses
méthodes que ce métier doit prendre en compte pour la conception. Nous le disions
précédemment, la méthode de maquettage est une réponse à cela, autrement dit les étapes de
conception de l’arborescence, des zonings, des wireframes et les maquettes graphiques. Pour
aller plus loin, il existe également le métier de web designer UX qui conçoit et évalue
d’autant plus les sytèmes interactifs tels qu’un site internet mais, comme dit précédemment,
cela relèverait d’un travail de mémoire plutôt que d’un rapport de stage problématisé.
Cependant, le web designer peut tout aussi bien s’inspirer des méthodes utilisées par le web
designer UX si l’entreprise l’autorise puisque les méthodes pratiquées demande du temps.
L’ouvrage principal qui constitue certaines notions et outils utiles pour ce mémoire de
stage est, sous les conseils de Luc Massou, Méthodes de design UX – 30 méthodes
fondamentales pour concevoir et évaluer les systèmes interactifs de C.Lallemand et
G.Gronier. De façon générale, ce livre donne des définitions de termes clefs bénéfiques à la
rédaction de ce mémoire de stage mais également des règles et méthodes propices au bon
développement d’un système interactif, dans notre cas, d’un site web. Comme le mentionne le
titre du livre, il s’agit d’approches du web designer UX, il est donc judicieux de trier les dires
afin de nous occuper uniquement des parties qui se rapprochent du métier de web designer, au
risque d’aller trop loin.
Nous le savons, un site internet contemporain doit se détâcher des autres afin de se distinguer
de la concurrence. Par conséquent, le web designer doit rendre le dispositif attirant, agréable,
prenant et ce livre guide le web designer à l’aide de méthodes pour penser et développer ce
système interactif. Ce sont des pratiques à assimiler et intégrer dans les étapes de conception
afin de satisfaire le client dans ses souhaits mais, surtout, pour faire en sorte que le site lui soit
bénéfique et réponde à la demande des internautes dans leur navigation et recherche(s).
En outre, cet ouvrage est une piste intéressante pour nourrir ma rédaction puisque
centré directement sur le métier au cœur de mon rapport et également sur le métier dont fait
l’impasse l’entreprise Business Casanova. Il s’agira donc pour moi, à travers mon expérience
personnelle, mes acquis universitaires et mon observation tout au long de mon stage de master
1 d’argumenter l’idée principale qui constitue ce rapport de stage problématisé.
  14	
  
Au vue de mes constatations de ce stage chez Business Casanova, les savoirs offerts par mes
professeurs d’information et communication ainsi que la vision personnelle que j’ai du
fonctionnement d’une agence de communication je pense sincèrement que nous ne pouvons
pas concilier la conception d’un site web sans un web designer, en tout cas, pas dans un esprit
original, innovant et créatif. Les templates Wordpress utilisés par l’entreprise d’accueil
permettent de multiples possibilités mais nous nous aperçevons rapidemment que les sites
fournis aux clients présentent tous des similitudes au niveau du design, de l’ergonomie et de
l’interaction (structuration des pages, les menus, les photos, les icônes etc). Cette même
identité visuelle permet de répondre à l’idée suivante : créer un site rapide et pas cher. C’est
donc de ce point de vue que se basera ma réflexion, sur le fait que l’usage de layout pour
confectionner des sites participe à la standardisation de ces derniers et, ce faisant, le web
designer n’est pas déterminant dans la production de site.
2. Les critères et finalités qui fondent la pertinence de la réflexion problématisée.
Le métier de web designer est la spécialité que je souhaite intégrer dans mon futur
métier en tant que chef de projet spécialisé web designer. Mon expérience avec internet n’est
pas à négliger, que ce soit pour mon projet futur ou, à plus petite échelle, ce rapport de stage
problématisé. Ce constat s’est présenté à moi il y a quelques mois lors de la venue d’Olivier
Beining passioné de son métier qui nous a également fait découvrir une de ces facettes. C’est
à travers ce cours que j’ai pris conscience que pour devenir web designer il faut avoir déjà
acquéri une expérience conséquente en terme de navigation sur le web afin d’assimiler
certaines notions et structures. C’est à force de persuasion et découverte que nous arrivons à
intégrer certaines normes propres au site internet, ces règles ergonomiques qui facilitent le
parcours de l’internaute pour arriver à ses fins (notamment la règle des 3 clics5
, une
structuration logique, une cohérence etc.), et cette faculté se présente à moi en tant
qu’internaute quotidienne (autrement dit, ma navigation sur divers sites à fréquence
rapprochée fait que j’acquiers une expérience conséquente pour visualiser et naviguer dans un
site en toute sérénité).
De plus, en terme de comparaison, nous pouvons assimiler le métier de web designer à celui
d’architecte. Logiquement, il est impensable de construire sa maison sans des plans
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
5	
  Règle ergonomique selon laquelle l’usager doit pouvoir accéder à l’information recherchée
par 3 clics ou moins.	
  	
  
  15	
  
préalablement élaborés et pensés par un professionnel. Il en va de même pour produire un site
internet qui répondra aux besoins exprimés et recherchés des internautes : le web designer, en
tant que professionnel, concevra et organisera le site de sorte à ce que l’internaute navigue sur
le site et accède à l’information qu’il est venu chercher. Certes nous sommes conscients que
les gabarits proposés par les divers systèmes de gestion de contenu, tels que Wordpress par
exemple, répondent à ce besoin ergonomique en structurant et en proposant des mises en page
préfaites qui répondent à ce besoin d’utilisabilité. Néanmoins, actuellement, pour se
démarquer de la concurrence il est important de se distinguer, d’avoir sa propre mise en forme
et c’est également une tâche à réaliser de la part d’un web designer. Il s’agit alors d’une phase
essentielle dans la création d’un site en terme d’ergonomie, d’utilisabilité et d’accessibilité en
cernant les internautes (la cible du client) et le client. En construisant l’identité visuelle et la
charte graphique du client il doit également tenir compte des spécificités techniques du web,
comme nous le disions précédemment, les règles ergonomiques par exemple.
Cette approche est conforme à la spécialité “création numérique” puisque Web Design fut
même un cours que nous avons suivi au cours du premier semestre de master 1.
Directement lié au stage, lors de l’envoi de mon curriculum vitae et de ma lettre de
motivation en octobre 2015 le titre de mes courriers évoquaient bien l’envie d’exercer le rôle
de web designer dans leur structure, en plus de proposer mon aide et donc d’être polyvalente
chez eux. Cependant, lors de mon arrivée je me suis rendue compte que le métier de web
designer ne faisait pas partie de leur habitude de travail, c’est pourquoi j’ai rapidemment
abordé ce point avec mon maitre de stage puisqu’il devait s’agir de ma mission principale. Il y
a eu effectivement un malentendu sur ce point puisque, pour lui, le métier de web designer est
le même qu’un infographiste. Et en approfondissant ce métier, en lui expliquant les tâches,
missions et intérêts d’un web designer il s’est avéré que ce métier “n’est plus d’actualité dans
le monde travail d’aujourd’hui, qu’il s’agit d’une perte de temps et d’argent”. Je me suis donc
fié à ces règles en tentant justement de comprendre leur mode de travail ainsi que de voir les
lacunes et difficultés que l’agence pouvait jsutement rencontrer en omettant d’avoir un web
designer dans son équipe. C’est pourquoi, très rapidemment, j’ai eu envie de mettre à l’écrit
dans ce mémoire de stage cette problématique rencontrée.
Du côté universitaire et concordance avec mes études en information et communication
parcours création de projets numériques, la problématique de mon mémoire de stage est
clairement une question intéressante à aborder. En se référant au mode de travail utilisé par
l’agence de communcation Business Casanova nous pouvons ainsi réellement de poser la
question suivante : le web designer est-il fondamental pour concevoir un site internet ? C’est
  16	
  
justement là que réside toute ma réflexion qui va suivre. Dans l’ère de l’immédiateté, les
clients souhaite avoir leur produit fini livré le plus rapidemment et le moins cher possible :
c’est à cette demande que répond Business Casanova. Cependant, cette façon de travailler
remet totalement en cause le métier du web designer qui ne serait alors plus bénéfique et
nécessaire pour penser et concevoir un site internet. Mon point de vue s’oppose à cela
puisqu’en tant qu’étudiante à l’université de Lorraine en créations numériques, nous sommes
conscients qu’il faut aller au delà de la simple utilisation de gabarits de page préfaits par les
systèmes de gestion de contenu. En ce sens, il y a des stratégies à aborder pour justement
positionner le client sur le marché afin que son site internet lui apporte quelque chose. Une
simple présence sur internet ne suffit plus, il faut aller au delà et donc se pencher directement
sur côté utilisateur, ce à quoi doit veiller un concepteur de site internet : un web designer. La
plus-value de cet acteur est notable dans la confection de portails d’informations, de sites
d’entreprises, de sites commerciaux etc.
C’est justement à travers ce mémoire de stage que sera abordée cette problématique liée à
l’usage constant des layouts et en quoi cela participe à la standardisation des sites internet de
sorte à ce que le client ne puisse pas réussir à se démarquer sur la toile de ses concurrents et
donc d’attirer les clients.
IV. Traitement de la problématique.
Introduction.
La naissance du World Wild Web est la conséquence de ce que nous pouvons
aujourd’hui visionner et créer sur la toile. La volonté du créateur Tim Berners-Lee de pouvoir
naviguer d’un réseau à un autre en reliant des ordinateurs les uns avec les autres a constitué le
web d’aujourd’hui. Cette idée, datant de 27 années, est un mode d’organisation réticulaire de
l’information qui renvoyait à une forme d’utopie que représente cette technologie numérique
actuellement. Cette notion de partage et de stockage d’information reste le pillier de l’histoire
du numérique qui a donné naissance au monde de la société de l’information. Les bases du
web constituent une interface hypertextuelle permettant l’accès à l’information, c’est cette
même philosophie que nous retrouvons encore aujourd’hui grâce au deploiement des sites
internet. Au sein du Web 2.0 actuel, le web a cessé d’être un objet informatique pour devenir
un objet info-communicationnel où la démocratisation de l’écriture, le web participatif et le
web social sont maîtres. C’est autour de ces notions que se concentrent les agences de
  17	
  
communication pour parfaire leur mission : répondre aux demandes et besoins de leurs
clients. Autrement dit, le web étant en perpétuelle expansion a permis aux développeurs de le
rendre plus utile et captivant. Certains changements ont vu le jour au sein de cette évolution
constante : l’html, le css, les divers navigateurs et le responsive web design6
qui sont
également des conséquences directes sur les métiers que nous retrouvons dans une agence de
communication/web. Qu’ils soient infographistes, web développeurs ou bien encore chefs de
projet numérique, ces acteurs se doivent d’être à jour au niveaux des logiciels mais également
des pratiques qui émergent. Ces règles influent directement sur l’ergonomie d’un site internet
ou bien encore sur l’utilisabilité et son affordance qui sont des points à ne pas négliger pour
rendre un site innovant et moderne. L’usage quotidien que nous avons de ces dispositifs est
rendu possible grâce à cette évolution constante du web où l’idée de rendre la vie meilleure
prend tout son sens en s’adaptant aux besoins et envies des internautes. Le fait que le web soit
mouvant a notamment fait naitre de nouveaux métiers qui sont propres au numérique et requis
pour concrétiser un projet : le community manager en est un exemple, mais également le web
designer.
Au départ déstiné aux militaires et donc à un usage privé, le web est, à l’époque actuelle,
devenu indispensable et ancré dans nos habitudes. L’envouement de celui-ci ne s’est
évidemment pas fait sans conséquences pour les entreprises qui ont tiré profit de cette
stratégie de visibilté offerte par l’univers d’internet. Cette technologie mouvante a profité au
développement des agences de communication/web pour développer leur métier et faire
profiter de leurs compétences à leurs clients. Dans cette ère contemporaine il est primordial de
posséder un site internet pour une société : que ce soit, à petite échelle, pour entrer en contact
avec celle-ci ou, à plus grande échelle, acquérir de nouveaux clients ou bien encore pour
augmenter les ventes d’une certaine marque. D’un simple site vitrine, aux e-commerces les
plus développés, il est important d’être visible et surtout accessible sur le web. Nous sommes
dans une période où l’immédiateté règne, l’individu veut avoir accès à ce qu’il souhaite le
plus rapidemment possible et avoir un site internet est un remède à cela. Cependant, nous
sommes conscients que la facilité de bénéficier d’un site web est actuellement en expansion et
qu’il est de plus en plus rare qu’une entreprise ne possède pas, au minimum, un simple site
pour entrer en communication avec ses clients. Là est la subtilité pour une agence de
communication d’innover et de démarquer le site internet de son client afin de maîtriser la
concurrence et lui offrir la meilleure visibilité possible. Au risque de basculer vers une
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
6
Adaptation du site sur les versions mobiles et tablettes.
  18	
  
standardisation des sites, il faut être créatif et innovateur tout en respectant les standards du
web imposées. Ces normes évoluent également, en même temps que le web lui-même. Les
sites internet qui constituent ce web sont en constante mutation et le design d’une page est
“victime” de cela. Loin sont les blocs gris, les logos simples et les navigations basiques, place
au dynamisme, aux graphismes les plus proches de la réalité possible et aux parcours les plus
fous. Malgré ces nombreuses possibilités offertes parle web aujourd’hui, il faut néanmoins
rester lucide vis à vis des normes du web en terme d’ergonomie, d’utilisabilité, d’accessibilité,
de graphisme et d’écriture. Pour justement penser cette interface homme-machine ces
éléments sont à prendre en considération pour réaliser un site afin de répondre aux besoins
exprimés par les internautes mais également pour les fidéliser avec la marque et/ou le site
dont il est question. Ainsi, à l’heure où avoir un site internet est possible pour toute entreprise
et où le nombre de sites ne cesse de s’accroitre il est important de bénéficier d’un web
designer au sein de son équipe pour concevoir et penser un site internet au risque que le site
créé ne se perde parmi les concurrents. L’importance de cet acteur est donc importante dans la
création d’un site puisque le web designer va construire “le plan” du futur site en tenant
compte des envies du client, en ajoutant ses connaissances et sa touche créative en prenant
soin de faire valider certaines étapes nécessaire à l’avancement du projet. Utiles, ses tâches
viendront positionner la clientèle sur le web à l’aide d’un site répondant à la demande du dit
client et des internautes mais également à l’aide d’un design innovant et d’une ergonomie
notable en veillant au cahier des charges établi. A l’inverse, et toujours selon les valeurs
prônées par l’agence, l’absence d’un web designer et donc l’utilisation constante d’un CMS et
d’un thème en particulier va créer une certaine redondance des sites internet. L’utilisation
récurrente d’un même thème vient accentuer cette idée où, à quelques couleurs et
organisations près, la structuration des sites seront extrêmement similaires, proches de la
standardisation.
C’est pourquoi nous pouvons nous demander quelles sont les limites de l’usage des
templates et quels sont les apports spécifiques du web designer dans la conception web ?
Nous aborderons dans un premier temps l’expérience utilisateur comme étant une
étape primordiale dans la réalisation d’un site web puis, dans un second temps, nous verrons
les atouts et les limites de l’usage des templates.
  19	
  
1. Penser l’expérience utilisateur : une étape primordiale dans la réalisation d’un site
web.
A. Ergonomie et utilisabilité.
A l’ère de l’immédiateté, il est important qu’un site web soit construit dans le cadre de
facilité d’usage sans négliger la construction esthétique. En effet, “penser l’usabilité et la
lisibilité d’une page, cela relève de l’ergonomie” 7
où l'usabilité, qui est une norme ISO,
consiste à définir une page avec efficacité, efficience et satisfaction. En compensation, le
terme “lisibilité” parle de lui-même puisqu’il s’agit alors de rendre la page web lisible et
compréhensible dans sa construction et organisation générale. Avant d’évoquer une
quelconque grille d’analyse et méthodes pour évaluer l’ergonomie et l’utilisabilité d’un
dispositif il est important de définir ces termes dans notre contexte. Pour penser un système
interactif tel qu’un site internet dans notre cas, l’ergonomie repose sur la relation avec
l’usager en terme d’interactivité et la facilité d’utilisation. En outre, il s’agit de rechercher une
meilleure adaptation entre une fonction (d’achat par exemple), un matériel (ici, le site
internet) et son utilisateur. Il faut, en ce sens, que l’usager fasse ce que nous attendons de lui,
et c’est là le rôle du web designer en tant que penseur de la structure, de l’organisation et de la
navigation du site. Il est clairement identifiable que le seul maître d’une bonne fonction mise
en place sur un site reste l’internaute. C’est la cible qu’il faut donc séduire et attirer en rendant
le site fonctionnel. C’est là que réside la problématique de l’ergonomie où il faut adapter le
dispositif à l’invidu qui va l’adopter. De la sorte, cette approche fonctionnaliste se base sur les
besoins de l’individu selon les informations qu’il est venu chercher. Certains ergonomes ont
pour cela conçu et pensé certaines méthodes et parmis ces derniers, nous retrouvons J.M.C.
Bastien et D. Scapin qui évoquent ces moyens mis en oeuvre pour conseiller, orienter,
informer et conduire l’usager lors de ses interactions avec l’outil. Leurs idées constituent des
bases de recommandations d’évaluation des interfaces, notamment le guidage (degré de prise
en charge de l’usager), l’incitation (les éléments mise en oeuvre pour faire appel, attirer,
susciter l’action), la lisibilité (concerne la compréhension de la mise en forme des éléments et
l’adaptation de ceux-ci) etc.
Un exemple concret vient illustrer cela, le fait qu’aujourd’hui, sur internet, il existe certains
modèles mentaux assimilés par les internautes. Cela concerne certaines conventions de
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
7
Penser le webdesign, modèle sémiotiques pour les projets multimédias, N.Pignier –
B.Drouillat
  20	
  
conception qui sont directement liées à l’interprétation. Le cas précis pour démontrer cela
s’est présenté à mon stage pour le client The Best Key8
où le web développeur a utilisé une
icône à mauvais escient : le “burger” menu. De façon conventionnelle, cette icône traduit le
menu de navigation que nous retrouvons sur les sites version desktop9
vers les versions dites
responsives10
. Principalement utilisé pour simplifier le contenu et offrir une bonne visilité aux
mobinautes, ce menu hamburger est parlant pour l’individu qui l’a intégré suivant son
expérience avec ce dernier. Il se l’est donc représenté mentalement et est donc assimilé, sur
les versions mobiles, au menu que nous retrouvons sur un site. Dans notre exemple, nous
voyons que ce menu hamburger est utilisé sur la version desktop, et non pas pour le menu,
mais pour l’identification11
. Lorsque nous basculons vers les interfaces mobiles, nous
retrouvons ce menu hamburger mais, l’identification est quant-à elle représentée par trois
écrous (non représentatifs également, pour se faire il aurait fallu représenter cela via l’icône
représentant une personne par exemple). Cela pose des problèmes d’interprétation et de
désorientation du modèle mental que se font les usagers de certaines pratiques propres au
web. Ce faisant, cela perturbe la lecture et la navigation sur le site victime de cela.
Evoquée précédemment, l’utilisabilité consiste à simplifier, faciliter l’usage d’un site
internet afin de le rendre accessible au plus grand nombre (c’est, d’ailleurs, souvent un point
auquel il faut répondre pour le client afin que son site est l’impacts souhaité). Selon la norme
ISO, l’utilisabilité est “le degré selon lequel un produit peut être utilisé par des utilisateurs
identifiés pour atteindre des buts définis, avec efficacité, efficience et satisfaction, dans un
contexte d’utilisation donné”. Il convient ainsi de penser “l’expérience utilisateur”12
et le
msodèle de Mahlke intègre ces différents aspects qui découlent de cette relation. Ce modèle,
de 2008, inclue trois facteurs qui composent cette interaction homme-machine et “influencent
la façon dont les utilisateurs perçoivent les produits interactifs”13
:
-­‐ les propriétés du système : fonctionnalités, propriétés de l’interface et/ou les
dialogues.
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
8
Portail immobilier en ligne, constructions & programmes neufs.
9
Ecran de l’ordinateur.
10
Smartphone et tablette.
11
Annexe 1 & 1 bis.
12
Expression utilisée pour la première fois par Norman dans les années 1990.
13
Méthodes de design UX, 30 méthodes fondamentales pour concevoir et évaluer les systèmes
interactifs, C.Lallemand – G.Gronier
  21	
  
-­‐ les caractéristiques de l’utilisateur : attentes, besoins, motivations, valeurs,
connaissances de la cible.
-­‐ les paramètres du contexte : la situation dans laquelle le système est manipulé.
Cette approche inclue donc l’usager dans cette IHM qui reste l’acteur décisif à prendre en
compte afin de rendre son expérience agréable et, surtout, pour le faire adhérer au site, à la
marque et aux valeurs qui en émanent. Autrement dit, “écrire des contenus pour le web, c’est
d’abord penser aux conditions de leur réception par un destinataire”.
Penser ce travail ergonomique et l’usabilité relève d’une certaine logique de conception que
devra relever le web designer pour imaginer l’organisation du site internet futur. Pour
intégrer ces différentes étapes, certaines réunions de validation seront à établir entre
l’agence et le client afin que ce dernier confirme ou non cela. Pour ce faire, différentes
maquettes seront créées par le web designer pour aider le client à se projetter.
B. Web designer : le travail en amont pour penser l’interface homme-machine (IHM).
Souvent inconnu ou jugé non nécessaire au sein d’une agence, le métier de web designer
reste pourtant efficace et majeur dans la conception d’un site web. Il est aujourd’hui
primordial qu’un site internet réponde au besoin urgent de communication. Pour parfaire cela
il existe des méthodes propres au web 2.0 que les agences de communication/web se doivent
de maitriser à l’aide du respect des normes web, des meilleures pratiques mais également en
terme d’attractivité pour positionner et démarquer le site web. C’est principalement dès les
années 90 et, plus tard, au sein du web 2.0, que débuta l’ère de la facilité d’utilisation. C’est
de cette phase que sont nées les expressions “interface homme-machine” (IHM) ou “interface
personne-système” (IPS) qui ont apporté des considérations pour la conception de sites
internet. Et c’est principalement le rôle même du web designer de penser ce lien qui découlera
du dispositif conçu avec et pour l’internaute. Pour penser cela, sa responsabilité réside dans le
fait de penser l’interface, de l’imaginer et de la concevoir en répondant aux besoins et attentes
du client mais surtout, lors de la mise en ligne du site, des internautes qui seront la cible. En
ce sens, il s’agit d’orienter une des problématiques qui se pose au web designer de la sorte :
“quelle place on va attribuer à l’internaute dans le site, quelles expériences on va lui offrir, ce
  22	
  
que l’on va lui proposer comme promesse de navigation, comme possibilités d’actions, de
réalisations”14
.
Dans le cadre de mon mémoire de stage, le plus important à évoquer reste les étapes de
maquettages (croquis et maquettes) qui précèdent la conception en elle-même du site internet.
Ce sont ces étapes que nous avons d’ailleurs abordé lors du semestre 1 permettant de rendre
compte, à travers des schémas plus ou moins élaborés, du souhait du client. A travers mon
stage une tâche m’a été confiée : la refonte totale du site www.thedogcampany.lu15
. Cela
comprennait la création du logo, de la charte graphique et du site (adapté sur mobiles et
tablettes). Pour mener à bien et au mieux cette tâche j’ai donc conçu les étapes précédemment
citées jusqu’à ce que mon maitre de stage me demande d’arrêter mes productions, jugeant
cela inutile, trop long et trop coûteux pour eux (c’est pour cela que je n’ai pas conçu les
maquettes responsives et que seule la maquette graphique de la page d’accueil desktop est
visible). A savoir, le projet m’a été confié sans que mon maître de stage ne prévienne la
gérante du site en question, le but étant de le faire et de le lui vendre une fois terminé, j’avais
ainsi une liberté totale. Abordées par Olivier Beining lors de son cours Web Design, les
étapes judicieuses à concevoir sont :
-­‐ La conception de l’arborescence16
: élaboration du menu principalement et donc du
choix de navigation proposé à l’internaute. Il doit tenir compte de la règle des trois
clics et également d’avoir, au maximum, trois niveaux de menu afin de respecter
l’ergonomie minimale.
-­‐ Les zonings17
: qui représenteront les zones de l’interface en reflétant de façon
schématique les grandes zones qui vont accueillir le contenu.
-­‐ Les wireframes18
: cette étape s’élabore au vrai format, la taille des éléments seront
représentées telles quelles à l’écran. Il n’y a aucun élément graphique, ce sont
uniquement des carrés, des rectangles et du texte.
-­‐ Les maquettes graphiques19
: visuels de ce que sera le site d’accueil avec les couleurs,
les polices et les images.
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
14
Penser le webdesign, modèle sémiotiques pour les projets multimédias, N.Pignier –
B.Drouillat
15
Toiletteur pour chats et chiens au Luxembourg
16
Annexe 2
17
Annexe 3
18
Annexe 4
19
Annexe 5	
  
  23	
  
Ces échelons sont à expliquer et à montrer au client afin de les faire valider ou non. Dans mon
cas précis je n’avais pas cela à faire puisque la refonte du site était à faire sans “l’accord” du
prospect. Cela l’aurait pourtant aidé à visualiser ce que serait son site. De façon plus générale,
comme ces schémas sont représentés à l’aide de logiciels (principalement Illustrator et
Photoshop) “il est bien plus facile et économique de corriger et modifier une maquette que de
corriger les lignes de code d’un système fonctionnel”20
. A cela, les auteurs rajouent que “plus
une erreur est détectée et corrigée tôt dans le processus et moins cela coûte cher”. Le rôle du
web designer permet ainsi de gagner du temps, de limiter les risques d’echec et
d’accompagner le client tout au long de son projet. En ce sens, c’est le web designer qui
imagine et “dessine” le site, son originalité et sa créativité sont primordiales pour le site en
lui-même.
Toutes ces étapes de conception ne sont donc pas réalisables dans l’agence Business
Casanova soutenant que cela n’est pas nécessaire pour réaliser un site et que c’est une perte de
temps et donc d’argent. Cependant, un contre-exemple est venu prouver que ces étapes de
maquettage sont importantes : le web developpeur a malencontreusement supprimé le site
internet The Dog Company alors que ce dernier était terminé. Il était impossible pour lui
récupérer la dernière version du site, seul le menu était encore accessible. Résultat, il a fallu
tout refaire et sans l’aide des maquettes précédemment construites cela aurait donc doublé,
voire triplé le temps de travail de la refonte du site. A nouveau, ils jugeaient que cela n’était
pas un argument suffisant et valable pour les convaincre que le métier de web développeur est
bénéfique.
La satisfaction du client est primordiale tout au long du processus mais il faut avant tout
séduire le futur internaute qui devra accéder le plus rapidemment possible à sa recherche
tout en le captivant à travers le design. En somme, il faut l’inciter, l’entraîner et l’inclure
dans son parcours.
C. Le design persuasif, une clef pour séduire et satisfaire ?
Une des tâches du web designer consigne à intégrer l’usager futur au site internet qui
sera créé. Pour considérer cet internaute, le persuasive design consiste à influencer son
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
20 	
  Penser le webdesign, modèle sémiotiques pour les projets multimédias, N.Pignier –
B.Drouillat	
  
  24	
  
comportement de sorte à ce qu’il adopte la position attendue et qui ressort du dispositif.
Nous le disions précédemment, il faut mettre l’accent sur la rapidité et la simplicité mais
en plus de cela il faut miser sur l’intégration de l’usager actif. Loin d’être passif, ce
dernier doit être acteur de ses décisions et pour parfaire cela, il faut que le web designer
réussisse à susciter l’émotion à travers sa conception. Le mot clef de cette partie est donc
“incitation”, il faut réussir à engager l’usager et faire qu’en un seul clic il s’inscrive à la
newsletter par exemple, qu’il remplisse un questionnaire de satisfaction etc. Evidemment,
il faut que cet acte d’engagement lui soit bénéfique et sur un site de vente cela peut passer
par un code promotionnel à l’aide d’une pop-up21
. Le simple fait que l’internaute
s’inscrive à la newsletter pour recevoir une réduction sur sa commande l’engage et le
conforte dans son acte d’achat. Cet effet de persuasion passe avant tout par la
personnalisation de l’interface afin que cette dernière soit attractive mais surtout crédible
pour rendre compte des valeurs du client et de la marque. Au même titre que des
techniques marketing, comme l’amorçage ou le pied-dans-la-porte22
par exemple, pour
faire adhérer le client au concept, un site internet se doit d’être, dans sa conception,
persuasif.
Fogg, en 2003, définissait le persuasive design comme étant “une métode de
conception des systèmes interactifs qui a pour objectif de mettre en oeuvre, au sein d’une
interface, des éléments qui incitent les utilisateurs à changer leurs attitudes ou leurs
comportements”. En outre, il faut qu’il ait le sentiment d’être actif, que son acte lui
apportera quelque chose mais, à l’inverse, que cela ait aussi un feedback positif pour le
site et le client. Pour aller plus loin dans cette approche, Nemery, Brangier et Kopp, en
2010, ont élaboré huit critères de persuasion qu’un web designer peut considérer pour
l’interface :
-­‐ Crédibilité : l’interface se doit de rassurer l’internaute et de réfléter une certaine
confiance. Comme exemple, les auteurs citent “Présenter des informations mises à
jour régulièrement”.
-­‐ Privacité : veiller au respect des données personnelles en termes de confidentialité.
Nous pouvons illustrer cela avec le code 3D secure par exemple.
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
21
Annexe 6 (provenant du site Sarenza.com)
22
Psychologie du consommateur – pour mieux comprendre comment on vous influence,
N.Guégen.	
  
  25	
  
-­‐ Personnalisation : phase qui consiste à séduire l’internaute en l’intégrant dans le
message. Le simple fait, lors de la connexion de l’internaute à son compte client, de
dire “bonjour X” le conforte dans cet effet de personnalisation.
-­‐ Attractivité : l’interface doit capter et attirer l’attention de l’usager. Les pop-up
illustrent parfaitement cela.
-­‐ Sollicitation : pour cela il faut intégrer le lecteur au contenu du dispositif, Amazon est
un des pionnier en suggérant et en recommandant des articles suivant les précédentes
recherches et goûts de l’internaute (en référence aux cookies principalement qui sont
fortement utilisés aujourd’hui pour recueillir des données de façon légale des
internautes afin de faire du ciblage).
-­‐ Accompagnement : il faut guider l’usager, lui donner des codes qu’il assimilera.
-­‐ Engagement : le web designer se doit, dans la conception, d’impliquer l’utilisateur en
décidant de partager le contenu sur les réseaux sociaux par exemple.
-­‐ Empire : il faut, en plus de capter l’attention de l’usager, l’influencer en insérant par
exemple un temps limite des articles gardés dans le panier. Sachant qu’il y aura un
délai, l’internaute sera plus à même de passer sa commande.
Ces huit mots-clefs sont déterminants pour rendre le dispositif le plus persuasif possible et
afin que le but premier du site soit réalisé (qu’il s’agit de la vente ou de la simple recherche
d’information). Le fait que l’internaute participe au contenu le sent “privilégier” et, dans un
sens, flaté. L’agence de communication Business Casanova, utilise cela pour montrer la
satisfaction de leurs clients envers les prospects23
qui, de ce fait, seront rassurés par ces
précédents avis. Cela est intéressant pour l’agence en elle-même puisqu’elle revendique sa
qualité et sa bonne image, mais c’est également enrichissant pour le prospect qui aura acquis
une certaine confiance envers eux. Cet exemple de design persuasive a donc pour
conséquence d’influencer les comportements des utilisateurs. Ce système de “récompense”
est réciproque puisque cela profite à la fois à la marque, à l’entreprise et au client, voire au
prospect.
Veiller à la confiance et l’intégration de l’internaute à travers du contenu dynamique et des
incitations forte à la participation sont des mesures qu’il faut penser avant la construction du
site internet afin de cerner les besoins des clients selon la visée du site internet. Ce sont des
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
23
Annexe 7
  26	
  
options qui ne sont pas proposées directement par les templates, le web développeur devra
donc avoir recours à des extensions pour personnaliser cette interface.
2. Les atouts et les limites de l’usage des templates.
A. De la fiche de style à Wix en passant par Wordpress, quel sens ?
Du web 1.0 au web 2.0 il y a eu énormément d’évolution qui ont touché la construction
des sites pour répondre aux besoins des clients. Entre 1991 et 1999 les sites web se
focalisaient sur les sites “vitrine” en présentant les produits, en donnant des informations. Ces
versions étaient uniquement dédiées aux écrans des ordinateurs et les contenus publiés étaient
uniquement réalisables par des professionnels ayant les compétences nécessaire en HTML,
XML Java et Javascript pour, au mieux, créer des liens hypertextes et des contenus
multimédias en ligne. Du côté de l’internaute, ce dernier était passif à ce moment, il n’avait
aucun pouvoir sur le contenu. C’est après les années 2000, et principalement dès 2005, que
l’usager a été pris en considération au sein du web participatif. Ce faisant, la liberté
d’expression s’est développée notamment grâce aux blogs, aux forums et aux réseaux
sociaux. La notion de “partage” est donc primordiale et cela a été pris en compte dans la
construction des nouveaux sites internet qui, comme nous le disions dans la précédente partie,
intègrent l’usager aux contenus avec du dynamisme, du modernisme et du partage.
L’internaute devient alors consommacteur : il communique, partage, transforme et il est ainsi
déterminant pour l’avenir des entreprises qui choisissent d’avoir un site internet en guise de
communication. Le web 1.0, et plus précisemment en 1996, a fait naitre les fameuses feuilles
de style dans les documents HTML, appelées CSS, permettant ainsi de donner une mise en
forme au contenu en le rendant plus personnalisable et donc plus attractif. Lié au langage
HTML qui se compose uniquement de texte, de balises mais aussi d’attributs afin de donner
des instructions au navigateur, le CSS vient apporter des fonctionnalités de personnalisation
au texte auquel il est lié. Le langage HTML et le CSS ont évolué des dernières années en
allant de la simple page blanche composée de carrés gris à des contenus dynamiques les plus
orginaux. Cependant, pour réaliser un site en HTML et CSS il est important d’avoir des
qualifications puisque cela nécessite des compétences en terme d’adaptation (pour les version
mobiles, tablettes mais aussi pour que le site soit visualisable sur tous les moteurs de
recherche), mais également en terme de création et réalisation. Autrement dit, une personne
lambda n’ayant qu’une simple connaissance et expérience avec le web ne sera pas à même de
  27	
  
construire son propre site web avec toutes les normes qui sont liées, un professionnel en
communication web, tel qu’un web développeur avec l’aide d’un web designer, aura les
compétences pour développer cela, de même pour la maintenance de ce dernier. Ce n’est
pourtant parce que ce mode de création est le pionnier pour les sites internet qu’il est délaissé
pour autant dans notre ère contemporaine. Au contraire, cette façon de réaliser une page web
reste toujours d’actualité puisque ce langage favorise l’originalité et la liberté de création.
Face à cela nous retrouvons les CMS - ou SGC - qui constituent des logiciels et plateformes
destinés à la création de pages web tout en ne nécessitant pas autant de compétences
techniques en terme de développement pour créer son site web. Autrement dit, ils permettent
de créer facilement et rapidement du contenu à l’aide d’une interface déjà conçue, ainsi, le
back office et le front office sont faciles d’accès et les mises à jour ne nécessitent pas autant
de compétences que le langage HTML-CSS. La différence se joue au niveau de la publication
des contenus, via un CMS la mise en jour des contenus (images, textes, vidéos) se fait
indépendamment de la structure. Concernant cette dernière, elle facilite également le travail
du web développeur puisqu’il existe des thèmes prédéfinis et donc près à l’emploi dès le
téléchargement effectué. Le plus célèbre et le plus utilisé aujourd’hui est Wordpress, c’est
celui-ci qu’à choisi Business Casanova pour confectionner leurs sites internet des clients. Que
ce soit pour un site vitrine24
ou pour un e-commerce25
(avec l’extension Woo commerce),
l’agence n’a recours qu’au CMS Wordpress pour réaliser un site “rapidemment, efficacement
et à moindre coût”. Pour ces sites, ils utilisent les thèmes Divi et Modern Interior auxquels ils
rajoutent les plug-in nécessaires au bon fonctionnement des sites internet. Utiliser Wordpress
est un réel avantage pour eux en terme de rapidité et de coût. L’installation du thème nécessite
que quelques secondes et il en va de même pour les extensions suivant la visée du site. Quant
aux contenus, ils ne mettent en ligne que le minimum demandé par le client. C’est ce dernier
qui devra mettre en ligne son propre contenu avec une rapide formation du wordpress (back
office) : ajout de texte, d’une image, d’un article, d’un code promotionnel etc. L’usage
principal du thème Divi est, pour eux, le meilleur thème Wordpress puisqu’il est simple
d’utilisation, pour eux et leurs clients. Sa construction et organisation ne nécessitent donc pas
le besoin d’avoir un web designer puisque la structure est extrêmement maniable. Prônant
ainsi la rapidité, nous remarquons une certaine standardisation de leurs créations, chaque site
est construit de la même façon avec un design très similaire. Là serait donc tout l’avantage
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
24
Annexe 8 : exemple d’une référence Business Casanova, site vitrine www.rmavocats.lu
25
Annexe 9 : exemple d’une référence Business Casanova, e-commerce www.textinova.com	
  
  28	
  
d’avoir un web designer pour ajouter de l’originalité, de l’innovation et de la créativité à la
structure.
Au delà du langage HTML-CSS et les CMS, il existe Wix qui est une plateforme en
ligne sous la forme “WYSIWYG” – What You See Is What You Get -. Cette technologie a
fortement évolué depuis ses derniers mois grâce à son fonctionnement intuitif, sa facilité de
création et ses nombreuses possibilités de personnalisation. Plus simple que Wordpress, Wix
ne nécessite aucune connaissance en programmation. Des modèles de page préfaits existent et
sont mis à la disposition des utilisateurs mais Wix propose également la fonction “page
blanche” où l’usager laisse libre cours à son imagination et, ce faisant, se crée un site sur
mesure. Malgré tout, cet usage reste critiqué et néfaste pour les professionnels de la
communication dans la mesure où cette revendication de la facilité d’utilisation et de création
d’un site internet via la plateforme Wix remet en cause le métier du web développeur et d’une
agence de communication/web. En suivant cette logique, un internaute lambda serait à même
de créer son propre site web sans avoir recours à une agence de communication mais il en est
tout autre. Il y a certaines normes web que cet usager ne maitrisera pas. De la sorte, son site
internet n’aura pas l’impact escompté et les professionnels, tels que les web designers dans ce
cas, seront aptes à parfaire cela : penser la navigation, la structure, le design et l’ergonomie
qu’un simple internaute ne maitrisera pas. De plus, posséder un site internet ne suffit pas
comme simple présence numérique, autour de cela gravitent les réseaux sociaux, la
communication non numérique (les flyers, les cartes de visites etc.), le référencement que
seuls les professionnels de la communication maitrisent pour que l’impact soit au plus proche
des espérances souhaitées.
L’évolution, l’expansion et la facilité de création d’un site internet sont aujourd’hui
remarquables. Les compétences techniques ne sont visiblement plus primordiales pour créer
un site internet où les templates sont maitres. Mais cet usage redondant des thèmes wordpress
et donc des layouts prédéfinis ne conduisent-ils par vers une standardisation des sites internet
?
B. Vers une standardisation des sites ?
Par “standardisation” nous entendrons un site internet dont la structure, la
construction, la navigation et le design ne diffèrent que de très peu. En outre, ce seront des
sites web courants, habituels, avec une originalité peu développée et ayant des similitudes
  29	
  
fortes. Il ne faut donc pas faire l’amalgame dans le sens où la standardisation consiste
simplement à respecter les normes prévues pour créer les sites.
D’après l’expérience que nous avons avec internet nous remarquons que ceux-ci
possèdent de nombreuses ressemblances et points communs notamment au niveau de
l’organisation de la page d’accueil contemporaine (des images en plein écran, des diaporamas,
la bannière etc.), des typographies similaires, la disposition du panier pour un e-commerce,
l’onglet recherche etc. Cette structuration repose sur un fait simple : ne pas perturber la
lecture, la navigation de l’internaute et donc l’envie de ne pas perturber ses représentations
mentales comme nous l’avions vu précédemment. Cependant, cette standardisation se reflète
également au niveau du design qui ne renvoie que très peu d’originalité. Nous sommes
conscients que le nombre de sites internet a explosé et que beaucoup d’entreprises possèdent
leur propre site internet mais au sein de la concurrence il faut savoir se démarquer et donc ne
pas miser sur cet effet de standardisation. Cette homogénéisation des pages web est la
probable conséquence de l’usage des templates qui facilitent le travail des agences de
communication au niveau de la rapidité et de la simplicité. Avoir recours aux mêmes modèles
de page pour des sites à même visée – entendons ici les sites vitrines par exemple – renforce
cette uniformité où l’aspect ne diffère que très peu : la police d’écriture et les couleurs
principalement. L’agence Business Casanova qui n’emploie que le CMS Wordpress et le
thème Divi (et plus ancien Modern Interior) pour satisfaire leurs clients prône cette similarité
entre toutes leurs créations mais se justifie sur le fait que c’est uniquement pour répondre aux
besoins exprimés par leurs clients. L’agence évoque également que cette rapidité et
immédiateté d’avoir ce produit ne peut que se traduire par un site simple et sans originalité ou
innovation apparentes. Pour illustrer cela nous pouvons simplement comparer deux sites
conçus par cette agence : www.frisingdecoration.com26
et www.hortos.lu27
. Les similitudes
sont frappantes : les couleurs diffèrent que de très peu (tons beiges) il en va de même avec
l’organisation des pages (principalement de la page d’accueil : le logo à gauche, le menu à
droite, l’image de présentation et le footer avec les réseaux sociaux et coordonnées de
Business Casanova) et la composition du menu où nous retrouvons des synonymes. L’agence
revendique ce rythme de création et se justifie par le fait que le temps est important pour
satisfaire le client, à nouveau, la rapidité rime avec produit standardisé. Cette façon de faire
serait donc en totale cohésion avec “l’impatience” qu’exprimeraient leurs clients. Ainsi, en
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
26	
  Annexe	
  10	
  
27	
  Annexe	
  11	
  
  30	
  
réalisant un site internet en trois jours (comprennant le 1er contact avec le client, la création
des contenus et la mise en ligne du site) l’agence répond à la demande exaucée par le client
qui souhaite avoir son produit opérationnel rapidement.
Un autre point propre aux valeurs de cette agence est notable, lors du premier rendez-
vous avec le client il lui ait demandé quelles sont ses attentes et s’il a déjà des idées en terme
de design et d’organisation du site. Le commercial propose alors d’analyser ce qui existe déjà
sur le marché de son client et réalise ainsi une étude benchmarking rapide. En visualisant les
leaders, le client choisit le site internet qu’il juge être le mieux et celui sur lequel il souhaite
que le web développeur se base pour le design et l’organisation. Chez Business Casanova, le
benchmarking consite alors à s’inspirer, à imiter le concurrent. Lors de mon stage j’ai constaté
cela avec le client www.tommysbox.lu pour lequel j’ai réalisé les photographies qui seront
présentes sur le site. Le principe est simple : imiter les contenus du site
www.pandaexpress.com qui est leur principal concurrent et leader. À la demande de mon
maitre de stage et de la cliente j’ai donc tenté de repoduire au mieux le style de photographies
des concurrents. Cela va au delà de la simple image de présentation, les codes graphiques sont
très similaires et l’appellation du menu ne diffère que très peu (des mises à jour ont cependant
été faites depuis, le site n’est à ce jour pas encore terminé).
Ce besoin de répondre au client en réalisant un site internet dans un temps retreint ne
peut pas rimer avec exclusivité : le web développeur grâce à son expérience avec le thème
utilisé sur le CMS va réaliser une certaine redondance dans la construction. Cette répétition
pourrait être évitée grâce au travail fournit par le web designer qui est pourvu d’originalité
pour justement concevoir cette différence entre les sites internet. Cependant, le travail du web
designer exige quelques heures de travail qui varient selon le projet et certaines agences, telle
que Business Casanova, estiment que c’est du temps perdu et que le web développeur peut
englober cette tâche dans son travail. Or, web designer et web développeur sont des métiers
qui se complètent parfaitement : le web développeur applique le travail de son collègue du
côté technique et c’est du temps gagné dans sa propre tâche puisque cela demanderait moins
de réfléxion comme le travail en amont (les étapes de maquettages) aurait été effectué par le
web designer. Ces étapes de création ne sont donc pas néfastes pour une agence, bien au
contraire, le web designer grâce à ses compétences et son inventivité redorerait l’image de
celle-ci grâce à des sites uniques et créatifs. C’est donc son travail qui participe à ne pas
standardiser les sites internet : une navigation et un concept original. Du côté du
benchmarking, cela reste une étape fondamentale dans la conception d’un site internet
puisqu’il s’agit d’analyser le marché, de cerner les erreurs des concurrents afin de ne pas les
  31	
  
reproduire par exemple. Cependant, trop se rapprocher du modèle de celui-ci peut s’avérer
être “déloyal” et, à nouveau, le travail du web designer consiste à innover, à se rapprocher de
la demande en apportant sa touche personnelle et sans s’inspirer profondément des contenus
déjà existants.
S’inspirer des adversaires et avoir recours à des gabarits de page renforce cette
standardisation des internet. La créativité et l’innovation ne sont donc pas privilégié pour
répondre à ce besoin de rapide de mise en fonction du site internet. Parfois, c’est ce manque
de temps qui réduit l’agence à proposer des sites internet minimalistes et très similaires aux
concurrents pour répondre tout simplement à l’envie des clients.
C. Avant tout une envie des clients : une logique d’adaptation.
Nous l’évoquions succinctement précédemment, le client est un acteur décisif au sein du
projet. De fait, c’est premièrement celui qui apporte le projet à l’agence et qui paiera celle-ci.
Dans un second temps, c’est celui qui sera le juge du travail fait : respect du cahier des
charges, des délais, des envies etc. C’est le décisionnaire et celui qu’il faudra convaincre tout
au long de la conception : du premier rendez-vous qui conclut l’achat jusqu’à la mise en ligne
sur le serveur du site opérationnel. C’est seul ou avec l’aide du chef de projet que sera établi
le cahier des charges utile pour l’ensemble de l’équipe d’une agence : les délais, le budget, les
envies exprimées etc. Des étapes de validation sont mises au point afin que le client confirme
ou non le travail déjà opéré, auquel cas les métiers engagés pourront apporter des
modifications si besoin est. Dans l’élaboration d’un site internet, le client pourra donc prendre
soin de valider, ou non, les différentes étapes de maquettage (en partant de l’arborescence
jusqu’à la maquette graphique) et cela s’avèrera être un gain de temps pour l’entreprise. Il est
bien plus simple de modifier un document Illustrator ou Photoshop qu’une feuille de style ou
la structure d’un template. Ces étapes servent également de support de visualisation où le
client pourra donner son avis et discuter de certains points avec les professionnels. Disposer
de tels visuels le met en situation et l’aide à se projetter sans pour autant que les modifications
apportées ait un quelconque impact sur la réalité. L’ensemble de l’équipe doit alors prendre
en considération le cahier des charges et effectuer des réunions dites de validation pour que le
travail gravit des échelons. Chez Business Casanova le cahier des charges n’est constitué et
restitué aux équipiers qu’oralement sans qu’il y ait des étapes de validation déterminées. Ce
n’est qu’une fois le produit terminé que le client aura une idée du projet puisqu’il sera achevé.
  32	
  
Dans cette façon de faire il y aura quasiment toujours des modifications à établir sur le projet,
ici un site internet, et donc du temps de perdu. Le but de toute conception est donc de séduire
le client afin qu’il valide cela, ainsi, il ne faut pas le négliger.
Cependant, dans la plupart des cas, le client est novice dans le domaine du numérique
et plus particulièrement des sites internet puisqu’il ne dispose que d’une expérience et
approche partielle avec ce monde. Parfois exigeant, parfois compréhensif, il faut tout de
même répondre à sa demande tout en étant raisonnable et en proposant des choses cohérentes
et faisables avec le web en veillant au respect du budget et du délai.
Cette relation client est également importante sur le long terme pour une agence de
communication puisque chaque projet réalisé constituera des bases solides pour compléter les
références de l’agence. De ce fait, le client contribue au développement de l’entreprise en
terme d’image, d’éfficacité et de confiance. Pour contribuer à cette image valorisante les
agences de communication telle que Business Casanova proposent d’assurer un suivi lorsque
le produit est terminé, cela comprend la création des réseaux sociaux (et des contenus publiés
sur ceux-ci), des campagnes e-mailing, des mises à jour au niveau des photographies, Google
Adsense28
et Google Adwords29
. Apporter ce suivi en guise de “service après vente” maintient
ce contact avec le client qui, rappelons le, est, dans la plupart des cas, novice et ne maitrise
pas ces outils. Proposant également des formations pour que le client puisse mettre le
minimum de contenu à jour sur sa page, cela contribue à renforcer l’image de l’entreprise et à
maintenir le contact avec les clients. Etant toujours à disposition des clients si un éventuel
problème venait à arriver, Business Casanova rempli donc son contrat : être présent en cas de
problème.
Le maintien de ce lien et de cette confiance avec les clients est primordial pour une agence de
communication/web. Cela fonctionne évidemment dans les deux sens : pour le client qui est
conforté dans son choix de l’agence pour créer sa communication numérique et pour l’agence
en elle-même en terme de notoriété principalement mais aussi concernant le chiffre d’affaire
et les relations.
	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  	
  
28
Google Adsense : “programme de monétisation proposé par Google aux éditeurs de sites
web pour générer des revenus publicitaires à la performance.” – www.definitions-
marketing.com
29
Google Adwords : “propose aux annonceurs la diffusion d’annonces liées aux mots clés
utilisés dans les requêtes.” – www.definitions-marketing.com	
  
  33	
  
Conclusion.
Notre époque contemporaine met à disposition de nombreux outils pour faciliter le
travail et réaliser les souhaits exprimés pour les agences de communication/web, pour les
clients et également pour les internautes lambda. Cette diversité d’outils permet de développer
un site internet rapidemment et accessible techniquement par tous. Malgré tout, certaines
normes sont à respecter pour veiller au mieux à la navigation des internautes et c’est ce à quoi
doit veiller un web designer. Cette multitude de sites internet risque de créer un flux
incalculable de contenus accessibles par tous, c’est là toute la problématique du numérique
aujourd’hui. Il faut satisfaire le client et le positionner au mieux sur le marché du web afin
qu’il se démarque de ses concurrents et que son site internet soit bénéfique pour sa marque.
Innover est un mot clef dont doit tenir compte le web designer lors de la conception des
graphiques du site internet, l’originalité et la créativité sont également maître pour créer un
impact sur la toile et satisfaire le client, mais avant tout, les internautes en quête
d’informations. Ce risque de tomber dans la banalisation des contenus et du design est néfaste
pour les clients mais aussi pour les agences en terme de notoriété et d’image. La finalité du
site internet pour un client est de lui apporter une visibilité et susciter des ventes, si ce n’est
pas le cas, la conception n’aura pas l’effet escompté et l’agence de communication n’aura pas
totalement rempli sa mission. Un point essentiel pour éviter cette redondance consiste en
l’originalité incluant une navigation, un design et une organisation qui sortent de l’ordinaire
tout en restant simple afin de ne pas perturber l’internaute.
De façon plus précise et personnelle, ce stage a débuté sur un mal entendu. Mon
maitre de stage ne connaissait pas directement le métier et donc les tâches du web designer,
pourtant cela était clairement noté sur le titre de mon curriculum vitae. Pour l’agence
Business Casanova, le web design était synonyme de graphisme. Bien évidemment le web
design englobe quelques notions de graphisme mais cela ne doit pas être sa mission
principale. Je me suis vue refuser certaines tâches jugeant que cela n’était pas néccesaire (cf :
la conception du site www.thedogcompany.lu pour lequel je n’ai pas pu terminer toutes les
maquettes notamment versions mobiles et tablettes et quelques pages pour la version
desktop). Comme il s’agissait d’une petite structure, la polyvalence était donc à prévoir et
c’est pourquoi j’ai donc pu bénéficier de l’apprentissage d’autres notions qui n’étaient pas
convenues lors de mon entretien : community management, photographie, newsletters etc.
  34	
  
Cela était un réel point positif puisque j’ai acquéri une expérience et pu développer des
compétences à ces différents niveaux.
Pour rappel, l’entreprise d’accueil prône la rapidité et les sites internet simples pour satisfaire
leurs clients. L’étape de web design n’est donc, selon eux, pas nécessaire pour concevoir un
site internet selon les souhaits du client. Grâce à mon expérience, mes envies de créativité et
d’originalité dans la communication en générale ainsi que les cours reçus tout au long de ma
scolarité à la faculté j’étais donc en mesure de traiter le sujet de mon mémoire de stage
“Penser l’ergonomie et l’expérience utilisateur d’un site internet : l’art du web designer”.
Mon point de vue sur la communication vient également approfondir cela puisque je suis
convaincue que pour se démarquer aujourd’hui il faut faire preuve d’originalité qu’il s’agisse
d’une simple présence sur le web pour présenter son entreprise ou bien encore pour vendre
des produits sur un e-commerce. Mon travail de mémoire portera justement sur ce point
qu’est l’originalité à travers la communication avec la définition de l’originalité en elle-
même, certaines pratiques utilisées par des agences créatives puis les impacts que ces
campagnes ont sur le comportement des individus. Ce projet a été accentué lors de mon
précédent stage en licence 3 chez Mescudi dont les valeurs sont les suivantes : créativité,
originalité et innovation. Les idées les plus folles sont tentées par cette agence dynamique qui
part du principe qu’il faut oser pour se démarquer aujourd’hui dans la communication et la
publicité de façon générale.
Concernant les compétences développées au sein de mes deux stages, je dirai que celles-ci ont
été complémentaires du point de vue du métier envisagé après mon master. Comme
mentionné dans la première partie de ce rapport, je souhaite devenir chef de projet spécialisé
web designer et, à ce jour, je n’ai encore pas eu de réelle expérience et acquis en tant que chef
de projet junior par exemple. Je n’ai été qu’actrice lors de mon stage chez Mescudi en
assistant aux réunions avec les clients et en observant le rôle de mon maître de stage qui était
chef de projet et à la fois graphiste et web développeur selon les projets proposés. A nouveau,
la polyvalence régnait et au sein d’une petite structure je suis persuadée que l’entraide et
l’écoute peuvent mener à bien un projet où chacun fait part de son avis pour agrémenter le
produit final (que ce soit un flyer ou un site internet par exemple). Ma mission principale chez
Mescudi consistait à être graphiste (création de l’identité de l’entreprise principalement),
quant à chez Business Casanova j’ai été d’autant plus polyvalente puisque community
manager, photographe et web développeur. Ce sont ses divers acquis et notions maitrisées qui
renforce mon envie de devenir chef de projet spécialisé web designer au sein d’une petite
structure où le travail fournit par chacun participera à la satisfaction du client.
  35	
  
En master 2, ma recherche de stage sera donc plus orientée vers des agences de
communication/web créative qui nécessitent et prendront en compte le travail d’un web
designer dans lesquelles je serai susceptible d’envisager mon avenir professionnel. Malgré
tout, je suis ouverte et être polyvalente sera un avantage au sein du travail en équipe et je serai
donc ouverte à toute proposition concernant un rôle dans une agence de communication/web.
  36	
  
Références.
Ouvrages
Guégen N., 2011, Psychologie du consommateur pour mieux comprendre comment on vous
influence, Paris, Éd. Dunod.
Lallemand C., Gronier G., 2015, Méthodes de design UX. 30 méthodes fondamentales pour
concevoir et évaluer les systèmes interactifs, Paris, Éd. Eyrolles.
Pignier N., Drouillat B., 2004, Penser le web design. Modèles sémiotiques pour les projets
multimédias, Paris, Éd. L’Harmattan.
Articles scientifiques
Chevalier A., et al, 2009, « Entre contraintes ergonomiques, créativité et esthétique : rôle d’un
système à la base de connaissances sur l’activité des concepteurs web », Le travail humain,
72.
Peraya D., 2012, « Quel impact les technologies ont-elles sur la production et la diffusion des
connaissances ? », Question de communication, 21, pp. 89-106.
Mémoire de recherche
Bourazza M., 2015, L’influence du minimalisme graphique dans le webdesign sur
l’expérience utilisateur, Mémoire en information et communication, Université de Lorraine.
  37	
  
Remerciements.
Premièrement je tiens à remercier l’agence Business Casanova pour m’avoir accueillie
pendant deux mois et qui a dû faire face à certains aménagements pour moi. Plus
particulièrement je remercie Rudolphe Aben et Emilien Jourdan pour le temps qu’ils m’ont
consacré et les missions qu’ils m’ont confié en toute confiance.
Je remercie notamment les clients de Business Casanova pour leur gentilesse, leurs
compliments, leurs projets et leur confiance envers moi. En particulier je remercie Neves
Barros (du site www.textinova.com) pour sa patience et les différentes missions qu’elle m’a
confié pour que je mêne à bien mon stage et développe certaines compétences : graphisme,
réseaux sociaux et newsletter.
J’adresse mes remerciements à monsieur Luc Massou et Pierre Morelli pour leur aide
et le temps qu’ils m’ont consacré avant et pendant le stage pour parfaire ce mémoire de stage
notamment des pistes de lecture, des validations et reformulations des certains contenus. Je
remercie aussi Sébastien Albert pour sa patience concernant la validation et la recherche de
stage mais aussi pour le temps consacré à joindre mon maitre de stage pour éclaircir certains
points.
De façon plus générale je remercie l’ensemble de mes professeurs et intervenants qui
m’ont transmis leurs savoirs pendant ces trois années de lience et cette première année de
master. Je remercie Olivier Beining, du cour de Web Design, pour son apport et sa découverte
du métier de web designer, sans lui je ne pense pas que j’aurais orienté ce rapport de stage
problématisé sur ce sujet.
Pour résumer et terminer ces quatre années d’études, j’espère vivement intégrer la
dernière année de master et être diplomée de l’Université de Lorraine en vu de poursuivre
mon projet en tant que future chef de projet spécialisé web designer.
  38	
  
Annexes.
Annexe 1 : site version desktop www.thebestkey.com
Annexe 1 bis: site version mobile www.thebestkey.com
  39	
  
Annexe 2 : arborescence www.thedogcompany.lu
Annexe 3 : Zonings www.thedogcompany.lu
Zoning	
  1	
  page	
  d'accueil Zoning	
  2	
  page	
  "toilettage	
  &	
  tarifs"
  40	
  
Zoning	
  4	
  page	
  "les	
  promenades" Zoning	
  3	
  page	
  "boutique"
Zoning	
  5	
  page	
  "contact"
  41	
  
Annexe 4 : Wireframes www.thedogcompany.lu
	
  
Wireframe	
  1	
  page	
  d'accueil	
  
  42	
  
	
  
Wireframe	
  2	
  page	
  "toilettage	
  &	
  tarifs"
  43	
  
	
  
Wireframe	
  3	
  page	
  "les	
  promenades"
  44	
  
	
  
Wireframe	
  4	
  page	
  "boutique"
  45	
  
	
  
Wireframe	
  5	
  page	
  "contact"
  46	
  
Annexe 4 : Maquette graphique www.thedogcompany.lu
	
  
Maquette	
  graphique	
  1	
  page	
  d'accueil
  47	
  
Annexe 6 : Pop-up site www.sarenza.com
Annexe 7 : Testimonials du site www.business-casanova.com
  48	
  
Annexe 8 : site vitrine www.rmavocats.lu
Annexe 9 : e-commerce www.textinova.lu
  49	
  
Annexe 10 : www.frisingdecoration.com
Annexe 11: www.hortos.lu
  50	
  
Nom de l’étudiant :
Camille	
  Perazzi	
  
camille.perazzi@hotmail.fr	
  
	
  
Titre	
  du	
  rapport	
  :	
  
Penser l’ergonomie & l’expérience utilisateur d’un site internet : l’art du web designer.
	
  
Coordonnées	
  complètes	
  de	
  l’entreprise	
  :	
  
Business	
  Casanova	
  
17,	
  rue	
  de	
  Mondorf	
  
L-­‐2159	
  Bonnevoie	
  
LUXEMBOURG	
  
tél.	
  00352	
  27	
  86	
  04	
  07	
  
fax	
  00352	
  24	
  61	
  12	
  78	
  
www.business-­‐casanova.com	
  
	
  
Secteur	
  d’activité	
  de	
  l’entreprise	
  :	
  
Communication	
  numérique	
  
	
  
Nom,	
  fonction	
  et	
  coordonnées	
  du	
  tuteur	
  professionnel	
  :	
  
Rudolphe	
  Aben,	
  directeur	
  d’agence	
  et	
  commercial	
  
Tél.	
  00352	
  69	
  12	
  00	
  452	
  
rudolphe@business-­‐casanova.com	
  
	
  
Tuteur	
  universitaire	
  :	
  
Nom	
  :	
  Sébasten	
  Albert	
  
Mail	
  :	
  sebastien.albert@univ-­‐lorraine.fr	
  
	
  
	
  
Type	
  de	
  fonction	
  exercée	
  dans	
  l’entreprise	
  :	
  
Photographe,	
  community	
  manager,	
  web	
  développeur.	
  
	
  
Activité	
  principale	
  réalisée	
  	
  durant	
  le	
  stage	
  :	
  (10	
  lignes	
  maxi)	
  
Réalisation	
  de	
  photographies	
  destinées	
  à	
  enrichir	
  les	
  sites	
  internet.	
  Créations	
  et	
  refonte	
  
d’un	
  site	
  internet	
  pour	
  un	
  toiletteur	
  Luxembourgeois.	
  Animation	
  des	
  réseaux	
  sociaux	
  
des	
  clients	
  de	
  l’agence	
  +	
  créations	
  de	
  visuels	
  pour	
  des	
  concours.	
  
	
  
Métier	
  visé	
  :	
  
Chef	
  de	
  projet	
  spécialisé	
  web	
  designer.	
  
	
  
Durée	
  du	
  stage	
  :	
  2	
  mois	
  
	
  
Date	
  de	
  stage	
  :	
  du	
  04.04.2016	
  	
  	
  au	
  01.06.2016	
  
	
  
Note	
  obtenue	
  :	
  /	
  
	
  
	
  
  51	
  
  52	
  
  53	
  
  54	
  

Contenu connexe

Tendances

Projet Fin d'année version finale
Projet Fin d'année version finaleProjet Fin d'année version finale
Projet Fin d'année version finaleHoussem AZZOUZ
 
Réalisation d'une application de gestion budgétaire
Réalisation d'une application de gestion budgétaireRéalisation d'une application de gestion budgétaire
Réalisation d'une application de gestion budgétaireLamiae Demraoui
 
Medical openerp
Medical openerpMedical openerp
Medical openerpHORIYASOFT
 
Rapport de stage desert dream
Rapport de stage desert dreamRapport de stage desert dream
Rapport de stage desert dreamTaoufik Laaziz
 
Rapport de Mémoire Master Recherche
Rapport de Mémoire Master RechercheRapport de Mémoire Master Recherche
Rapport de Mémoire Master RechercheRouâa Ben Hammouda
 
Rapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learningRapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learningRouâa Ben Hammouda
 
Présentation pfe Développement d'une application bancaire mobile
Présentation pfe Développement d'une application bancaire mobilePrésentation pfe Développement d'une application bancaire mobile
Présentation pfe Développement d'une application bancaire mobileNader Somrani
 
Mini Projet C gestion d'une location de voiture
Mini Projet C gestion d'une location de voitureMini Projet C gestion d'une location de voiture
Mini Projet C gestion d'une location de voitureOussama Bessrour
 
réalisation une application web de gestion des informations météorologiques
réalisation une application web de gestion des informations météorologiquesréalisation une application web de gestion des informations météorologiques
réalisation une application web de gestion des informations météorologiquesMedk Salhi
 
Pfe conception et réalisation d'une application de gestion des processus d'ac...
Pfe conception et réalisation d'une application de gestion des processus d'ac...Pfe conception et réalisation d'une application de gestion des processus d'ac...
Pfe conception et réalisation d'une application de gestion des processus d'ac...Ahmed Makni
 
Rapport PFE Application Web Mobiles belwafi bilel
Rapport PFE Application Web Mobiles belwafi bilelRapport PFE Application Web Mobiles belwafi bilel
Rapport PFE Application Web Mobiles belwafi bilelBelwafi Bilel
 
Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2
Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2
Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2Sofien Benrhouma
 
Rapport de stage PFE ( DUT) chez Synthèse Conseil - Jaiti Mohammed
Rapport de stage PFE ( DUT) chez Synthèse Conseil  - Jaiti MohammedRapport de stage PFE ( DUT) chez Synthèse Conseil  - Jaiti Mohammed
Rapport de stage PFE ( DUT) chez Synthèse Conseil - Jaiti MohammedMohammed JAITI
 
Conception et développement d’un Système de réservation en ligne
Conception et développement d’un Système de réservation en ligneConception et développement d’un Système de réservation en ligne
Conception et développement d’un Système de réservation en ligneAydi Nébil
 
Rapport PFE : Développement D'une application de gestion des cartes de fidéli...
Rapport PFE : Développement D'une application de gestion des cartes de fidéli...Rapport PFE : Développement D'une application de gestion des cartes de fidéli...
Rapport PFE : Développement D'une application de gestion des cartes de fidéli...Riadh K.
 
Rapport Projet de Fin d'Etudes
Rapport Projet de Fin d'EtudesRapport Projet de Fin d'Etudes
Rapport Projet de Fin d'EtudesHosni Mansour
 

Tendances (20)

Projet Fin d'année version finale
Projet Fin d'année version finaleProjet Fin d'année version finale
Projet Fin d'année version finale
 
Réalisation d'une application de gestion budgétaire
Réalisation d'une application de gestion budgétaireRéalisation d'une application de gestion budgétaire
Réalisation d'une application de gestion budgétaire
 
Medical openerp
Medical openerpMedical openerp
Medical openerp
 
Rapport de stage desert dream
Rapport de stage desert dreamRapport de stage desert dream
Rapport de stage desert dream
 
Rapport de Mémoire Master Recherche
Rapport de Mémoire Master RechercheRapport de Mémoire Master Recherche
Rapport de Mémoire Master Recherche
 
Rapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learningRapport- Conception et réalisation d'une plateforme social learning
Rapport- Conception et réalisation d'une plateforme social learning
 
Présentation pfe Développement d'une application bancaire mobile
Présentation pfe Développement d'une application bancaire mobilePrésentation pfe Développement d'une application bancaire mobile
Présentation pfe Développement d'une application bancaire mobile
 
Mini Projet C gestion d'une location de voiture
Mini Projet C gestion d'une location de voitureMini Projet C gestion d'une location de voiture
Mini Projet C gestion d'une location de voiture
 
réalisation une application web de gestion des informations météorologiques
réalisation une application web de gestion des informations météorologiquesréalisation une application web de gestion des informations météorologiques
réalisation une application web de gestion des informations météorologiques
 
Pfe conception et réalisation d'une application de gestion des processus d'ac...
Pfe conception et réalisation d'une application de gestion des processus d'ac...Pfe conception et réalisation d'une application de gestion des processus d'ac...
Pfe conception et réalisation d'une application de gestion des processus d'ac...
 
Présentation du pfa
Présentation du pfaPrésentation du pfa
Présentation du pfa
 
Rapport stage
Rapport stageRapport stage
Rapport stage
 
Rapport PFE Application Web Mobiles belwafi bilel
Rapport PFE Application Web Mobiles belwafi bilelRapport PFE Application Web Mobiles belwafi bilel
Rapport PFE Application Web Mobiles belwafi bilel
 
Rapport de stage
Rapport de stageRapport de stage
Rapport de stage
 
Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2
Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2
Rapport Projet De Fin D'étude Développent d'une application web avec Symfony2
 
Rapport de stage PFE ( DUT) chez Synthèse Conseil - Jaiti Mohammed
Rapport de stage PFE ( DUT) chez Synthèse Conseil  - Jaiti MohammedRapport de stage PFE ( DUT) chez Synthèse Conseil  - Jaiti Mohammed
Rapport de stage PFE ( DUT) chez Synthèse Conseil - Jaiti Mohammed
 
Conception et développement d’un Système de réservation en ligne
Conception et développement d’un Système de réservation en ligneConception et développement d’un Système de réservation en ligne
Conception et développement d’un Système de réservation en ligne
 
Rapport PFE : Développement D'une application de gestion des cartes de fidéli...
Rapport PFE : Développement D'une application de gestion des cartes de fidéli...Rapport PFE : Développement D'une application de gestion des cartes de fidéli...
Rapport PFE : Développement D'une application de gestion des cartes de fidéli...
 
Rapport Projet de Fin d'Etudes
Rapport Projet de Fin d'EtudesRapport Projet de Fin d'Etudes
Rapport Projet de Fin d'Etudes
 
Rapport pfe
Rapport pfeRapport pfe
Rapport pfe
 

En vedette

Rapport de stage problematisé : la place d'originalité dans la communication
Rapport de stage problematisé : la place d'originalité dans la communicationRapport de stage problematisé : la place d'originalité dans la communication
Rapport de stage problematisé : la place d'originalité dans la communicationCamille Perazzi
 
Audit personnalisé Performance Tourisme
Audit personnalisé Performance TourismeAudit personnalisé Performance Tourisme
Audit personnalisé Performance TourismePerformance_Tourisme
 
L'audit juridique de site internet : préconisations pratiques
L'audit juridique de site internet : préconisations pratiquesL'audit juridique de site internet : préconisations pratiques
L'audit juridique de site internet : préconisations pratiquesBernard LAMON
 
Formation Audit et Benchmark de site internet
Formation Audit et Benchmark de site internetFormation Audit et Benchmark de site internet
Formation Audit et Benchmark de site internetSimaWay Simaway
 
Analyse de site e-commerce : maliceoffice.calipage.be
Analyse de site e-commerce : maliceoffice.calipage.beAnalyse de site e-commerce : maliceoffice.calipage.be
Analyse de site e-commerce : maliceoffice.calipage.beThomas Malice
 
Analyse audit-site web-blog-ecommerce
Analyse audit-site web-blog-ecommerceAnalyse audit-site web-blog-ecommerce
Analyse audit-site web-blog-ecommerceAmel Miaoulis
 
Site internet : bonnes pratiques Audit site web d'agence de voyage : ergono...
Site internet : bonnes pratiques   Audit site web d'agence de voyage : ergono...Site internet : bonnes pratiques   Audit site web d'agence de voyage : ergono...
Site internet : bonnes pratiques Audit site web d'agence de voyage : ergono...Yassine Hafid
 
Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...
Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...
Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...Farid Mheir
 
Le contenu éditorial sur Internet : les clés du succès
Le contenu éditorial sur Internet : les clés du succèsLe contenu éditorial sur Internet : les clés du succès
Le contenu éditorial sur Internet : les clés du succèsVincent Pereira
 
Audit du site web marionnaud
Audit du site web marionnaudAudit du site web marionnaud
Audit du site web marionnaudEmilieWj
 
Audit de site Capitaine Train
Audit de site Capitaine TrainAudit de site Capitaine Train
Audit de site Capitaine TrainMarilooouuu
 
Audit de site Yves Rocher Roxana Nuta
Audit de site Yves Rocher  Roxana NutaAudit de site Yves Rocher  Roxana Nuta
Audit de site Yves Rocher Roxana NutaRoxana Nuta
 
Audit site web
Audit site webAudit site web
Audit site webscavaille
 
Toutes les clés d'une stratégie ecommerce réussie
Toutes les clés d'une stratégie ecommerce réussieToutes les clés d'une stratégie ecommerce réussie
Toutes les clés d'une stratégie ecommerce réussieNeocamino
 

En vedette (19)

Rapport de stage problematisé : la place d'originalité dans la communication
Rapport de stage problematisé : la place d'originalité dans la communicationRapport de stage problematisé : la place d'originalité dans la communication
Rapport de stage problematisé : la place d'originalité dans la communication
 
Bonnes pratiques pour un site internet reussi
Bonnes pratiques pour un site internet reussiBonnes pratiques pour un site internet reussi
Bonnes pratiques pour un site internet reussi
 
Audit personnalisé Performance Tourisme
Audit personnalisé Performance TourismeAudit personnalisé Performance Tourisme
Audit personnalisé Performance Tourisme
 
L'audit juridique de site internet : préconisations pratiques
L'audit juridique de site internet : préconisations pratiquesL'audit juridique de site internet : préconisations pratiques
L'audit juridique de site internet : préconisations pratiques
 
Formation Audit et Benchmark de site internet
Formation Audit et Benchmark de site internetFormation Audit et Benchmark de site internet
Formation Audit et Benchmark de site internet
 
Audit de votre site web 10 points à vérifier
Audit de votre site web   10 points à vérifierAudit de votre site web   10 points à vérifier
Audit de votre site web 10 points à vérifier
 
Analyse de site e-commerce : maliceoffice.calipage.be
Analyse de site e-commerce : maliceoffice.calipage.beAnalyse de site e-commerce : maliceoffice.calipage.be
Analyse de site e-commerce : maliceoffice.calipage.be
 
Analyse audit-site web-blog-ecommerce
Analyse audit-site web-blog-ecommerceAnalyse audit-site web-blog-ecommerce
Analyse audit-site web-blog-ecommerce
 
Site internet : bonnes pratiques Audit site web d'agence de voyage : ergono...
Site internet : bonnes pratiques   Audit site web d'agence de voyage : ergono...Site internet : bonnes pratiques   Audit site web d'agence de voyage : ergono...
Site internet : bonnes pratiques Audit site web d'agence de voyage : ergono...
 
Audit SEO de A à Z
Audit SEO de A à ZAudit SEO de A à Z
Audit SEO de A à Z
 
Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...
Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...
Commerce de détail: à faire et à éviter en eCommerce - une analyse de 10 site...
 
Le contenu éditorial sur Internet : les clés du succès
Le contenu éditorial sur Internet : les clés du succèsLe contenu éditorial sur Internet : les clés du succès
Le contenu éditorial sur Internet : les clés du succès
 
Audit du site web marionnaud
Audit du site web marionnaudAudit du site web marionnaud
Audit du site web marionnaud
 
Grille Audit Site Web
Grille Audit Site WebGrille Audit Site Web
Grille Audit Site Web
 
L'audit web
L'audit webL'audit web
L'audit web
 
Audit de site Capitaine Train
Audit de site Capitaine TrainAudit de site Capitaine Train
Audit de site Capitaine Train
 
Audit de site Yves Rocher Roxana Nuta
Audit de site Yves Rocher  Roxana NutaAudit de site Yves Rocher  Roxana Nuta
Audit de site Yves Rocher Roxana Nuta
 
Audit site web
Audit site webAudit site web
Audit site web
 
Toutes les clés d'une stratégie ecommerce réussie
Toutes les clés d'une stratégie ecommerce réussieToutes les clés d'une stratégie ecommerce réussie
Toutes les clés d'une stratégie ecommerce réussie
 

Similaire à Rapport problématisé de stage : penser l'ergonomie et l'expérience utilisateur d'un site web : l'art du web designer

Plaquette bachelor web-design-et-communication
Plaquette bachelor web-design-et-communicationPlaquette bachelor web-design-et-communication
Plaquette bachelor web-design-et-communicationWilfried Rovetto
 
CERTIFICATION EN DIGITAL MARKETING MANAGEMENT
CERTIFICATION EN DIGITAL MARKETING MANAGEMENTCERTIFICATION EN DIGITAL MARKETING MANAGEMENT
CERTIFICATION EN DIGITAL MARKETING MANAGEMENTWilliam ENOCH
 
Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...
Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...
Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...Thomas Blanc
 
Retours sur les Flupa UX-Days 2017
Retours sur les Flupa UX-Days 2017Retours sur les Flupa UX-Days 2017
Retours sur les Flupa UX-Days 2017Nicolas GOYER
 
Cv claire pichon - Stratège - Montréal
Cv claire pichon - Stratège - MontréalCv claire pichon - Stratège - Montréal
Cv claire pichon - Stratège - MontréalClaire Pichon
 
dut src ppp projets personnel et professionnel séance 01
dut src ppp   projets personnel et professionnel  séance 01dut src ppp   projets personnel et professionnel  séance 01
dut src ppp projets personnel et professionnel séance 01JCD srcmontbeliard
 
La-communication-digitale-only-by-b-ready-Vdef.pdf
La-communication-digitale-only-by-b-ready-Vdef.pdfLa-communication-digitale-only-by-b-ready-Vdef.pdf
La-communication-digitale-only-by-b-ready-Vdef.pdfBilelDallagi1
 
Blue Forest - Pitch Deck v1.4
Blue Forest - Pitch Deck v1.4Blue Forest - Pitch Deck v1.4
Blue Forest - Pitch Deck v1.4Blue Forest
 
Memoire M2 - Le role du mobile dans le parcours client en Assurance
Memoire M2 - Le role du mobile dans le parcours client en AssuranceMemoire M2 - Le role du mobile dans le parcours client en Assurance
Memoire M2 - Le role du mobile dans le parcours client en AssuranceÉléonore Hugot
 
RAPPORT DE STAGE - THURB
RAPPORT DE STAGE - THURBRAPPORT DE STAGE - THURB
RAPPORT DE STAGE - THURBthurb2
 
Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...
Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...
Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...Ludivine Caron
 
Catalogue Stratégies Formations 2016
Catalogue Stratégies Formations 2016Catalogue Stratégies Formations 2016
Catalogue Stratégies Formations 2016Caroline Dupire
 
GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...
GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...
GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...Roméo LIMA
 
Plaquette 2012 - HETIC
Plaquette 2012 - HETICPlaquette 2012 - HETIC
Plaquette 2012 - HETICHETIC
 

Similaire à Rapport problématisé de stage : penser l'ergonomie et l'expérience utilisateur d'un site web : l'art du web designer (20)

Rapport de mission_a5_2017_cordioux_romain
Rapport de mission_a5_2017_cordioux_romainRapport de mission_a5_2017_cordioux_romain
Rapport de mission_a5_2017_cordioux_romain
 
Plaquette bachelor web-design-et-communication
Plaquette bachelor web-design-et-communicationPlaquette bachelor web-design-et-communication
Plaquette bachelor web-design-et-communication
 
CERTIFICATION EN DIGITAL MARKETING MANAGEMENT
CERTIFICATION EN DIGITAL MARKETING MANAGEMENTCERTIFICATION EN DIGITAL MARKETING MANAGEMENT
CERTIFICATION EN DIGITAL MARKETING MANAGEMENT
 
Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...
Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...
Comment mettre en oeuvre des campagnes de marketing automation efficaces répo...
 
Retours sur les Flupa UX-Days 2017
Retours sur les Flupa UX-Days 2017Retours sur les Flupa UX-Days 2017
Retours sur les Flupa UX-Days 2017
 
Cv claire pichon - Stratège - Montréal
Cv claire pichon - Stratège - MontréalCv claire pichon - Stratège - Montréal
Cv claire pichon - Stratège - Montréal
 
dut src ppp projets personnel et professionnel séance 01
dut src ppp   projets personnel et professionnel  séance 01dut src ppp   projets personnel et professionnel  séance 01
dut src ppp projets personnel et professionnel séance 01
 
La-communication-digitale-only-by-b-ready-Vdef.pdf
La-communication-digitale-only-by-b-ready-Vdef.pdfLa-communication-digitale-only-by-b-ready-Vdef.pdf
La-communication-digitale-only-by-b-ready-Vdef.pdf
 
Blue Forest - Pitch Deck v1.4
Blue Forest - Pitch Deck v1.4Blue Forest - Pitch Deck v1.4
Blue Forest - Pitch Deck v1.4
 
Memoire M2 - Le role du mobile dans le parcours client en Assurance
Memoire M2 - Le role du mobile dans le parcours client en AssuranceMemoire M2 - Le role du mobile dans le parcours client en Assurance
Memoire M2 - Le role du mobile dans le parcours client en Assurance
 
RAPPORT DE STAGE - THURB
RAPPORT DE STAGE - THURBRAPPORT DE STAGE - THURB
RAPPORT DE STAGE - THURB
 
Brochure_Bachelor_Digital_Marketing_Site
Brochure_Bachelor_Digital_Marketing_SiteBrochure_Bachelor_Digital_Marketing_Site
Brochure_Bachelor_Digital_Marketing_Site
 
Présentation de Nididé
Présentation de NididéPrésentation de Nididé
Présentation de Nididé
 
Blue Acacia
Blue AcaciaBlue Acacia
Blue Acacia
 
Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...
Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...
Ludivine Caron | Rapport de stage | Licence 3 | Agence de communication multi...
 
Projet Web
Projet WebProjet Web
Projet Web
 
Stratégies Formations
Stratégies FormationsStratégies Formations
Stratégies Formations
 
Catalogue Stratégies Formations 2016
Catalogue Stratégies Formations 2016Catalogue Stratégies Formations 2016
Catalogue Stratégies Formations 2016
 
GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...
GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...
GUIDE 2018 AQUENT : créatifs, designers et innovateur, trouvez votre stage ou...
 
Plaquette 2012 - HETIC
Plaquette 2012 - HETICPlaquette 2012 - HETIC
Plaquette 2012 - HETIC
 

Rapport problématisé de stage : penser l'ergonomie et l'expérience utilisateur d'un site web : l'art du web designer

  • 1.  
  • 2.   2           Master  1ère  année   Mention  Information  Communication             Penser l’ergonomie et l’expérience utilisateur d’un site internet : l’art du web designer     L’apport et le rôle du métier de web designer au sein d’une agence de communication/web             Stage  réalisé  au  Luxembourg,     Sous  la  tutelle  de  Rudolphe  Aben,  directeur  d’agence  &  commercial       Par   Camille PERAZZI   Dates  du  stage   04.04.2016  –  01.06.2016         Tuteur  universitaire  :     Sébastien  Albert   Année universitaire 2015-2016
  • 3.   3   Sommaire   INTRODUCTION  DU  PROPOS  ……………………………..…….……………………..  4-­‐8     INTRODUCTION  …………….…………………………………………………………………….……….…………..  4   PROJET  PROFESSIONNEL  &  OBJECTIFS  ……………………………….……………………….....……..  5-­‐6   PLAN  DU  RAPPORT  DE  STAGE  PROBLÉMATISÉ  ………………….……………………..…………...  6-­‐8     PRÉSENTATION  DU  CADRE  DU  STAGE  ………………………………………….  8-­‐12     PRÉSENTATION  DE  L’ENTREPRISE  D’ACCUEIL  &  SES  OBJECTIFS  ……………….…………..  8-­‐9   LISTE  DES  MISSIONS  ………………………………………………………………………….………………..  9-­‐11   LE  CADRE  DE  LA  PROBLÉMATIQUE  …………………………….………….…………...……………..  11-­‐12     PRÉSENTATION  DE  LA  PROBLÉMATIQUE  ….………………..……………..  12-­‐16     ENONCIATION  DE  LA  RÉFLEXION  PROBLÉMATISÉE  …………….…..…….…………………..  12-­‐14   LES  CRITÈRES  &  FINALITÉS  QUI  FONDENT  LA  PERTINENCE  DE  LA  RÉFLEXION   PROBLÉMATISÉE  ……………………………………………………………………….………………………14-­‐16     TRAITEMENT  DE  LA  PROBLÉMATIQUE  ………………..….……….………..  16-­‐33     INTRODUCTION  ………………………………………………………..………………..………….…………..  16-­‐18   PENSER  L’EXPÉRIENCE  UTILISATEUR  :  UNE  ÉTAPE  PRIMORDIALE  DANS  LA   RÉALISATION  D’UN  SITE  WEB    ……………………………………………………..….…………….…..  19-­‐26       ERGONOMIE  &  UTILISABILITÉ  …………………………………………………………………...…………………….  19-­‐21     WEB  DESIGNER  :  LE  TRAVAIL  EN  AMONT  POUR  PENSER  L’INTERFACE     HOMME-­‐MACHINE  (IHM)  ………………………………………………………………………………..……………….  21-­‐23     LE  DESIGN  PERSUASIF,  UNE  CLEF  POUR  SÉDUIRE  &  SATISFAIRE  ?  …………………………..……….  23-­‐26     LES  ATOUTS  &  LES  LIMITES  DE  L’USAGE  DES  TEMPLATES    ………..………………..……..  25-­‐32       DE  LA  FICHE  DE  STYLE  À  WIX  EN  PASSANT  PAR  WORDPRESS,  QUEL  SENS  ?  …………………….  26-­‐28     VERS  UNE  STANDARDISATION  DES  SITES  ?  …………………………………………………………..………….  28-­‐31     AVANT  TOUT  UNE  ENVIE  DES  CLIENTS  :  UNE  LOGIQUE  D’ADAPTATION……………..…………….  31-­‐32     CONCLUSION  ………………………………………………………………………………..……….…………..  33-­‐35     RÉFÉRENCES  ……………………………………………………………………...……..……..  36     REMERCIEMENTS  ……………………………………………………………..……………..  37     ANNEXES  ……………………………………………………………………..……………..  38-­‐49     ÉVALUATION  DU  STAGE  ………………………………………………………...………..  51      
  • 4.   4   I. Introduction du propos. 1. Introduction. Relativement différent du programme de licence 3 en terme d’approfondissement des notions et de pratique, le master 1 en information et communication parcours création de projets numériques offre davantage de matières et d’outils afin de nous professionnaliser et de concrétiser notre projet futur. Durant cette année nous avons ainsi manipuler davantage certaines notions notamment l’HTML/CSS mais nous avons également fait du benchmarking, du web design etc. Tous ces éléments qui, rassemblés, nous plongent dans le monde du travail. De plus, nous avons vu en profondeur ce qu’était le métier de chef de projet lors du lancement et de la création du projet fil rouge, une réelle mise en situation de ce qui nous attend dans le monde professionnel : travail en équipe, collaboration, contact avec le client, respect du cahier des charges, les délais etc. Le stage est venu compléter et concrétiser cela en mettant directement en application nos connaissances et acquis universtaire. Celui-ci sert ainsi à lier nos facultés et à les mettre en oeuvre au service de l’entreprise qui nous accueille. En retour, celle-ci doit également nous apporter son savoir, savoir-faire et façon de travailler afin que nous ayons une approche plus précise du métier convoité et d’enrichir nos connaissances dans la communication numérique. Chaque entreprise est différente, qu’elle soit agence de communication, agence web ou plus grande société, leur approche, leur façon de communiquer et de répondre aux besoins des clients restent différentes. En tant que stagiaire dans une structure, il est important de développer et montrer nos acquis, qu’ils soient universitaire ou non, en tant que plus-value à apporter à l’agence qui nous accueille. Il sert également à nous projeter dans un métier proche ou égal à celui que nous convoitons et les tâches confiées seront des expériences qui viendront, ou non, confirmer nos choix. Cette mise en situation est bénéfique afin de voir le déroulement total ou partiel d’un projet, de voir la communication de l’entreprise et également comment elle se positionne. Cette immersion professionnelle est également un excellent moyen de se perfectionner puisqu’en étant directement en situation dans un contexte donné, il est plus facile d’appréhender et d’apprivoiser la tâche confiée. En outre, il est judicieux d’être stratège et tacticien dans la recherche du stage ainsi que dans la structure suivant les missions à effectuer pour, au mieux, avoir une vision positive qui pourrait nous conforter dans notre idée de départ en terme professionnel.
  • 5.   5   2. Projet professionnel et objectifs. Du point de vue personnel, j’ai suivi le parcours “logique” puisque j’ai validé ma licence en information et communication l’année dernière et que mon objectif était, et est toujours, de mener à bien ce même master. Grâce à ce parcours, je bénéficie déjà d’une expérience professionnelle issue du même domaine à l’aide du stage réalisé en lience 3 dans une agence de communication chez Mescudi1 . Ce stage, qui avait pour mission principale d’être infographiste, m’avait également montré le métier de chef de projet tout en restant actrice de celui-ci puisque ce n’était pas ma tâche principale. Suite à ce stage je possède déjà des notions concernant la gestion de projet (les budgets, les tâches, les délais, les relations avec les clients etc.) tout en restant extérieure à ce métier. En somme, ma mission principale consistait à créer des logos, des cartes de visite, des visuels, des flyers en dehors des tâches secondaires pour suppléer les employés dans leurs réalisations. Ce stage était enrichissant puisqu’il vient parfaitement compléter mon projet futur qui consiste à devenir chef de projet spécialisé web designer. En tant que web designer il est important de maitriser, au minimum, les bases des outils de la suite adobe tels que Photoshop et Illustrator et c’est justement mon précédent stage qui m’a permis d’acquérir ces compétences très utiles pour le futur. Par conséquent, mon stage réalisé en licence 3 était une parfaite mise en situation dans laquelle j’ai pu être spectatrice du métier que je convoite en tant que chef de projet, et les cours de master 1 sont venus intensifier cela avec davantage d’exemples et de notions comme la création des devis et le travail en équipe, par exemple. Mon souhait est de travailler dans une agence de communication web, une structure où la polyvalence serait maitre. Je convoite une agence réunissant une petite équipe où l’entraide, l’écoute et la communication seraient primordiales. Au sein de l’équipe je n’hésiterai donc pas à être polyvalente : être chef de projet, être web designer ainsi que conseiller et écouter mes collègues. Au sein du stage de master 1 c’est principalement la polyvalence qui est ressortie, puisque, nous le verrons par la suite, j’ai assisté mon maitre de stage et j’ai également mener à bien diverses tâches réalisables au sein d’une agence web (community management, web développeur, graphiste, photographe etc). En débutant en tant que chef de projet junior et d’après mon expérience je pense être en mesure de gérer l’ensemble d’un projet et de répondre aux besoins exprimés des clients suite                                                                                                                 1 Agence de communication - Thionville
  • 6.   6   au cahier des charges. Mon sens de l’observation, ma curiosité, mon sens relationnel et mon sérieux sont des qualités importantes qui respecterons la qualité du travail effectué mais aussi les délais et le budget suivant les projets. Concernant la spécialité du métier de web designer cela serait une réelle passion de mettre en oeuvre mes connaissances et expériences avec internet pour répondre à la demande du client à l’aide d’un dispositif créatif, original, moderne et innovant, en veillant bien évidemment à respecter le cahier des charges défini auparavant. Concevoir un site internet en pensant sa structure, son design et les interactions qui vont découler tout en étant à la fois chef de projet serait tout à fait crédible et possible dans une agence de communication/web d’une petite structure. Ce sont mes deux expériences précédentes, mon savoir, mes acquis universitaires et ma façon d’être qui me confortent dans l’idée de métier que je souhaite exercer l’année prochaine : chef de projet spécialisé web designer. 3. Plan du rapport de stage problématisé. Nous l’aborderons plus en détail dans la partie suivante qui présentera l’entreprise, l’agence qui m’a accueillie est constituée de deux associés qui ont pour mission principale de créer des sites internet. Leurs valeurs sont les suivantes : répondre au plus vite à la demande des clients en les satisfaisant à l’aide d’un site sobre, simple et un devis proportionnel. De ce fait, cette dernière juge qu’un web designer n’est pas primordial pour la réalisation d’un site web du fait qu’avec ce métier on ne peut donc pas lier rapidité et simplicité dans la conception d’un site internet. Web designer étant le métier que je souhaite intégrer dans mon futur métier, j’ai donc jugé important de traiter le rôle de celui-ci au sein de la problématisation de mon stage. Grâce aux cours reçus en licence 1 et principalement grâce à Olivier Beining2 qui nous a offert ses connaissances et fait découvrrir son métier, je juge cette fonction comme était indispensable à la réalisation d’un site internet qui réponde au mieux à la demande des clients mais, avant tout, des internautes qui vont naviguer sur le site.                                                                                                                 2 Professeur du cours de Web Design – Semestre 1 Master 1
  • 7.   7   Du point de vue de l’entreprise d’accueil, Business Casanova, la réalisation de leurs sites internet se fait via le CMS3 Wordpress et, le plus souvent, avec l’aide du thème Divi qui permet des possibilités multiples et reste assez souple dans son utilisation. Il va de soit qu’avoir un web designer au sein de son équipe permet de développer la créativité et l’orignalité d’un site internet en le démarquant ainsi des autres. En utilisant des templates4 présents sur Wordpress et en prônant la rapidité et la simplicité nous verrons que cela peut être un frein à la démarcation et l’innovation au sein du web. Cependant, nous sommes conscients que l’écoute du client est nécessaire et qu’il faut ainsi tenir compte avant tout de ses besoins auxquels répond positivement l’agence Business Casanova en satisfaisant les demandes. Nous aborderons donc au fil de la rédaction du mémoire de stage quels sont les avantages et les inconvénients d’avoir recours à des layouts en pensant le métier de web designer comme étant utile en terme d’inventivité mais aussi en ce qui concerne l’expérience utilisateur. Il faut penser l’apport du métier de web designer comme efficace pour aborder l’ergonomie et l’utilisabilité d’un dispositif, en l’occurrence d’un site internet. A travers ce mémoire de stage, il sera intéressant de définir les tâches du métier de web designer et ce qu’il englobe pour penser l’interaction homme-machine. Pour illustrer cela nous pourrons évoquer cette relation internaute-site internet à l’aide du design persuasif relevant ainsi du métier de web designer comme étant positif pour cette interaction. Dans un second temps nous traiterons des limites de l’usage des gabarits ainsi que leurs atouts en retrançant l’évolution de l’élaboration des sites internet en partant de la fiche de style en passant par Wordpress et Wix. Dans cette approche il sera approprié de s’orienter vers la question suivante : sommes-nous en train de tomber dans une standardisation des sites via ces usages ? Mais avant tout, les métiers de la communication doivent répondre à la demande des clients qui est l’acteur décisif du projet, notamment pour le délai, les étapes de validation, le budget et pour la notoriété de l’agence de communication/web en elle-même.                                                                                                                 3 Un CMS – ou SGC – (système de gestion de contenu) : “programme informatique utilisant une base de données et permettant de gérer de A à Z l’apparence et le contenu d’un site web.” – www.cms.fr 4 Synonymes récurrents au sein de ce rapport : layout, gabarit, modèle de page. Ce sont de modèles préconçus sur lequel les web développeurs se basent pour confectionner les sites.
  • 8.   8   C’est donc autour de cette problématique que sera rédigé mon rapport de stage en tentant de convaincre que la présence et le travail d’un web designer est bénéfique pour une agence de communication. II. Présentation du cadre du stage. 1. Présentation de l’entreprise d’accueil et ses objectifs. L’entreprise Business Casanova est une agence web située au Luxembourg. Présente sur le marché depuis 1 an et demi, cette dernière a déjà à son actif des références conséquentes pour parfaire son image et sa réputation. Constituée de deux principaux acteurs que sont Rudolphe ABEN et Emilien JOURDAN, ces derniers ont développé l’agence en vue de créer une communication web efficace pour leur clientèle. Leur façon de travailler est peu commune dans le monde de la communication puisqu’ils privilégient le travail à distance, soit le télétravail. Dans cet environnement de travail chacun a une tâche bien définie : -­‐ Rudolphe : le commercial chargé de trouver les clients et leur vendre le produit. Il assure également la partie administrative, notamment la confection des devis et la gestion du produit en se rendant directement chez le client lui présenter leurs créations. -­‐ Emilien : le web développeur chargé de répondre à la demande des clients en leur créant le site internet souhaité. L’agence en elle-même a donc pour finalité de concevoir des sites internet en répondant à la demande des clients. Il peut s’agir de site vitrine ou d’e-commerce, selon la visée souhaitée. Pour ce faire, l’entreprise est friande du CMS Wordpress qui est leur outil de développement qu’ils jugent souple, maniable et simple d’utilisation pour eux et leurs clients. Pour accompagner le site web, ils proposent également la confection des réseaux sociaux utiles au bon développement de l’entreprise de leur clientèle ainsi que pour avoir une communication plus efficace. Elle propose également de référencer au mieux leurs productions afin de générer du trafic et positionner le site sur la toile, toujours suivant la volonté du client. Pour compléter cela, Business Casanova propose de faire des campagnes e-
  • 9.   9   mailing dans le but de fidéliser les clients et/ou d’attirer des prospects à l’aide de ces campagnes modernes et intelligentes. Un point propre à l’agence est à noter, cette dernière démarche les clients par téléphone afin de leur proposer leurs services et convenir d’un rendez-vous pour présenter le devis. Autrement dit, les clients ne viennent pas directement à l’agence puisque Business Casanova ne possède qu’un bureau pour y travailler lorsqu’ils ne privilégient pas le télétravail. C’est cette partie que Rudolphe prend en main afin de gagner des clients. 2. Liste des missions. Mission Client Détails de la mission Gestion des réseaux sociaux – Community Management -­‐ Textinova -­‐ The Best Key -­‐ Yves Braun -­‐ Hortos Fleurs Intégration de contenus (textes et images), création de concours, interaction avec les clients. Création d’infographies -­‐ Business Casanova -­‐ Yves Braun -­‐ The Best Key -­‐ Textinova Réalisation d’un diaporama présentant l’entreprise (valeurs, travail, référence). Modernisation de logos et création pour des réseaux sociaux. Audit -­‐ Textinova Comprendre et analyser le client ainsi que son site existant. Proposer des améliorations pour vendre et mieux référencer le site. Trouver des markets place pour mettre les articles. Traduction -­‐ Textinova Traduction du site entier en italien. Photographies -­‐ Tommys Box -­‐ Hortos Fleurs -­‐ Tapis d’Orient -­‐ Frising Decoration -­‐ Yves Braun Photographies réalisées à l’aide de mon reflex pour mettre à jour le contenu image des sites des clients. -­‐ Tommys Box : plats japonais.
  • 10.   10   -­‐ Hortos Fleurs : compositons florales et bijoux. -­‐ Tapis d’Orient : tapis; -­‐ Frising Decoration : devanture de la boutique. -­‐ Yves Braun : ses nouveauté. Intégration de contenus -­‐ Tommys Box -­‐ Hortos Fleurs Intégration des photographies prises pour innover, moderniser le site et pour proposer des contenus non existants pour un site en création. Découverte e- commerce -­‐ Textinova Création de codes promotionnels pour qu’ils soient applicables lors des concours annoncés sur Facebook. Création de Newsletters -­‐ Tous les clients de l’agence Pour Textinova : création et envoi de la première newsletter pour la cliente. Création du visuel, du texte, du code promotionnel et de l’envoi grâce au dispositif MailChimp. Pour les autres clients : création du design des newsletter de présentation de leur entreprise. Création de site -­‐ The Dog Company Refonte totale d’un site existant à l’aide de Wordpress et du thème Divi. Création des pages, du texte et de la navigation complète. Récupération du contenu déjà existant (texte et image). Création du logo et de la charte graphique. Finalité : créer un site moderne, à l’image de l’entreprise et responsive.
  • 11.   11   Formations -­‐ Gisèle (seconde stagiaire de l’agence) -­‐ Wordpress (présentation du tableau de bord, création de pages, présentation de thème divi + installation d'autres thèmes, création d'un menu, intégration de contenus) -­‐ Réseaux sociaux (création de Facebook, Instagram, Twitter) -­‐ Mailchimp (Création de compte + création templates + créer une liste) -­‐ Trello (présentation de l'outil) -­‐ Formation à distance à l’aide d’une vidéo. 3. Le cadre de la problématisation. Rappelons le, Business Casanova ne souhaite pas intégrer de web designer au sein de son agence. Etant donné que je souhaite mettre en avant mes compétences et savoirs acquis lors de mes années universitaires, je suis en mesure de juger la présence d’un web designer comme étant primordiale au bon déroulement du processus de création d’un site web. Business Casanova est une petite structure composée de deux membres, la polyvalence est ainsi maîtresse. Après de longues discussions avec mon maitre de stage, Rudolphe Aben, je suis parvenue à mieux cerner leur façon de travailler : travailler vite et le moins cher possible pour répondre à la demande du client. Ce faisant, l’agence ne juge pas important d’avoir un web designer dans la conception puisqu’il s’agirait d’une perte de temps et d’argent. Penser l’expérience utilisateur avant le lancement du site est mineur pour eux puisqu’ils fonctionnent de la sorte : c’est eux qui proposent un site au client, ce n’est pas le client qui vient à eux pour qu’ils réalisent sa demande. En se rendant ainsi chez le client pour le démarcher, Rudolphe
  • 12.   12   prend des notes sur son carnet et transmet cela oralement à son associé Emilien qui réalise le site internet. Les étapes en amont de la création d’un site web ne sont donc pas nécessaires et importantes pour concevoir un site internet selon Business Casanova. Le cadre de mon mémoire de stage consiste donc à démontrer que pour rendre l’expérience utilisateur la plus positive possible lors de la mise en ligne du site, il y a des étapes à prendre en compte afin de penser cette expérience avant le produit mais également que le rôle du web designer est utile d’un point de vue timing. A travers des exemples concrets dont j’ai été témoin pendant mon stage nous verrons qu’il accélère le productivité et donc le gain de temps. Outre la créativité, l’innovation et l’originalité que pourrait apporter un web designer grâce à ses compétences, il faut mettre en avant que son rôle consiste à anticiper l’usage du site en répondant aux attentes des internautes. Pour accentuer cela, nous pouvons également évoquer les tâches du web designer UX qui va encore plus loin en ayant recours à diverses méthodes (brainstorming, cartes d’idéation, expérience maps etc.) concernant cette expérience homme-machine. Ce travail aurait été important d’approfondir mais je pense sincèrement que cela résulte d’un travail de mémoire de recherche et non de mémoire de stage. C’est pourquoi je vais me concentrer sur le métier de web designer qui réalise les étapes en amont de la conception en recourant à la méthode dite “maquettage”. III. Présentation de la problématique. 1. Enonciation de la réflexion problématisée. Du fait que l’entreprise Business Casanova n’utilise que le CMS Wordpress et principalement le thème Divi et, plus ancien, Modern Interior pour satisfaire les demandes des clients, nous pouvons remarquer au fil de leurs réalisations une certaine “standardisation” et redondance des sites. Pour cette agence, l’utilisation de templates vient accentuer l’idée que le web designer n’est pas nécessaire pour penser l’interface, l’ergonomie ainsi que le design du futur site. C’est de ce point de vue que sera donc orienté mon mémoire de stage où le recours à des layouts permet à une agence de se passer d’un web designer. Suite à cela, nous pouvons poser la problématique suivante : Quelles sont les limites de l’usage des templates et quels sont les apports spécifiques du web designer dans la conception web ?
  • 13.   13   Pour concevoir un site internet, il est primordial de penser l’interaction des futurs usagers avec le site en question. L’ergonomie est donc un point à prendre en compte de la part d’un web designer, il doit en effet adapter le site afin qu’il soit fonctionnel, simple d’utilisation, qu’il réponde tout simplement aux besoins des usagers suivant la finalité du site (site vitrine ou e-commerce par exemple). Pour faire cela au mieux il existe diverses méthodes que ce métier doit prendre en compte pour la conception. Nous le disions précédemment, la méthode de maquettage est une réponse à cela, autrement dit les étapes de conception de l’arborescence, des zonings, des wireframes et les maquettes graphiques. Pour aller plus loin, il existe également le métier de web designer UX qui conçoit et évalue d’autant plus les sytèmes interactifs tels qu’un site internet mais, comme dit précédemment, cela relèverait d’un travail de mémoire plutôt que d’un rapport de stage problématisé. Cependant, le web designer peut tout aussi bien s’inspirer des méthodes utilisées par le web designer UX si l’entreprise l’autorise puisque les méthodes pratiquées demande du temps. L’ouvrage principal qui constitue certaines notions et outils utiles pour ce mémoire de stage est, sous les conseils de Luc Massou, Méthodes de design UX – 30 méthodes fondamentales pour concevoir et évaluer les systèmes interactifs de C.Lallemand et G.Gronier. De façon générale, ce livre donne des définitions de termes clefs bénéfiques à la rédaction de ce mémoire de stage mais également des règles et méthodes propices au bon développement d’un système interactif, dans notre cas, d’un site web. Comme le mentionne le titre du livre, il s’agit d’approches du web designer UX, il est donc judicieux de trier les dires afin de nous occuper uniquement des parties qui se rapprochent du métier de web designer, au risque d’aller trop loin. Nous le savons, un site internet contemporain doit se détâcher des autres afin de se distinguer de la concurrence. Par conséquent, le web designer doit rendre le dispositif attirant, agréable, prenant et ce livre guide le web designer à l’aide de méthodes pour penser et développer ce système interactif. Ce sont des pratiques à assimiler et intégrer dans les étapes de conception afin de satisfaire le client dans ses souhaits mais, surtout, pour faire en sorte que le site lui soit bénéfique et réponde à la demande des internautes dans leur navigation et recherche(s). En outre, cet ouvrage est une piste intéressante pour nourrir ma rédaction puisque centré directement sur le métier au cœur de mon rapport et également sur le métier dont fait l’impasse l’entreprise Business Casanova. Il s’agira donc pour moi, à travers mon expérience personnelle, mes acquis universitaires et mon observation tout au long de mon stage de master 1 d’argumenter l’idée principale qui constitue ce rapport de stage problématisé.
  • 14.   14   Au vue de mes constatations de ce stage chez Business Casanova, les savoirs offerts par mes professeurs d’information et communication ainsi que la vision personnelle que j’ai du fonctionnement d’une agence de communication je pense sincèrement que nous ne pouvons pas concilier la conception d’un site web sans un web designer, en tout cas, pas dans un esprit original, innovant et créatif. Les templates Wordpress utilisés par l’entreprise d’accueil permettent de multiples possibilités mais nous nous aperçevons rapidemment que les sites fournis aux clients présentent tous des similitudes au niveau du design, de l’ergonomie et de l’interaction (structuration des pages, les menus, les photos, les icônes etc). Cette même identité visuelle permet de répondre à l’idée suivante : créer un site rapide et pas cher. C’est donc de ce point de vue que se basera ma réflexion, sur le fait que l’usage de layout pour confectionner des sites participe à la standardisation de ces derniers et, ce faisant, le web designer n’est pas déterminant dans la production de site. 2. Les critères et finalités qui fondent la pertinence de la réflexion problématisée. Le métier de web designer est la spécialité que je souhaite intégrer dans mon futur métier en tant que chef de projet spécialisé web designer. Mon expérience avec internet n’est pas à négliger, que ce soit pour mon projet futur ou, à plus petite échelle, ce rapport de stage problématisé. Ce constat s’est présenté à moi il y a quelques mois lors de la venue d’Olivier Beining passioné de son métier qui nous a également fait découvrir une de ces facettes. C’est à travers ce cours que j’ai pris conscience que pour devenir web designer il faut avoir déjà acquéri une expérience conséquente en terme de navigation sur le web afin d’assimiler certaines notions et structures. C’est à force de persuasion et découverte que nous arrivons à intégrer certaines normes propres au site internet, ces règles ergonomiques qui facilitent le parcours de l’internaute pour arriver à ses fins (notamment la règle des 3 clics5 , une structuration logique, une cohérence etc.), et cette faculté se présente à moi en tant qu’internaute quotidienne (autrement dit, ma navigation sur divers sites à fréquence rapprochée fait que j’acquiers une expérience conséquente pour visualiser et naviguer dans un site en toute sérénité). De plus, en terme de comparaison, nous pouvons assimiler le métier de web designer à celui d’architecte. Logiquement, il est impensable de construire sa maison sans des plans                                                                                                                 5  Règle ergonomique selon laquelle l’usager doit pouvoir accéder à l’information recherchée par 3 clics ou moins.    
  • 15.   15   préalablement élaborés et pensés par un professionnel. Il en va de même pour produire un site internet qui répondra aux besoins exprimés et recherchés des internautes : le web designer, en tant que professionnel, concevra et organisera le site de sorte à ce que l’internaute navigue sur le site et accède à l’information qu’il est venu chercher. Certes nous sommes conscients que les gabarits proposés par les divers systèmes de gestion de contenu, tels que Wordpress par exemple, répondent à ce besoin ergonomique en structurant et en proposant des mises en page préfaites qui répondent à ce besoin d’utilisabilité. Néanmoins, actuellement, pour se démarquer de la concurrence il est important de se distinguer, d’avoir sa propre mise en forme et c’est également une tâche à réaliser de la part d’un web designer. Il s’agit alors d’une phase essentielle dans la création d’un site en terme d’ergonomie, d’utilisabilité et d’accessibilité en cernant les internautes (la cible du client) et le client. En construisant l’identité visuelle et la charte graphique du client il doit également tenir compte des spécificités techniques du web, comme nous le disions précédemment, les règles ergonomiques par exemple. Cette approche est conforme à la spécialité “création numérique” puisque Web Design fut même un cours que nous avons suivi au cours du premier semestre de master 1. Directement lié au stage, lors de l’envoi de mon curriculum vitae et de ma lettre de motivation en octobre 2015 le titre de mes courriers évoquaient bien l’envie d’exercer le rôle de web designer dans leur structure, en plus de proposer mon aide et donc d’être polyvalente chez eux. Cependant, lors de mon arrivée je me suis rendue compte que le métier de web designer ne faisait pas partie de leur habitude de travail, c’est pourquoi j’ai rapidemment abordé ce point avec mon maitre de stage puisqu’il devait s’agir de ma mission principale. Il y a eu effectivement un malentendu sur ce point puisque, pour lui, le métier de web designer est le même qu’un infographiste. Et en approfondissant ce métier, en lui expliquant les tâches, missions et intérêts d’un web designer il s’est avéré que ce métier “n’est plus d’actualité dans le monde travail d’aujourd’hui, qu’il s’agit d’une perte de temps et d’argent”. Je me suis donc fié à ces règles en tentant justement de comprendre leur mode de travail ainsi que de voir les lacunes et difficultés que l’agence pouvait jsutement rencontrer en omettant d’avoir un web designer dans son équipe. C’est pourquoi, très rapidemment, j’ai eu envie de mettre à l’écrit dans ce mémoire de stage cette problématique rencontrée. Du côté universitaire et concordance avec mes études en information et communication parcours création de projets numériques, la problématique de mon mémoire de stage est clairement une question intéressante à aborder. En se référant au mode de travail utilisé par l’agence de communcation Business Casanova nous pouvons ainsi réellement de poser la question suivante : le web designer est-il fondamental pour concevoir un site internet ? C’est
  • 16.   16   justement là que réside toute ma réflexion qui va suivre. Dans l’ère de l’immédiateté, les clients souhaite avoir leur produit fini livré le plus rapidemment et le moins cher possible : c’est à cette demande que répond Business Casanova. Cependant, cette façon de travailler remet totalement en cause le métier du web designer qui ne serait alors plus bénéfique et nécessaire pour penser et concevoir un site internet. Mon point de vue s’oppose à cela puisqu’en tant qu’étudiante à l’université de Lorraine en créations numériques, nous sommes conscients qu’il faut aller au delà de la simple utilisation de gabarits de page préfaits par les systèmes de gestion de contenu. En ce sens, il y a des stratégies à aborder pour justement positionner le client sur le marché afin que son site internet lui apporte quelque chose. Une simple présence sur internet ne suffit plus, il faut aller au delà et donc se pencher directement sur côté utilisateur, ce à quoi doit veiller un concepteur de site internet : un web designer. La plus-value de cet acteur est notable dans la confection de portails d’informations, de sites d’entreprises, de sites commerciaux etc. C’est justement à travers ce mémoire de stage que sera abordée cette problématique liée à l’usage constant des layouts et en quoi cela participe à la standardisation des sites internet de sorte à ce que le client ne puisse pas réussir à se démarquer sur la toile de ses concurrents et donc d’attirer les clients. IV. Traitement de la problématique. Introduction. La naissance du World Wild Web est la conséquence de ce que nous pouvons aujourd’hui visionner et créer sur la toile. La volonté du créateur Tim Berners-Lee de pouvoir naviguer d’un réseau à un autre en reliant des ordinateurs les uns avec les autres a constitué le web d’aujourd’hui. Cette idée, datant de 27 années, est un mode d’organisation réticulaire de l’information qui renvoyait à une forme d’utopie que représente cette technologie numérique actuellement. Cette notion de partage et de stockage d’information reste le pillier de l’histoire du numérique qui a donné naissance au monde de la société de l’information. Les bases du web constituent une interface hypertextuelle permettant l’accès à l’information, c’est cette même philosophie que nous retrouvons encore aujourd’hui grâce au deploiement des sites internet. Au sein du Web 2.0 actuel, le web a cessé d’être un objet informatique pour devenir un objet info-communicationnel où la démocratisation de l’écriture, le web participatif et le web social sont maîtres. C’est autour de ces notions que se concentrent les agences de
  • 17.   17   communication pour parfaire leur mission : répondre aux demandes et besoins de leurs clients. Autrement dit, le web étant en perpétuelle expansion a permis aux développeurs de le rendre plus utile et captivant. Certains changements ont vu le jour au sein de cette évolution constante : l’html, le css, les divers navigateurs et le responsive web design6 qui sont également des conséquences directes sur les métiers que nous retrouvons dans une agence de communication/web. Qu’ils soient infographistes, web développeurs ou bien encore chefs de projet numérique, ces acteurs se doivent d’être à jour au niveaux des logiciels mais également des pratiques qui émergent. Ces règles influent directement sur l’ergonomie d’un site internet ou bien encore sur l’utilisabilité et son affordance qui sont des points à ne pas négliger pour rendre un site innovant et moderne. L’usage quotidien que nous avons de ces dispositifs est rendu possible grâce à cette évolution constante du web où l’idée de rendre la vie meilleure prend tout son sens en s’adaptant aux besoins et envies des internautes. Le fait que le web soit mouvant a notamment fait naitre de nouveaux métiers qui sont propres au numérique et requis pour concrétiser un projet : le community manager en est un exemple, mais également le web designer. Au départ déstiné aux militaires et donc à un usage privé, le web est, à l’époque actuelle, devenu indispensable et ancré dans nos habitudes. L’envouement de celui-ci ne s’est évidemment pas fait sans conséquences pour les entreprises qui ont tiré profit de cette stratégie de visibilté offerte par l’univers d’internet. Cette technologie mouvante a profité au développement des agences de communication/web pour développer leur métier et faire profiter de leurs compétences à leurs clients. Dans cette ère contemporaine il est primordial de posséder un site internet pour une société : que ce soit, à petite échelle, pour entrer en contact avec celle-ci ou, à plus grande échelle, acquérir de nouveaux clients ou bien encore pour augmenter les ventes d’une certaine marque. D’un simple site vitrine, aux e-commerces les plus développés, il est important d’être visible et surtout accessible sur le web. Nous sommes dans une période où l’immédiateté règne, l’individu veut avoir accès à ce qu’il souhaite le plus rapidemment possible et avoir un site internet est un remède à cela. Cependant, nous sommes conscients que la facilité de bénéficier d’un site web est actuellement en expansion et qu’il est de plus en plus rare qu’une entreprise ne possède pas, au minimum, un simple site pour entrer en communication avec ses clients. Là est la subtilité pour une agence de communication d’innover et de démarquer le site internet de son client afin de maîtriser la concurrence et lui offrir la meilleure visibilité possible. Au risque de basculer vers une                                                                                                                 6 Adaptation du site sur les versions mobiles et tablettes.
  • 18.   18   standardisation des sites, il faut être créatif et innovateur tout en respectant les standards du web imposées. Ces normes évoluent également, en même temps que le web lui-même. Les sites internet qui constituent ce web sont en constante mutation et le design d’une page est “victime” de cela. Loin sont les blocs gris, les logos simples et les navigations basiques, place au dynamisme, aux graphismes les plus proches de la réalité possible et aux parcours les plus fous. Malgré ces nombreuses possibilités offertes parle web aujourd’hui, il faut néanmoins rester lucide vis à vis des normes du web en terme d’ergonomie, d’utilisabilité, d’accessibilité, de graphisme et d’écriture. Pour justement penser cette interface homme-machine ces éléments sont à prendre en considération pour réaliser un site afin de répondre aux besoins exprimés par les internautes mais également pour les fidéliser avec la marque et/ou le site dont il est question. Ainsi, à l’heure où avoir un site internet est possible pour toute entreprise et où le nombre de sites ne cesse de s’accroitre il est important de bénéficier d’un web designer au sein de son équipe pour concevoir et penser un site internet au risque que le site créé ne se perde parmi les concurrents. L’importance de cet acteur est donc importante dans la création d’un site puisque le web designer va construire “le plan” du futur site en tenant compte des envies du client, en ajoutant ses connaissances et sa touche créative en prenant soin de faire valider certaines étapes nécessaire à l’avancement du projet. Utiles, ses tâches viendront positionner la clientèle sur le web à l’aide d’un site répondant à la demande du dit client et des internautes mais également à l’aide d’un design innovant et d’une ergonomie notable en veillant au cahier des charges établi. A l’inverse, et toujours selon les valeurs prônées par l’agence, l’absence d’un web designer et donc l’utilisation constante d’un CMS et d’un thème en particulier va créer une certaine redondance des sites internet. L’utilisation récurrente d’un même thème vient accentuer cette idée où, à quelques couleurs et organisations près, la structuration des sites seront extrêmement similaires, proches de la standardisation. C’est pourquoi nous pouvons nous demander quelles sont les limites de l’usage des templates et quels sont les apports spécifiques du web designer dans la conception web ? Nous aborderons dans un premier temps l’expérience utilisateur comme étant une étape primordiale dans la réalisation d’un site web puis, dans un second temps, nous verrons les atouts et les limites de l’usage des templates.
  • 19.   19   1. Penser l’expérience utilisateur : une étape primordiale dans la réalisation d’un site web. A. Ergonomie et utilisabilité. A l’ère de l’immédiateté, il est important qu’un site web soit construit dans le cadre de facilité d’usage sans négliger la construction esthétique. En effet, “penser l’usabilité et la lisibilité d’une page, cela relève de l’ergonomie” 7 où l'usabilité, qui est une norme ISO, consiste à définir une page avec efficacité, efficience et satisfaction. En compensation, le terme “lisibilité” parle de lui-même puisqu’il s’agit alors de rendre la page web lisible et compréhensible dans sa construction et organisation générale. Avant d’évoquer une quelconque grille d’analyse et méthodes pour évaluer l’ergonomie et l’utilisabilité d’un dispositif il est important de définir ces termes dans notre contexte. Pour penser un système interactif tel qu’un site internet dans notre cas, l’ergonomie repose sur la relation avec l’usager en terme d’interactivité et la facilité d’utilisation. En outre, il s’agit de rechercher une meilleure adaptation entre une fonction (d’achat par exemple), un matériel (ici, le site internet) et son utilisateur. Il faut, en ce sens, que l’usager fasse ce que nous attendons de lui, et c’est là le rôle du web designer en tant que penseur de la structure, de l’organisation et de la navigation du site. Il est clairement identifiable que le seul maître d’une bonne fonction mise en place sur un site reste l’internaute. C’est la cible qu’il faut donc séduire et attirer en rendant le site fonctionnel. C’est là que réside la problématique de l’ergonomie où il faut adapter le dispositif à l’invidu qui va l’adopter. De la sorte, cette approche fonctionnaliste se base sur les besoins de l’individu selon les informations qu’il est venu chercher. Certains ergonomes ont pour cela conçu et pensé certaines méthodes et parmis ces derniers, nous retrouvons J.M.C. Bastien et D. Scapin qui évoquent ces moyens mis en oeuvre pour conseiller, orienter, informer et conduire l’usager lors de ses interactions avec l’outil. Leurs idées constituent des bases de recommandations d’évaluation des interfaces, notamment le guidage (degré de prise en charge de l’usager), l’incitation (les éléments mise en oeuvre pour faire appel, attirer, susciter l’action), la lisibilité (concerne la compréhension de la mise en forme des éléments et l’adaptation de ceux-ci) etc. Un exemple concret vient illustrer cela, le fait qu’aujourd’hui, sur internet, il existe certains modèles mentaux assimilés par les internautes. Cela concerne certaines conventions de                                                                                                                 7 Penser le webdesign, modèle sémiotiques pour les projets multimédias, N.Pignier – B.Drouillat
  • 20.   20   conception qui sont directement liées à l’interprétation. Le cas précis pour démontrer cela s’est présenté à mon stage pour le client The Best Key8 où le web développeur a utilisé une icône à mauvais escient : le “burger” menu. De façon conventionnelle, cette icône traduit le menu de navigation que nous retrouvons sur les sites version desktop9 vers les versions dites responsives10 . Principalement utilisé pour simplifier le contenu et offrir une bonne visilité aux mobinautes, ce menu hamburger est parlant pour l’individu qui l’a intégré suivant son expérience avec ce dernier. Il se l’est donc représenté mentalement et est donc assimilé, sur les versions mobiles, au menu que nous retrouvons sur un site. Dans notre exemple, nous voyons que ce menu hamburger est utilisé sur la version desktop, et non pas pour le menu, mais pour l’identification11 . Lorsque nous basculons vers les interfaces mobiles, nous retrouvons ce menu hamburger mais, l’identification est quant-à elle représentée par trois écrous (non représentatifs également, pour se faire il aurait fallu représenter cela via l’icône représentant une personne par exemple). Cela pose des problèmes d’interprétation et de désorientation du modèle mental que se font les usagers de certaines pratiques propres au web. Ce faisant, cela perturbe la lecture et la navigation sur le site victime de cela. Evoquée précédemment, l’utilisabilité consiste à simplifier, faciliter l’usage d’un site internet afin de le rendre accessible au plus grand nombre (c’est, d’ailleurs, souvent un point auquel il faut répondre pour le client afin que son site est l’impacts souhaité). Selon la norme ISO, l’utilisabilité est “le degré selon lequel un produit peut être utilisé par des utilisateurs identifiés pour atteindre des buts définis, avec efficacité, efficience et satisfaction, dans un contexte d’utilisation donné”. Il convient ainsi de penser “l’expérience utilisateur”12 et le msodèle de Mahlke intègre ces différents aspects qui découlent de cette relation. Ce modèle, de 2008, inclue trois facteurs qui composent cette interaction homme-machine et “influencent la façon dont les utilisateurs perçoivent les produits interactifs”13 : -­‐ les propriétés du système : fonctionnalités, propriétés de l’interface et/ou les dialogues.                                                                                                                 8 Portail immobilier en ligne, constructions & programmes neufs. 9 Ecran de l’ordinateur. 10 Smartphone et tablette. 11 Annexe 1 & 1 bis. 12 Expression utilisée pour la première fois par Norman dans les années 1990. 13 Méthodes de design UX, 30 méthodes fondamentales pour concevoir et évaluer les systèmes interactifs, C.Lallemand – G.Gronier
  • 21.   21   -­‐ les caractéristiques de l’utilisateur : attentes, besoins, motivations, valeurs, connaissances de la cible. -­‐ les paramètres du contexte : la situation dans laquelle le système est manipulé. Cette approche inclue donc l’usager dans cette IHM qui reste l’acteur décisif à prendre en compte afin de rendre son expérience agréable et, surtout, pour le faire adhérer au site, à la marque et aux valeurs qui en émanent. Autrement dit, “écrire des contenus pour le web, c’est d’abord penser aux conditions de leur réception par un destinataire”. Penser ce travail ergonomique et l’usabilité relève d’une certaine logique de conception que devra relever le web designer pour imaginer l’organisation du site internet futur. Pour intégrer ces différentes étapes, certaines réunions de validation seront à établir entre l’agence et le client afin que ce dernier confirme ou non cela. Pour ce faire, différentes maquettes seront créées par le web designer pour aider le client à se projetter. B. Web designer : le travail en amont pour penser l’interface homme-machine (IHM). Souvent inconnu ou jugé non nécessaire au sein d’une agence, le métier de web designer reste pourtant efficace et majeur dans la conception d’un site web. Il est aujourd’hui primordial qu’un site internet réponde au besoin urgent de communication. Pour parfaire cela il existe des méthodes propres au web 2.0 que les agences de communication/web se doivent de maitriser à l’aide du respect des normes web, des meilleures pratiques mais également en terme d’attractivité pour positionner et démarquer le site web. C’est principalement dès les années 90 et, plus tard, au sein du web 2.0, que débuta l’ère de la facilité d’utilisation. C’est de cette phase que sont nées les expressions “interface homme-machine” (IHM) ou “interface personne-système” (IPS) qui ont apporté des considérations pour la conception de sites internet. Et c’est principalement le rôle même du web designer de penser ce lien qui découlera du dispositif conçu avec et pour l’internaute. Pour penser cela, sa responsabilité réside dans le fait de penser l’interface, de l’imaginer et de la concevoir en répondant aux besoins et attentes du client mais surtout, lors de la mise en ligne du site, des internautes qui seront la cible. En ce sens, il s’agit d’orienter une des problématiques qui se pose au web designer de la sorte : “quelle place on va attribuer à l’internaute dans le site, quelles expériences on va lui offrir, ce
  • 22.   22   que l’on va lui proposer comme promesse de navigation, comme possibilités d’actions, de réalisations”14 . Dans le cadre de mon mémoire de stage, le plus important à évoquer reste les étapes de maquettages (croquis et maquettes) qui précèdent la conception en elle-même du site internet. Ce sont ces étapes que nous avons d’ailleurs abordé lors du semestre 1 permettant de rendre compte, à travers des schémas plus ou moins élaborés, du souhait du client. A travers mon stage une tâche m’a été confiée : la refonte totale du site www.thedogcampany.lu15 . Cela comprennait la création du logo, de la charte graphique et du site (adapté sur mobiles et tablettes). Pour mener à bien et au mieux cette tâche j’ai donc conçu les étapes précédemment citées jusqu’à ce que mon maitre de stage me demande d’arrêter mes productions, jugeant cela inutile, trop long et trop coûteux pour eux (c’est pour cela que je n’ai pas conçu les maquettes responsives et que seule la maquette graphique de la page d’accueil desktop est visible). A savoir, le projet m’a été confié sans que mon maître de stage ne prévienne la gérante du site en question, le but étant de le faire et de le lui vendre une fois terminé, j’avais ainsi une liberté totale. Abordées par Olivier Beining lors de son cours Web Design, les étapes judicieuses à concevoir sont : -­‐ La conception de l’arborescence16 : élaboration du menu principalement et donc du choix de navigation proposé à l’internaute. Il doit tenir compte de la règle des trois clics et également d’avoir, au maximum, trois niveaux de menu afin de respecter l’ergonomie minimale. -­‐ Les zonings17 : qui représenteront les zones de l’interface en reflétant de façon schématique les grandes zones qui vont accueillir le contenu. -­‐ Les wireframes18 : cette étape s’élabore au vrai format, la taille des éléments seront représentées telles quelles à l’écran. Il n’y a aucun élément graphique, ce sont uniquement des carrés, des rectangles et du texte. -­‐ Les maquettes graphiques19 : visuels de ce que sera le site d’accueil avec les couleurs, les polices et les images.                                                                                                                 14 Penser le webdesign, modèle sémiotiques pour les projets multimédias, N.Pignier – B.Drouillat 15 Toiletteur pour chats et chiens au Luxembourg 16 Annexe 2 17 Annexe 3 18 Annexe 4 19 Annexe 5  
  • 23.   23   Ces échelons sont à expliquer et à montrer au client afin de les faire valider ou non. Dans mon cas précis je n’avais pas cela à faire puisque la refonte du site était à faire sans “l’accord” du prospect. Cela l’aurait pourtant aidé à visualiser ce que serait son site. De façon plus générale, comme ces schémas sont représentés à l’aide de logiciels (principalement Illustrator et Photoshop) “il est bien plus facile et économique de corriger et modifier une maquette que de corriger les lignes de code d’un système fonctionnel”20 . A cela, les auteurs rajouent que “plus une erreur est détectée et corrigée tôt dans le processus et moins cela coûte cher”. Le rôle du web designer permet ainsi de gagner du temps, de limiter les risques d’echec et d’accompagner le client tout au long de son projet. En ce sens, c’est le web designer qui imagine et “dessine” le site, son originalité et sa créativité sont primordiales pour le site en lui-même. Toutes ces étapes de conception ne sont donc pas réalisables dans l’agence Business Casanova soutenant que cela n’est pas nécessaire pour réaliser un site et que c’est une perte de temps et donc d’argent. Cependant, un contre-exemple est venu prouver que ces étapes de maquettage sont importantes : le web developpeur a malencontreusement supprimé le site internet The Dog Company alors que ce dernier était terminé. Il était impossible pour lui récupérer la dernière version du site, seul le menu était encore accessible. Résultat, il a fallu tout refaire et sans l’aide des maquettes précédemment construites cela aurait donc doublé, voire triplé le temps de travail de la refonte du site. A nouveau, ils jugeaient que cela n’était pas un argument suffisant et valable pour les convaincre que le métier de web développeur est bénéfique. La satisfaction du client est primordiale tout au long du processus mais il faut avant tout séduire le futur internaute qui devra accéder le plus rapidemment possible à sa recherche tout en le captivant à travers le design. En somme, il faut l’inciter, l’entraîner et l’inclure dans son parcours. C. Le design persuasif, une clef pour séduire et satisfaire ? Une des tâches du web designer consigne à intégrer l’usager futur au site internet qui sera créé. Pour considérer cet internaute, le persuasive design consiste à influencer son                                                                                                                 20  Penser le webdesign, modèle sémiotiques pour les projets multimédias, N.Pignier – B.Drouillat  
  • 24.   24   comportement de sorte à ce qu’il adopte la position attendue et qui ressort du dispositif. Nous le disions précédemment, il faut mettre l’accent sur la rapidité et la simplicité mais en plus de cela il faut miser sur l’intégration de l’usager actif. Loin d’être passif, ce dernier doit être acteur de ses décisions et pour parfaire cela, il faut que le web designer réussisse à susciter l’émotion à travers sa conception. Le mot clef de cette partie est donc “incitation”, il faut réussir à engager l’usager et faire qu’en un seul clic il s’inscrive à la newsletter par exemple, qu’il remplisse un questionnaire de satisfaction etc. Evidemment, il faut que cet acte d’engagement lui soit bénéfique et sur un site de vente cela peut passer par un code promotionnel à l’aide d’une pop-up21 . Le simple fait que l’internaute s’inscrive à la newsletter pour recevoir une réduction sur sa commande l’engage et le conforte dans son acte d’achat. Cet effet de persuasion passe avant tout par la personnalisation de l’interface afin que cette dernière soit attractive mais surtout crédible pour rendre compte des valeurs du client et de la marque. Au même titre que des techniques marketing, comme l’amorçage ou le pied-dans-la-porte22 par exemple, pour faire adhérer le client au concept, un site internet se doit d’être, dans sa conception, persuasif. Fogg, en 2003, définissait le persuasive design comme étant “une métode de conception des systèmes interactifs qui a pour objectif de mettre en oeuvre, au sein d’une interface, des éléments qui incitent les utilisateurs à changer leurs attitudes ou leurs comportements”. En outre, il faut qu’il ait le sentiment d’être actif, que son acte lui apportera quelque chose mais, à l’inverse, que cela ait aussi un feedback positif pour le site et le client. Pour aller plus loin dans cette approche, Nemery, Brangier et Kopp, en 2010, ont élaboré huit critères de persuasion qu’un web designer peut considérer pour l’interface : -­‐ Crédibilité : l’interface se doit de rassurer l’internaute et de réfléter une certaine confiance. Comme exemple, les auteurs citent “Présenter des informations mises à jour régulièrement”. -­‐ Privacité : veiller au respect des données personnelles en termes de confidentialité. Nous pouvons illustrer cela avec le code 3D secure par exemple.                                                                                                                 21 Annexe 6 (provenant du site Sarenza.com) 22 Psychologie du consommateur – pour mieux comprendre comment on vous influence, N.Guégen.  
  • 25.   25   -­‐ Personnalisation : phase qui consiste à séduire l’internaute en l’intégrant dans le message. Le simple fait, lors de la connexion de l’internaute à son compte client, de dire “bonjour X” le conforte dans cet effet de personnalisation. -­‐ Attractivité : l’interface doit capter et attirer l’attention de l’usager. Les pop-up illustrent parfaitement cela. -­‐ Sollicitation : pour cela il faut intégrer le lecteur au contenu du dispositif, Amazon est un des pionnier en suggérant et en recommandant des articles suivant les précédentes recherches et goûts de l’internaute (en référence aux cookies principalement qui sont fortement utilisés aujourd’hui pour recueillir des données de façon légale des internautes afin de faire du ciblage). -­‐ Accompagnement : il faut guider l’usager, lui donner des codes qu’il assimilera. -­‐ Engagement : le web designer se doit, dans la conception, d’impliquer l’utilisateur en décidant de partager le contenu sur les réseaux sociaux par exemple. -­‐ Empire : il faut, en plus de capter l’attention de l’usager, l’influencer en insérant par exemple un temps limite des articles gardés dans le panier. Sachant qu’il y aura un délai, l’internaute sera plus à même de passer sa commande. Ces huit mots-clefs sont déterminants pour rendre le dispositif le plus persuasif possible et afin que le but premier du site soit réalisé (qu’il s’agit de la vente ou de la simple recherche d’information). Le fait que l’internaute participe au contenu le sent “privilégier” et, dans un sens, flaté. L’agence de communication Business Casanova, utilise cela pour montrer la satisfaction de leurs clients envers les prospects23 qui, de ce fait, seront rassurés par ces précédents avis. Cela est intéressant pour l’agence en elle-même puisqu’elle revendique sa qualité et sa bonne image, mais c’est également enrichissant pour le prospect qui aura acquis une certaine confiance envers eux. Cet exemple de design persuasive a donc pour conséquence d’influencer les comportements des utilisateurs. Ce système de “récompense” est réciproque puisque cela profite à la fois à la marque, à l’entreprise et au client, voire au prospect. Veiller à la confiance et l’intégration de l’internaute à travers du contenu dynamique et des incitations forte à la participation sont des mesures qu’il faut penser avant la construction du site internet afin de cerner les besoins des clients selon la visée du site internet. Ce sont des                                                                                                                 23 Annexe 7
  • 26.   26   options qui ne sont pas proposées directement par les templates, le web développeur devra donc avoir recours à des extensions pour personnaliser cette interface. 2. Les atouts et les limites de l’usage des templates. A. De la fiche de style à Wix en passant par Wordpress, quel sens ? Du web 1.0 au web 2.0 il y a eu énormément d’évolution qui ont touché la construction des sites pour répondre aux besoins des clients. Entre 1991 et 1999 les sites web se focalisaient sur les sites “vitrine” en présentant les produits, en donnant des informations. Ces versions étaient uniquement dédiées aux écrans des ordinateurs et les contenus publiés étaient uniquement réalisables par des professionnels ayant les compétences nécessaire en HTML, XML Java et Javascript pour, au mieux, créer des liens hypertextes et des contenus multimédias en ligne. Du côté de l’internaute, ce dernier était passif à ce moment, il n’avait aucun pouvoir sur le contenu. C’est après les années 2000, et principalement dès 2005, que l’usager a été pris en considération au sein du web participatif. Ce faisant, la liberté d’expression s’est développée notamment grâce aux blogs, aux forums et aux réseaux sociaux. La notion de “partage” est donc primordiale et cela a été pris en compte dans la construction des nouveaux sites internet qui, comme nous le disions dans la précédente partie, intègrent l’usager aux contenus avec du dynamisme, du modernisme et du partage. L’internaute devient alors consommacteur : il communique, partage, transforme et il est ainsi déterminant pour l’avenir des entreprises qui choisissent d’avoir un site internet en guise de communication. Le web 1.0, et plus précisemment en 1996, a fait naitre les fameuses feuilles de style dans les documents HTML, appelées CSS, permettant ainsi de donner une mise en forme au contenu en le rendant plus personnalisable et donc plus attractif. Lié au langage HTML qui se compose uniquement de texte, de balises mais aussi d’attributs afin de donner des instructions au navigateur, le CSS vient apporter des fonctionnalités de personnalisation au texte auquel il est lié. Le langage HTML et le CSS ont évolué des dernières années en allant de la simple page blanche composée de carrés gris à des contenus dynamiques les plus orginaux. Cependant, pour réaliser un site en HTML et CSS il est important d’avoir des qualifications puisque cela nécessite des compétences en terme d’adaptation (pour les version mobiles, tablettes mais aussi pour que le site soit visualisable sur tous les moteurs de recherche), mais également en terme de création et réalisation. Autrement dit, une personne lambda n’ayant qu’une simple connaissance et expérience avec le web ne sera pas à même de
  • 27.   27   construire son propre site web avec toutes les normes qui sont liées, un professionnel en communication web, tel qu’un web développeur avec l’aide d’un web designer, aura les compétences pour développer cela, de même pour la maintenance de ce dernier. Ce n’est pourtant parce que ce mode de création est le pionnier pour les sites internet qu’il est délaissé pour autant dans notre ère contemporaine. Au contraire, cette façon de réaliser une page web reste toujours d’actualité puisque ce langage favorise l’originalité et la liberté de création. Face à cela nous retrouvons les CMS - ou SGC - qui constituent des logiciels et plateformes destinés à la création de pages web tout en ne nécessitant pas autant de compétences techniques en terme de développement pour créer son site web. Autrement dit, ils permettent de créer facilement et rapidement du contenu à l’aide d’une interface déjà conçue, ainsi, le back office et le front office sont faciles d’accès et les mises à jour ne nécessitent pas autant de compétences que le langage HTML-CSS. La différence se joue au niveau de la publication des contenus, via un CMS la mise en jour des contenus (images, textes, vidéos) se fait indépendamment de la structure. Concernant cette dernière, elle facilite également le travail du web développeur puisqu’il existe des thèmes prédéfinis et donc près à l’emploi dès le téléchargement effectué. Le plus célèbre et le plus utilisé aujourd’hui est Wordpress, c’est celui-ci qu’à choisi Business Casanova pour confectionner leurs sites internet des clients. Que ce soit pour un site vitrine24 ou pour un e-commerce25 (avec l’extension Woo commerce), l’agence n’a recours qu’au CMS Wordpress pour réaliser un site “rapidemment, efficacement et à moindre coût”. Pour ces sites, ils utilisent les thèmes Divi et Modern Interior auxquels ils rajoutent les plug-in nécessaires au bon fonctionnement des sites internet. Utiliser Wordpress est un réel avantage pour eux en terme de rapidité et de coût. L’installation du thème nécessite que quelques secondes et il en va de même pour les extensions suivant la visée du site. Quant aux contenus, ils ne mettent en ligne que le minimum demandé par le client. C’est ce dernier qui devra mettre en ligne son propre contenu avec une rapide formation du wordpress (back office) : ajout de texte, d’une image, d’un article, d’un code promotionnel etc. L’usage principal du thème Divi est, pour eux, le meilleur thème Wordpress puisqu’il est simple d’utilisation, pour eux et leurs clients. Sa construction et organisation ne nécessitent donc pas le besoin d’avoir un web designer puisque la structure est extrêmement maniable. Prônant ainsi la rapidité, nous remarquons une certaine standardisation de leurs créations, chaque site est construit de la même façon avec un design très similaire. Là serait donc tout l’avantage                                                                                                                 24 Annexe 8 : exemple d’une référence Business Casanova, site vitrine www.rmavocats.lu 25 Annexe 9 : exemple d’une référence Business Casanova, e-commerce www.textinova.com  
  • 28.   28   d’avoir un web designer pour ajouter de l’originalité, de l’innovation et de la créativité à la structure. Au delà du langage HTML-CSS et les CMS, il existe Wix qui est une plateforme en ligne sous la forme “WYSIWYG” – What You See Is What You Get -. Cette technologie a fortement évolué depuis ses derniers mois grâce à son fonctionnement intuitif, sa facilité de création et ses nombreuses possibilités de personnalisation. Plus simple que Wordpress, Wix ne nécessite aucune connaissance en programmation. Des modèles de page préfaits existent et sont mis à la disposition des utilisateurs mais Wix propose également la fonction “page blanche” où l’usager laisse libre cours à son imagination et, ce faisant, se crée un site sur mesure. Malgré tout, cet usage reste critiqué et néfaste pour les professionnels de la communication dans la mesure où cette revendication de la facilité d’utilisation et de création d’un site internet via la plateforme Wix remet en cause le métier du web développeur et d’une agence de communication/web. En suivant cette logique, un internaute lambda serait à même de créer son propre site web sans avoir recours à une agence de communication mais il en est tout autre. Il y a certaines normes web que cet usager ne maitrisera pas. De la sorte, son site internet n’aura pas l’impact escompté et les professionnels, tels que les web designers dans ce cas, seront aptes à parfaire cela : penser la navigation, la structure, le design et l’ergonomie qu’un simple internaute ne maitrisera pas. De plus, posséder un site internet ne suffit pas comme simple présence numérique, autour de cela gravitent les réseaux sociaux, la communication non numérique (les flyers, les cartes de visites etc.), le référencement que seuls les professionnels de la communication maitrisent pour que l’impact soit au plus proche des espérances souhaitées. L’évolution, l’expansion et la facilité de création d’un site internet sont aujourd’hui remarquables. Les compétences techniques ne sont visiblement plus primordiales pour créer un site internet où les templates sont maitres. Mais cet usage redondant des thèmes wordpress et donc des layouts prédéfinis ne conduisent-ils par vers une standardisation des sites internet ? B. Vers une standardisation des sites ? Par “standardisation” nous entendrons un site internet dont la structure, la construction, la navigation et le design ne diffèrent que de très peu. En outre, ce seront des sites web courants, habituels, avec une originalité peu développée et ayant des similitudes
  • 29.   29   fortes. Il ne faut donc pas faire l’amalgame dans le sens où la standardisation consiste simplement à respecter les normes prévues pour créer les sites. D’après l’expérience que nous avons avec internet nous remarquons que ceux-ci possèdent de nombreuses ressemblances et points communs notamment au niveau de l’organisation de la page d’accueil contemporaine (des images en plein écran, des diaporamas, la bannière etc.), des typographies similaires, la disposition du panier pour un e-commerce, l’onglet recherche etc. Cette structuration repose sur un fait simple : ne pas perturber la lecture, la navigation de l’internaute et donc l’envie de ne pas perturber ses représentations mentales comme nous l’avions vu précédemment. Cependant, cette standardisation se reflète également au niveau du design qui ne renvoie que très peu d’originalité. Nous sommes conscients que le nombre de sites internet a explosé et que beaucoup d’entreprises possèdent leur propre site internet mais au sein de la concurrence il faut savoir se démarquer et donc ne pas miser sur cet effet de standardisation. Cette homogénéisation des pages web est la probable conséquence de l’usage des templates qui facilitent le travail des agences de communication au niveau de la rapidité et de la simplicité. Avoir recours aux mêmes modèles de page pour des sites à même visée – entendons ici les sites vitrines par exemple – renforce cette uniformité où l’aspect ne diffère que très peu : la police d’écriture et les couleurs principalement. L’agence Business Casanova qui n’emploie que le CMS Wordpress et le thème Divi (et plus ancien Modern Interior) pour satisfaire leurs clients prône cette similarité entre toutes leurs créations mais se justifie sur le fait que c’est uniquement pour répondre aux besoins exprimés par leurs clients. L’agence évoque également que cette rapidité et immédiateté d’avoir ce produit ne peut que se traduire par un site simple et sans originalité ou innovation apparentes. Pour illustrer cela nous pouvons simplement comparer deux sites conçus par cette agence : www.frisingdecoration.com26 et www.hortos.lu27 . Les similitudes sont frappantes : les couleurs diffèrent que de très peu (tons beiges) il en va de même avec l’organisation des pages (principalement de la page d’accueil : le logo à gauche, le menu à droite, l’image de présentation et le footer avec les réseaux sociaux et coordonnées de Business Casanova) et la composition du menu où nous retrouvons des synonymes. L’agence revendique ce rythme de création et se justifie par le fait que le temps est important pour satisfaire le client, à nouveau, la rapidité rime avec produit standardisé. Cette façon de faire serait donc en totale cohésion avec “l’impatience” qu’exprimeraient leurs clients. Ainsi, en                                                                                                                 26  Annexe  10   27  Annexe  11  
  • 30.   30   réalisant un site internet en trois jours (comprennant le 1er contact avec le client, la création des contenus et la mise en ligne du site) l’agence répond à la demande exaucée par le client qui souhaite avoir son produit opérationnel rapidement. Un autre point propre aux valeurs de cette agence est notable, lors du premier rendez- vous avec le client il lui ait demandé quelles sont ses attentes et s’il a déjà des idées en terme de design et d’organisation du site. Le commercial propose alors d’analyser ce qui existe déjà sur le marché de son client et réalise ainsi une étude benchmarking rapide. En visualisant les leaders, le client choisit le site internet qu’il juge être le mieux et celui sur lequel il souhaite que le web développeur se base pour le design et l’organisation. Chez Business Casanova, le benchmarking consite alors à s’inspirer, à imiter le concurrent. Lors de mon stage j’ai constaté cela avec le client www.tommysbox.lu pour lequel j’ai réalisé les photographies qui seront présentes sur le site. Le principe est simple : imiter les contenus du site www.pandaexpress.com qui est leur principal concurrent et leader. À la demande de mon maitre de stage et de la cliente j’ai donc tenté de repoduire au mieux le style de photographies des concurrents. Cela va au delà de la simple image de présentation, les codes graphiques sont très similaires et l’appellation du menu ne diffère que très peu (des mises à jour ont cependant été faites depuis, le site n’est à ce jour pas encore terminé). Ce besoin de répondre au client en réalisant un site internet dans un temps retreint ne peut pas rimer avec exclusivité : le web développeur grâce à son expérience avec le thème utilisé sur le CMS va réaliser une certaine redondance dans la construction. Cette répétition pourrait être évitée grâce au travail fournit par le web designer qui est pourvu d’originalité pour justement concevoir cette différence entre les sites internet. Cependant, le travail du web designer exige quelques heures de travail qui varient selon le projet et certaines agences, telle que Business Casanova, estiment que c’est du temps perdu et que le web développeur peut englober cette tâche dans son travail. Or, web designer et web développeur sont des métiers qui se complètent parfaitement : le web développeur applique le travail de son collègue du côté technique et c’est du temps gagné dans sa propre tâche puisque cela demanderait moins de réfléxion comme le travail en amont (les étapes de maquettages) aurait été effectué par le web designer. Ces étapes de création ne sont donc pas néfastes pour une agence, bien au contraire, le web designer grâce à ses compétences et son inventivité redorerait l’image de celle-ci grâce à des sites uniques et créatifs. C’est donc son travail qui participe à ne pas standardiser les sites internet : une navigation et un concept original. Du côté du benchmarking, cela reste une étape fondamentale dans la conception d’un site internet puisqu’il s’agit d’analyser le marché, de cerner les erreurs des concurrents afin de ne pas les
  • 31.   31   reproduire par exemple. Cependant, trop se rapprocher du modèle de celui-ci peut s’avérer être “déloyal” et, à nouveau, le travail du web designer consiste à innover, à se rapprocher de la demande en apportant sa touche personnelle et sans s’inspirer profondément des contenus déjà existants. S’inspirer des adversaires et avoir recours à des gabarits de page renforce cette standardisation des internet. La créativité et l’innovation ne sont donc pas privilégié pour répondre à ce besoin de rapide de mise en fonction du site internet. Parfois, c’est ce manque de temps qui réduit l’agence à proposer des sites internet minimalistes et très similaires aux concurrents pour répondre tout simplement à l’envie des clients. C. Avant tout une envie des clients : une logique d’adaptation. Nous l’évoquions succinctement précédemment, le client est un acteur décisif au sein du projet. De fait, c’est premièrement celui qui apporte le projet à l’agence et qui paiera celle-ci. Dans un second temps, c’est celui qui sera le juge du travail fait : respect du cahier des charges, des délais, des envies etc. C’est le décisionnaire et celui qu’il faudra convaincre tout au long de la conception : du premier rendez-vous qui conclut l’achat jusqu’à la mise en ligne sur le serveur du site opérationnel. C’est seul ou avec l’aide du chef de projet que sera établi le cahier des charges utile pour l’ensemble de l’équipe d’une agence : les délais, le budget, les envies exprimées etc. Des étapes de validation sont mises au point afin que le client confirme ou non le travail déjà opéré, auquel cas les métiers engagés pourront apporter des modifications si besoin est. Dans l’élaboration d’un site internet, le client pourra donc prendre soin de valider, ou non, les différentes étapes de maquettage (en partant de l’arborescence jusqu’à la maquette graphique) et cela s’avèrera être un gain de temps pour l’entreprise. Il est bien plus simple de modifier un document Illustrator ou Photoshop qu’une feuille de style ou la structure d’un template. Ces étapes servent également de support de visualisation où le client pourra donner son avis et discuter de certains points avec les professionnels. Disposer de tels visuels le met en situation et l’aide à se projetter sans pour autant que les modifications apportées ait un quelconque impact sur la réalité. L’ensemble de l’équipe doit alors prendre en considération le cahier des charges et effectuer des réunions dites de validation pour que le travail gravit des échelons. Chez Business Casanova le cahier des charges n’est constitué et restitué aux équipiers qu’oralement sans qu’il y ait des étapes de validation déterminées. Ce n’est qu’une fois le produit terminé que le client aura une idée du projet puisqu’il sera achevé.
  • 32.   32   Dans cette façon de faire il y aura quasiment toujours des modifications à établir sur le projet, ici un site internet, et donc du temps de perdu. Le but de toute conception est donc de séduire le client afin qu’il valide cela, ainsi, il ne faut pas le négliger. Cependant, dans la plupart des cas, le client est novice dans le domaine du numérique et plus particulièrement des sites internet puisqu’il ne dispose que d’une expérience et approche partielle avec ce monde. Parfois exigeant, parfois compréhensif, il faut tout de même répondre à sa demande tout en étant raisonnable et en proposant des choses cohérentes et faisables avec le web en veillant au respect du budget et du délai. Cette relation client est également importante sur le long terme pour une agence de communication puisque chaque projet réalisé constituera des bases solides pour compléter les références de l’agence. De ce fait, le client contribue au développement de l’entreprise en terme d’image, d’éfficacité et de confiance. Pour contribuer à cette image valorisante les agences de communication telle que Business Casanova proposent d’assurer un suivi lorsque le produit est terminé, cela comprend la création des réseaux sociaux (et des contenus publiés sur ceux-ci), des campagnes e-mailing, des mises à jour au niveau des photographies, Google Adsense28 et Google Adwords29 . Apporter ce suivi en guise de “service après vente” maintient ce contact avec le client qui, rappelons le, est, dans la plupart des cas, novice et ne maitrise pas ces outils. Proposant également des formations pour que le client puisse mettre le minimum de contenu à jour sur sa page, cela contribue à renforcer l’image de l’entreprise et à maintenir le contact avec les clients. Etant toujours à disposition des clients si un éventuel problème venait à arriver, Business Casanova rempli donc son contrat : être présent en cas de problème. Le maintien de ce lien et de cette confiance avec les clients est primordial pour une agence de communication/web. Cela fonctionne évidemment dans les deux sens : pour le client qui est conforté dans son choix de l’agence pour créer sa communication numérique et pour l’agence en elle-même en terme de notoriété principalement mais aussi concernant le chiffre d’affaire et les relations.                                                                                                                 28 Google Adsense : “programme de monétisation proposé par Google aux éditeurs de sites web pour générer des revenus publicitaires à la performance.” – www.definitions- marketing.com 29 Google Adwords : “propose aux annonceurs la diffusion d’annonces liées aux mots clés utilisés dans les requêtes.” – www.definitions-marketing.com  
  • 33.   33   Conclusion. Notre époque contemporaine met à disposition de nombreux outils pour faciliter le travail et réaliser les souhaits exprimés pour les agences de communication/web, pour les clients et également pour les internautes lambda. Cette diversité d’outils permet de développer un site internet rapidemment et accessible techniquement par tous. Malgré tout, certaines normes sont à respecter pour veiller au mieux à la navigation des internautes et c’est ce à quoi doit veiller un web designer. Cette multitude de sites internet risque de créer un flux incalculable de contenus accessibles par tous, c’est là toute la problématique du numérique aujourd’hui. Il faut satisfaire le client et le positionner au mieux sur le marché du web afin qu’il se démarque de ses concurrents et que son site internet soit bénéfique pour sa marque. Innover est un mot clef dont doit tenir compte le web designer lors de la conception des graphiques du site internet, l’originalité et la créativité sont également maître pour créer un impact sur la toile et satisfaire le client, mais avant tout, les internautes en quête d’informations. Ce risque de tomber dans la banalisation des contenus et du design est néfaste pour les clients mais aussi pour les agences en terme de notoriété et d’image. La finalité du site internet pour un client est de lui apporter une visibilité et susciter des ventes, si ce n’est pas le cas, la conception n’aura pas l’effet escompté et l’agence de communication n’aura pas totalement rempli sa mission. Un point essentiel pour éviter cette redondance consiste en l’originalité incluant une navigation, un design et une organisation qui sortent de l’ordinaire tout en restant simple afin de ne pas perturber l’internaute. De façon plus précise et personnelle, ce stage a débuté sur un mal entendu. Mon maitre de stage ne connaissait pas directement le métier et donc les tâches du web designer, pourtant cela était clairement noté sur le titre de mon curriculum vitae. Pour l’agence Business Casanova, le web design était synonyme de graphisme. Bien évidemment le web design englobe quelques notions de graphisme mais cela ne doit pas être sa mission principale. Je me suis vue refuser certaines tâches jugeant que cela n’était pas néccesaire (cf : la conception du site www.thedogcompany.lu pour lequel je n’ai pas pu terminer toutes les maquettes notamment versions mobiles et tablettes et quelques pages pour la version desktop). Comme il s’agissait d’une petite structure, la polyvalence était donc à prévoir et c’est pourquoi j’ai donc pu bénéficier de l’apprentissage d’autres notions qui n’étaient pas convenues lors de mon entretien : community management, photographie, newsletters etc.
  • 34.   34   Cela était un réel point positif puisque j’ai acquéri une expérience et pu développer des compétences à ces différents niveaux. Pour rappel, l’entreprise d’accueil prône la rapidité et les sites internet simples pour satisfaire leurs clients. L’étape de web design n’est donc, selon eux, pas nécessaire pour concevoir un site internet selon les souhaits du client. Grâce à mon expérience, mes envies de créativité et d’originalité dans la communication en générale ainsi que les cours reçus tout au long de ma scolarité à la faculté j’étais donc en mesure de traiter le sujet de mon mémoire de stage “Penser l’ergonomie et l’expérience utilisateur d’un site internet : l’art du web designer”. Mon point de vue sur la communication vient également approfondir cela puisque je suis convaincue que pour se démarquer aujourd’hui il faut faire preuve d’originalité qu’il s’agisse d’une simple présence sur le web pour présenter son entreprise ou bien encore pour vendre des produits sur un e-commerce. Mon travail de mémoire portera justement sur ce point qu’est l’originalité à travers la communication avec la définition de l’originalité en elle- même, certaines pratiques utilisées par des agences créatives puis les impacts que ces campagnes ont sur le comportement des individus. Ce projet a été accentué lors de mon précédent stage en licence 3 chez Mescudi dont les valeurs sont les suivantes : créativité, originalité et innovation. Les idées les plus folles sont tentées par cette agence dynamique qui part du principe qu’il faut oser pour se démarquer aujourd’hui dans la communication et la publicité de façon générale. Concernant les compétences développées au sein de mes deux stages, je dirai que celles-ci ont été complémentaires du point de vue du métier envisagé après mon master. Comme mentionné dans la première partie de ce rapport, je souhaite devenir chef de projet spécialisé web designer et, à ce jour, je n’ai encore pas eu de réelle expérience et acquis en tant que chef de projet junior par exemple. Je n’ai été qu’actrice lors de mon stage chez Mescudi en assistant aux réunions avec les clients et en observant le rôle de mon maître de stage qui était chef de projet et à la fois graphiste et web développeur selon les projets proposés. A nouveau, la polyvalence régnait et au sein d’une petite structure je suis persuadée que l’entraide et l’écoute peuvent mener à bien un projet où chacun fait part de son avis pour agrémenter le produit final (que ce soit un flyer ou un site internet par exemple). Ma mission principale chez Mescudi consistait à être graphiste (création de l’identité de l’entreprise principalement), quant à chez Business Casanova j’ai été d’autant plus polyvalente puisque community manager, photographe et web développeur. Ce sont ses divers acquis et notions maitrisées qui renforce mon envie de devenir chef de projet spécialisé web designer au sein d’une petite structure où le travail fournit par chacun participera à la satisfaction du client.
  • 35.   35   En master 2, ma recherche de stage sera donc plus orientée vers des agences de communication/web créative qui nécessitent et prendront en compte le travail d’un web designer dans lesquelles je serai susceptible d’envisager mon avenir professionnel. Malgré tout, je suis ouverte et être polyvalente sera un avantage au sein du travail en équipe et je serai donc ouverte à toute proposition concernant un rôle dans une agence de communication/web.
  • 36.   36   Références. Ouvrages Guégen N., 2011, Psychologie du consommateur pour mieux comprendre comment on vous influence, Paris, Éd. Dunod. Lallemand C., Gronier G., 2015, Méthodes de design UX. 30 méthodes fondamentales pour concevoir et évaluer les systèmes interactifs, Paris, Éd. Eyrolles. Pignier N., Drouillat B., 2004, Penser le web design. Modèles sémiotiques pour les projets multimédias, Paris, Éd. L’Harmattan. Articles scientifiques Chevalier A., et al, 2009, « Entre contraintes ergonomiques, créativité et esthétique : rôle d’un système à la base de connaissances sur l’activité des concepteurs web », Le travail humain, 72. Peraya D., 2012, « Quel impact les technologies ont-elles sur la production et la diffusion des connaissances ? », Question de communication, 21, pp. 89-106. Mémoire de recherche Bourazza M., 2015, L’influence du minimalisme graphique dans le webdesign sur l’expérience utilisateur, Mémoire en information et communication, Université de Lorraine.
  • 37.   37   Remerciements. Premièrement je tiens à remercier l’agence Business Casanova pour m’avoir accueillie pendant deux mois et qui a dû faire face à certains aménagements pour moi. Plus particulièrement je remercie Rudolphe Aben et Emilien Jourdan pour le temps qu’ils m’ont consacré et les missions qu’ils m’ont confié en toute confiance. Je remercie notamment les clients de Business Casanova pour leur gentilesse, leurs compliments, leurs projets et leur confiance envers moi. En particulier je remercie Neves Barros (du site www.textinova.com) pour sa patience et les différentes missions qu’elle m’a confié pour que je mêne à bien mon stage et développe certaines compétences : graphisme, réseaux sociaux et newsletter. J’adresse mes remerciements à monsieur Luc Massou et Pierre Morelli pour leur aide et le temps qu’ils m’ont consacré avant et pendant le stage pour parfaire ce mémoire de stage notamment des pistes de lecture, des validations et reformulations des certains contenus. Je remercie aussi Sébastien Albert pour sa patience concernant la validation et la recherche de stage mais aussi pour le temps consacré à joindre mon maitre de stage pour éclaircir certains points. De façon plus générale je remercie l’ensemble de mes professeurs et intervenants qui m’ont transmis leurs savoirs pendant ces trois années de lience et cette première année de master. Je remercie Olivier Beining, du cour de Web Design, pour son apport et sa découverte du métier de web designer, sans lui je ne pense pas que j’aurais orienté ce rapport de stage problématisé sur ce sujet. Pour résumer et terminer ces quatre années d’études, j’espère vivement intégrer la dernière année de master et être diplomée de l’Université de Lorraine en vu de poursuivre mon projet en tant que future chef de projet spécialisé web designer.
  • 38.   38   Annexes. Annexe 1 : site version desktop www.thebestkey.com Annexe 1 bis: site version mobile www.thebestkey.com
  • 39.   39   Annexe 2 : arborescence www.thedogcompany.lu Annexe 3 : Zonings www.thedogcompany.lu Zoning  1  page  d'accueil Zoning  2  page  "toilettage  &  tarifs"
  • 40.   40   Zoning  4  page  "les  promenades" Zoning  3  page  "boutique" Zoning  5  page  "contact"
  • 41.   41   Annexe 4 : Wireframes www.thedogcompany.lu   Wireframe  1  page  d'accueil  
  • 42.   42     Wireframe  2  page  "toilettage  &  tarifs"
  • 43.   43     Wireframe  3  page  "les  promenades"
  • 44.   44     Wireframe  4  page  "boutique"
  • 45.   45     Wireframe  5  page  "contact"
  • 46.   46   Annexe 4 : Maquette graphique www.thedogcompany.lu   Maquette  graphique  1  page  d'accueil
  • 47.   47   Annexe 6 : Pop-up site www.sarenza.com Annexe 7 : Testimonials du site www.business-casanova.com
  • 48.   48   Annexe 8 : site vitrine www.rmavocats.lu Annexe 9 : e-commerce www.textinova.lu
  • 49.   49   Annexe 10 : www.frisingdecoration.com Annexe 11: www.hortos.lu
  • 50.   50   Nom de l’étudiant : Camille  Perazzi   camille.perazzi@hotmail.fr     Titre  du  rapport  :   Penser l’ergonomie & l’expérience utilisateur d’un site internet : l’art du web designer.   Coordonnées  complètes  de  l’entreprise  :   Business  Casanova   17,  rue  de  Mondorf   L-­‐2159  Bonnevoie   LUXEMBOURG   tél.  00352  27  86  04  07   fax  00352  24  61  12  78   www.business-­‐casanova.com     Secteur  d’activité  de  l’entreprise  :   Communication  numérique     Nom,  fonction  et  coordonnées  du  tuteur  professionnel  :   Rudolphe  Aben,  directeur  d’agence  et  commercial   Tél.  00352  69  12  00  452   rudolphe@business-­‐casanova.com     Tuteur  universitaire  :   Nom  :  Sébasten  Albert   Mail  :  sebastien.albert@univ-­‐lorraine.fr       Type  de  fonction  exercée  dans  l’entreprise  :   Photographe,  community  manager,  web  développeur.     Activité  principale  réalisée    durant  le  stage  :  (10  lignes  maxi)   Réalisation  de  photographies  destinées  à  enrichir  les  sites  internet.  Créations  et  refonte   d’un  site  internet  pour  un  toiletteur  Luxembourgeois.  Animation  des  réseaux  sociaux   des  clients  de  l’agence  +  créations  de  visuels  pour  des  concours.     Métier  visé  :   Chef  de  projet  spécialisé  web  designer.     Durée  du  stage  :  2  mois     Date  de  stage  :  du  04.04.2016      au  01.06.2016     Note  obtenue  :  /