61
Advise Communication M. Pascal THOYER MÉMOIRE D’ENTREPRISE Nishantha THAVARAJAH Université Cergy-Pontoise Licence professionnelle Infographie Année 2014 - 2015

MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

Advise CommunicationM. Pascal THOYER

MÉMOIRE D’ENTREPRISENishantha THAVARAJAH

Université Cergy-PontoiseLicence professionnelle InfographieAnnée 2014 - 2015

Page 2: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

2

Pascal THOYER, GérantAdvise Communication

Les Bureaux des Trois FontainesBP 1025 - 95003 - Cergy

THAVARAJAH NISHANTHAÉtudiante en licence professionnelle Infographie

5 Place de Flandre95300 PONTOISE

Page 3: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

3

SOMMAIREINTRODUCTION........................................................................................................................................................................................................................................41- Advise Communication : Une agence web depuis 15 ans.....................................................................................................................................6 1-1. Présentation de l’entreprise...........................................................................................................................................................................................6 A) Présentation de l’équipe................................................................................................................................................................................6 B) Les services proposés par Advise.......................................................................................................................................................6 1-2. Son identité visuelle............................................................................................................................................................................................................8 1-3. Les compétences d’Advise – ses réalisations........................................................................................................................................10 A) Les réalisations d’Advise............................................................................................................................................................................10 B) Capacités techniques - Advise Communication............................................................................................................12 1-4. Et la concurrence d’Advise ?.................................................................................................................................................................................12 A) Le monde numérique attire.....................................................................................................................................................................12 B) Principaux concurrents à Cergy : agence web................................................................................................................13

2 - Le rôle de l’infographiste est de savoir s’adapter aux projets................................................................................................................14 2-1. Des compétences variées pour répondre aux projets...............................................................................................................14 A) Internet : une activité technologique en évolution...................................................................................................14 B) Logiciels à savoir utiliser.................................................................................................................................................................................14 C)Unediversificationdestâches............................................................................................................................................................16 2-2. Les missions de l’infographiste au sein de l’entreprise Advise.........................................................................................18 A) Intégration web.................................................................................................................................................................................................18 B) Webdesigner..........................................................................................................................................................................................................20 C) Graphiste....................................................................................................................................................................................................................22 D) À l’assaut des CMS........................................................................................................................................................................................24 E) Montage vidéo..................................................................................................................................................................................................26 F) Et le référencement web ?......................................................................................................................................................................28 2-3. Être toujours curieux : une veille permanente.................................................................................................................................30 A) Les outils qui permettent de rester au courant..............................................................................................................30 B) L’importance de la veille en 2015 .........................................................................................................................................32

3 - Comment le métier d’infographiste a évolué jusqu’à ce jour ?.................................................................................................................33 3-1. L’évolution du métier au cours des années............................................................................................................................................33 A)Avant1980:Unmondeoùl’affiches’exprime.................................................................................................................34 B) 1990 : De l’analogique au numérique......................................................................................................................................36 C) 2000 : Arrivée d’un monde nouveau : les infographistes au devant de la scène.................37 D) En 2015, les données se lisent visuellement.......................................................................................................................38

3-2. Le Web a 25 ans... seulement ?..........................................................................................................................................................................40 A) L’arrivée d’internet – Le Web 1.0...............................................................................................................................................40 B) À la recherche de nouveauté : Web 2.0..............................................................................................................................44 C)LeWeb3.0:Ledéveloppementn’estpasencorefinit...............................................................................................47 D) L’évolution des logiciels de graphisme.....................................................................................................................................48 E) Le web en 10 dates clés...........................................................................................................................................................................49

3-3.Desquestionsd’efficacitéauseind’unepetiteagence.....................................................................................................54 A) Quel sont les différences entre un grand groupe ?..................................................................................................54 B) Petite agence cherche superman.................................................................................................................................................56

CONCLUSION..........................................................................................................................................................................................................................................................58REMERCIEMENTS....................................................................................................................................................................................................................................................59ANNEXES.........................................................................................................................................................................................................................................................................60 1)Définitiondestermestechniques..............................................................................................................................................................................60 2) Références sites............................................................................................................................................................................................................................61

Page 4: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

4

INTRODUCTION

Passionnée depuis toujours par l’univers artistique, j’aime dessiner et créer depuis l’enfance. En me renseignant sur les divers métiers liés à l’art, j’ai été vite attirée par le graphisme. C’est un domaine pas-sionnant que j’aime beaucoup.

J’ai été attirée également par le domaine du web. En effet, créer des sites internet est une passion tout autant que de créer un univers artistique. J’aime surprendre les personnes à travers un style original et simple à la fois.

Je me suis préparée depuis mes deux années de licence en informatique à rentrer en licence profes-sionnelle Infographiste à l’université de Cergy-Pontoise. J’ai appris durant ces années et de façon au-tonome, les logiciels de création graphique comme Photoshop et Illustrator. J’ai alors construit un book et un site internet pour montrer ma motivation à intégrer cette licence.

À la recherche d’un contrat d’apprentissage, j’ai été contactée par l’agence Advise Communication pour effectuer mon alternance. J’ai tout de suite été ravie à l’idée d’intégrer une agence web, d’autant plus qu’il s’agit de la plus ancienne agence du Val d’Oise. Elle dispose de nombreuses références de qualité.Depluslafidélitédesaclientèlemontrequesontravaildonnesatisfaction.

Page 5: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

5

Advise Communication a su s’imposer comme une des plus vieille agence de Cergy-Pontoise. Il s’agit d’une petite agence polyvalente qui permet à de nombreux clients de posséder son site internet et d’avoir un réel impact sur un public. Son atout ? La compréhension du problème de demain : le web est nouveau et en constante évolution. Que ce soit pour vendre ou se faire connaître, un site web est indispensable pour accroître la popularité d’une entreprise et de lui créer de la crédibilité.

Aujourd’hui, est-il possible pour une entreprise de ne pas avoir de site internet? Une présence sur le web est indispensable pour les entrepreneurs d’aujourd’hui, ne serait-ce que pour des raisons de notoriété. C’est pourquoi les compétences d’Advise en terme de création de sites web sont un réel atout pour les entreprises.

Chez Advise, on réalise également des identités visuelles. En effet, un site internet doit s’appuyer sur une identité visuelle. L’entreprise crée aussi bien des applications mobiles que des sites internet très complexes qui demandent beaucoup de travail. Elle utilise par ailleurs beaucoup de technologie pour satisfaire sa clientèle. Experte également dans le domaine du référencement, c’est une entreprise qui est aujourd’hui très polyvalente.

Quand on travaille dans une agence web, on peut être amené à travailler sur plusieurs projets diffé-rents, c’est pourquoi il est important d’avoir plusieurs compétences. En effet il faut avoir des compé-tences à la fois techniques et créatives.

j’ai choisi par conséquent la problématique suivante :

Pourquoi un infographiste doit-il être polyvalent pour travailler chez Advise Communication ?

Très bonne lecture.

Page 6: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

6

1. ADVISE : UNE AGENCE WEB DEPUIS 15 ANS

1-1. Présentation de l’entreprise

A) Présentation de l’équipe

La compagnie ADVISE COMMUNICATION est implantée à Cergy (Les Bureaux des 3 Fontaines) dans le département du Val-d’Oise.

L’agence est composée de 4 personnes :

Pascal Thoyer : le directeur de l’agence Advise Communication et mon tuteur de l’alternance.Julien Pinto : développeur web spécialisé dans la conception de sites internet et d’applications.Laurent EHRHARD : intégrateur web depuis 2000 chez Advise Communication.Catherine MILLET : graphiste en charge de la conception de tous les éléments créatifs (brochures, cartes de visite, etc.)

B) Les services proposés par Advise

Cette agence propose différents services :

1) Création de sites internet statiques et dynamiques

Un client a besoin d’un site internet pour une présentation de ses compétences, de ses produits? Oualorsunsiteinternetpourvendresesproduits?Grâceàl’expertised’Advisedansledomaineduweb,elleest capable de créer n’importe quel site web !

L’agence dispose également d’un savoir-faire et d’une technologie robuste qui permet aux clients de gérer eux-même leurs sites internet.

GRAPHISME INTEGRATION WEB

RÉFÉRENCEMENT

Page 7: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

7

2) Des services de référencement

Advise propose des services de référencement pour accompagner les entreprises de toutes tailles dans leur stratégie de visibilité sur le web. La position sur les moteurs de recherche est une des princi-palessourcesdecréationdetraficsurunsiteweb.Eneffet,ilpermetauxinternautesd’accéderàunsite sans connaître son adresse. Les principaux moteurs de recherche sont capables de détecter les nouveaux documents sur le web (et les nouveaux sites).

Un bon référencement sur le Web est donc essentiel pour avoir un bon site.

3) Création d’applications sur mobile ou tablette et création de logiciels.

Les smartphones et tablettes tactiles sont devenus en quelques années de véritables phénomènes de société. L’agence propose aux entreprises des solutions dédiées à la téléphonie : ergonomie et design d’interfaces, création de sites adaptés aux standards de résolution de l’Internet mobile, déve-loppements sur mesure d’applications et sites Web embarqués. Ces solutions répondent à toutes les contraintes techniques liées aux plateformes mobiles (iOS, Android…).

4) Des services de maintenance, d’hébergement, d’actualisation et d’assistance pour les sites des clients.

Hébergement : Ce service consiste dans l’hébergement* des sites sur des serveurs adaptés aux besoins du client (serveurs mutualisés** ou dédiés***).

Actualisation : Unclientabesoindemodifieruneinformationsurlesite?L’agences’occupedefairelamodificationàlademandeduclient.

Maintenance : S’il y a une nouvelle version d’un framework, par exemple, l’agence procède à la mise à jour des sites concernés.

Assistance : Un client est perdu sur sa plateforme d’administration ? Advise se charge de l’aider pour qu’il se familiarise avec son nouvel environnement

*, **, *** : se référer à l’annexe de la page 60.

Page 8: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

8

1-2. Son identité visuelle

Advise a changé d’identité visuelle au cours des années :Elle a su évoluer et se moderniser. Voici un aperçu de l’évolution de son logo et de son site internet :

Catherine, la graphiste de l’agence, a modernisé l’identité visuelle de la société en 2014.

Une charte graphique trop classique

Lestyledel’ancienlogoétaitassezclassique.Elleavouluaffirmerlasociétégrâceàdesteintespluschaudescomme la couleur orange. De nouveaux codes ont été créés : couleurs orange et gris foncé avec une typo-graphie plus moderne. Elle a créé également des cartes de visite qui respectent la nouvelle charte graphique.

5)...Etunpôlegraphismeetcréationaveclamiseenplacedecatalogues,affiches...

L’agence propose des services de création graphique pour le print, comme la fabrication de cartes de visite,

de catalogues et de magazines d’entreprise pour ses clients.

Elle attache par ailleurs une grande importance à l’ergonomie de ses sites internet. Le visiteur doit pouvoir s’y repérer aisément et accéder sans effort à l’information qui l’intéresse. La facilité d’utilisation du site se joue à bien des niveaux (arborescence, visuels, typographies, clarté des messages d’information, etc.). Tous ces éléments sont donc intégrés au processus de création du site dès ses prémices.

En conclusion Advise Communication est une agence qui répond à la demande d’une clientèle en recherche de visibilité (identité graphique, site internet pour prospecter).

Page 9: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

9

Un site plus actuel

Le site se compose de deux pages. Premièrement une première page d’accueil avec quelques réalisations de l’entreprise. Deuxièment une page contact pour permettre au client de se mettre en relation avec l’agence.

Le site existe depuis 15 ans et ne correspondait plus à la nouvelle charte graphique. L’ancien site avait un style assez neutre (des couleurs ternes : bleu pastel, blanc, gris). Un site bien trop classique.

J’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence. Néanmoins le site Advise risque de changer prochainement pour faire place à une version encore plus moderne. En effet une nouvelle version est en cours, avec de multiples pages et des informations encore plus fournies.

Icônes réalisées dans le cadre de la refonte prochaine du site internet

Page 10: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

10

1-3. Les compétences d’Advise – ses réalisations

A) Les réalisations d’Advise

Advise a travaillé sur de nombreux projets depuis 2000. Création d’identités visuelles, de sites statiques et dynamiques, de sites d’e-commerce, d’intranets et d’extranets : les projets sont aussi divers qu’intéressants. Advise Communication a travaillé, en 15 années d’existence, sur plus de 400 projets pour le compte de 80 clients.

Voici quelques une des références d’Advise :

Sites institutionnels

Depuis 2005, Advise Communication gère (création, admi-nistration, webmastering) le site du Domaine de Chaumont-sur-Loire, qui est des 10 plus importants établissements culturels de France. Le Domaine de Chaumont-sur-Loire gère le châteaudeChaumont (monument historique), leFestival International des Jardins, le Centre Arts et Nature, un important service de formation professionnel, quatre res-taurants, etc. Le site se distingue par son très volumineux contenu (plusieurs milliers de pages, avec plus de 30 Go de données stockées), présenté en 10 langues, dont 3 langues non latines (chinois, japonais et russe).

Intranet

Réalisation d’un intranet pour trois établissements d’ensei-gnements supérieur appartenant à un même groupe (IF-CAE, ICA SUP, KALLIOPE FORMATION IDF). Chaque éta-blissement dispose d’un intranet doté des fonctionnalités suivantes : • profils des utilisateurs (étudiants, entreprises, tuteurs,

DRH, administration, formateurs)• suivi des absences et des retards, avec génération

automatique d’un relevé mensuel• planning de l’établissement, par formation. • bulletins de note des étudiants, par importation des

données depuis un logiciel tiers

www.domaine-chaumont.fr

refonte de site IFCAE - 2014

Page 11: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

11

Application pour iPad

Advise Communication a réalisé une application sous iOS pour la chaîne de restaurants « Les Bars à Huitres ». Réalisée sous licence d’entreprise (donc non accessible par Apple Store), cette application est utilisée comme la carte des restaurants, en substitution des supports papiers. L’applica-tion est en 8 langues et comporte, pour chaque langue, environ 250 pages. Elle est totalement administrable par le client au moyen d’une interface web. Les pages sont constituées de textes, images et vidéos. Cette réalisation, particulièrement spectaculaire, a donné lieu à de nom-breuses présentations dans la Presse.

E-commerce

Advise Communication a réalisé un site internet e-com-merce pour un traiteur : Croque et Toque. Le concept est assez nouveau, puisqu’il s’agit d’un site qui fait de la vente en ligne de produits alimentaires à domicile. De multiples particularités propres aux exigences du client ont rendu impossible l’utilisation d’un CMS de type Prestashop. Ce site e-commerce, totalement administrable, doté de fonc-tionnalités complexes a été intégralement développé en interne. Le design est très tendance et épuré.

Et aussi du print !

Advise Communication est également une agence de création graphique. Elle réalise des magazines d’entreprise, des catalogues, des fichesproduits,etc.AdviseCommunicationpermetàune entreprise d’avoir un lien entre les sites internet et les supports print.

Croque & Toque - 2015

Catalogue Scribe logiciels - 2014

Les Bars à Huitres

Page 12: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

12

B) Capacités techniques - Advise Communication

Intégration Maitrise du html, css, Javascript

Traitement des images et vidéos Maitrise des logiciels Photoshop, Illustrator, Flash, Première

DéveloppementMaitrise du PHP et MySql,Javascript, ajax, node.jsC, C++, CjQuery, Symfony, Doctrine

CMSMaitrise des CMS Joomla, Drupal, WordPress

SEOMaitrise du référencement naturel et payant

E-commerceSolution e-commerce développée interne, distributeur agréé et intégrateur de la solutionOxatis, prestashop etc.

Outils internese-commerce, Framework propriétaire

1-3. Et la concurrence pour Advise ?

A) Le monde numérique attire

Le web est de plus en plus concurrentiel et avoir une présence en ligne est de plus en plus facile. Avec unmarchéquidevientenfinmature,leconcepteurdesitesweb(freelanceouagenceweb)estdoncenpremière ligne. Sur internet, la concurrence est à 1 clic. Le visiteur peut, sans bouger de sa chaise comparer, découvrir les avantages ou contraintes des produits proposés par un site. S’il a un doute sur une enseigne, et si on n’offre pas ce petit plus qui le séduira, il ne nous achètera pas. Et on ne saura jamais vraiment pourquoi.

Page 13: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

13

En 2015,presquetout lemondepeutconstruireunsite internetgrâceàdesCMSgratuits,commewordpress* ou bien d’autres, et en achetant à faible coût des thèmes**. Cela crée de fait une concurrence aux agences web. Il existe de nombreux outils de création de sites gratuits, la création d’un site web s’est donc complètement démocratisée.

La création d’un site web demande des connaissances techniques et un véritable savoir-faire dans l’organisationdel’information.Pourconcevoiretfaireunsitetrèsspécifique,ilvautmieuxfaireappelàune vraie agence de site web comme Advise.

Advise est dans une position favorable, car elle connait son domaine et possède beaucoup d’an-nées d’expertise. Sans cette experience, le créateur isolé d’un site risque de privilégier ses goûts per-sonnels sans réellement répondre aux besoins du client.

Des agences web, il y en a des milliers. Seulement des agences qui durent dans le temps il y en a peu. Effectivementilfautsavoirfidélisersaclientèleetlesatisfaireavanttout.Pourcelailnesuffitpasdecréer le site internet mais de créer toute une stratégie pour que le projet soit réussi. Référencement, graphisme, communication, ergonomie, tous les moyens doivent être mise en place pour qu’un projet soit réellement de qualité.

B) Principaux concurrents à Cergy : agence web

ALTEO Création en 20022 Rue des Chênes Émeraude, 95000 Cergy

SpidexWEB Création en 20055 les touleuses pourpres 95000 Cergy Pontoise

Axenet Création en 200525 Avenue de la Constellation, 95800 Cergy

Pixel CookersCréation en 20091 Mail Gay Lussac, 95015 Cergy Pontoise

*, ** : se référer à l’annexe de la page 60.

Page 14: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

14

2. LE RÔLE DE L’INFOGRAPHISTE EST DE SAVOIR S’ADAPTER AUX PROJETS

2-1. Des compétences variées pour répondre aux projets

A) Internet : une activité technologique en évolution

La création et la gestion de sites internet s’est fortement professionnalisée. Internet a transformé des métiers anciens, mais elle en a surtout créé de nouveaux : webdesigner, chargé de référencement, community mana-ger, pour n’en citer que quelques-uns. Champ en évolution perpétuelle, Internet impose dans ses métiers ses propres valeurs : évolution et polyvalence.

Les objectifs poursuivis par les acteurs du net sont très différents selon les supports sur lesquels ils travaillent : sites institutionnels, sites e-commerce, site de services, réseaux sociaux, blogs.

Ainsi, le community manager, métier tout nouveau, est né du développement des réseaux sociaux. Pour gérer leur image sur tous les types de réseaux, organiser le buzz, les entreprises ont recours à ces professionnels de l’image et de la visibilité. Mais alors que sa fonction n’est pas du tout technique, le responsable de commu-nauté ne peut faire l’économie de solides compétences techniques. C’est le trait général de tous les métiers du web.

Ainsi pour un rédacteur web, chargé de rédiger les contenus des sites, la connaissance du langage de programmation HTML et de ses balises est souhaitable. On imagine mal un chargé de marketing web ignorer les outils techniques de réseaux sur lesquels il doit déployer son art. Quant aux créatifs et autres graphistes du web, si leur créativité est essentielle, ils ne peuvent la mettre en œuvre sans une parfaite connaissance technique des logiciels de pointe, et de langages informatiques.

L’activité du web a atteint une certaine maturité. Elle propose aujourd’hui des services différents, qui sont pourvoyeurs d’emplois.

B) Logiciels à savoir utiliser

Graphisme : Photoshop, Illustrator, Indesign, Power Point

Qu’il s’agisse de retoucher des photos ou de redimensionner une image, Photoshop est un logiciel très utilisé dans l’agence Advise communication.Photoshop est l’outil le plus utilisé actuellement pour la retouche d’images de qualité professionnelle. Ses nombreux outils lui permettent d’effectuer quasiment tout ce qui est possible de faire sur une image.

Adobe Illustrator est le logiciel de création graphique vectorielle de référence dans les environnements professionnels. Lui aussi de la gamme Adobe®, il est complémen-taire de Photoshop et offre des outils de dessin vectoriel puissants. Il est adapté aussi bien à la création de documents papier qu’à celle d’illustrations pour Internet :logos,affiches.

Page 15: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

15

Logiciel de mise en pages, utilisé essentiellement pour la conception sur papier de livres, de journaux, de plaquettes publicitaires ou de revues, par exemple. Il permet également d’effectuer des mises en pages destinées au web.

Les logiciels complémentaires à InDesign sont Photoshop et Illustrator.

Microsoft PowerPoint est un logiciel de présentation édité par Microsoft. PowerPoint est le programme de présentation le plus utilisé dans le monde. On peut travailler sur ce logiciel pour la création de pdf interactifs. Il permet notamment de faire des effets de transition assez spectaculaires.

Montage vidéo : After Effect et Première Pro

After Effects est un logiciel de montage et de trucage vidéo, produit par la société Adobe. Il permet la réalisation d’effets spéciaux cinématographiques d’une qualité et d’un degré de sophistication jusqu’alors réservés aux studios professionnels de cinéma. After Effects est fréquemment employé avec un logiciel de montage vidéo, tel que Adobe Première.

Adobe Première Pro est un logiciel de montage virtuel. Il permet très facilement de couper une partie d’une video, de faire des transitions, etc. L’avantage de ce logi-ciel est qu’il est très intuitif et son apprentissage est assez facile pour les débutants.

Intégration web : Aptana Studio, Filezilla, SVN Tortoise, Notepad

Dans le cadre d’une intégration web, on a besoin d’écrire du code dans un éditeur de texte. Aptana Studio en est un parmi tant d’autres. De plus, il présente l’avantage de faciliter l’écriture du code en fournissant des aides à la saisie pour le JavaScript, l’HTML, les CSS, PHP et Python.

Filezilla est un logiciel de transfert FTP (File Transfert Protocol). Il permet d’envoyer des fichiers(html,css,php,images...)surunordinateurdistant(onparledeserveur).Unefois les pages arrivées sur le serveur, on peut les consulter en ligne sur le site internet.

Page 16: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

16

C) Une diversification des tâches

L’univers d’Internet est un univers technologique par essence. Il y est question de langage HTML, de programmation,deflashparexemple.D’autrepart,c’estundomaineenperpétuelleévolution.Lestech-nologies ne cessent de proposer de nouveaux procédés dont les sites sont friands pour se démarquer.

Ainsi, le succès de la géolocalisation qui permet de mieux cibler l’internaute pour lui proposer les offres les plus pertinentes crée une demande à laquelle les techniciens du Net doivent répondre. Les sup-ports sont également variés : PC, smartphones, tablettes tactiles obligent à utiliser des technologies différentes.

L’industrie d’internet a créé des nouveaux métiers purement techniques : développeur web, intégrateurs. Mais au sein de ces métiers incontestablement techniques la polyvalence est requise du fait même de la diversité des supports. Il n’est pas possible par exemple de proposer la même mise en page sur un smartphone et sur un PC.

TortoiseSVNsertàgérerlesdifférentesversionsdesfichiersd’unprojet.Mais là où l’utilisation d’un serveur SVN prend tout son intérêt, c’est dans le cadre d’un projet “collaboratif ”. Si on est plus de deux à développer un projet, l’utilisation d’un serveur SVN permettra de travailler sur la même version de développement.

Notepad++ est un éditeur de code source qui prend en charge plusieurs langages. Ce programme, codé en C++, a pour vocation de fournir un éditeur de code source de taille réduite mais très performant. Il optimise de nombreuses fonctions tout en conservant une facilité d’utilisation et une certaine convivialité.

Autres : Google analytics, Team viewer

Google Analytics est un service d’analyse d’audience d’un site Web très utilisé en agenceWeb. Ilpermetd’analyser le traficd’unsitewebetdevoir l’efficacitéduréférencement par exemple. En plus de fournir l’évolution graphique et chiffrée de l’audience d’un site, les rapports de Google Analytics indiquent également comment les visiteurs naviguent sur le site, ce qu’ils y font et comment ils y sont arrivés.

TeamViewer fonctionne sur tous les PC, les Mac et même sur les smartphones. Facile à prendre en main, ce logiciel permet de se connecter à un PC distant. Avec ses multiples options, il est possible de paramétrer totalement l’assistance à distance, de transférerdesfichiers,d’établirdescommunicationsaudioetvidéoetdecréerdes« téléconférences ».

Page 17: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

17

Les principales tâches

• La découpe d’interfaces, la structuration et la mise en forme des gabarits de page• La cohérence et qualité des rendus, entre les maquettes graphiques et les pages codées• Les respects des standards et normes du web• Les compatibilités multi-navigateurs• Les fonctionnalités, l’interactivité et les animations• La création de chartes graphiques• Le montage vidéo• Les connaissances des techniques d’impression

Compétences requises

• Rigueur• Concentration• Patience• Autonomie et relationnel• Curiosité• Astucieux• Langages de programmation

Indispensables

• HTML• CSS• Javascript• jQuery

Complémentaires

• SASS / LESS• PHP• WordPress

Accessibilité• SEO - Google analytics• Facebook, Google Plus, Twitter

Plusieurs métiers peuvent être regroupés à travers ces réalisations : intégrateur web, graphiste, community manager, webdesigner, etc.

Au sein de l’agence Advise, les compétences sont très variées. Que ce soit un projet de création de logoouderefontedesite,l’infographistedoitexécutertoutessestâches.

• Créativité• Imagination• Polyvalence• Logiciel de PAO

• Photoshop• Indesign• Illustrator• Première Pro

Les navigateurs :• Problème de compatibilité entre les différents navigateurs• Chrome, Firefox, IE, Safari, Opéra…

Page 18: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

18

2-1. Les missions de l’infographiste chez Advise

Lesprincipalesmissionsquim’ontétéconfiéesauseind’Advise,enmaqualitéd’infographiste,sontl’in-tégration web, le webdesign, le graphisme, l’intégration de CMS, le référencement et le montage vidéo.

A) Intégration web :

Intermédiaire entre le chef de projet, le designer et le développeur, l’intégrateur web (ou développeur front-end) est un métier à part entière. Maillon indispensable dans la création de sites, il rassemble tous les éléments pour monter les pages et livrer un site performant, accessible et utilisable. Son travail néces-site tout autant de compétences techniques en HTML, CSS et JavaScript qu’une bonne appréhension de la qualité web (ergonomie, accessibilité, performance...).

Logiciels utilisés : Aptana studio (éditeur de texte), Filezilla, SVN TortoiseLangages utilisés : HTML, CSS, Javascript, Php, Framework Bootstrap

J’ai intégré des pages web sur les sites suivants :

* domaine-chaumont.fr* malta-informatique.fr

* everest-elevateurs.com* doigtsdefees.fr

* scribe-logiciels.com* advise.fr

<html>Bonjour !

</html>

Page 19: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

19

COMPÉTENCES

Il s’agit de réunir, puis d’assembler les différents éléments qui composent un site, de la mise en page jusqu’aux animations graphiques et sonores.Il faut avoir une bonne appréhension du graphisme et de l’ergonomie d’un site Internet.

L’intégrateur est d’abord un technicien polyvalent qui maîtrise différentes sortes de logiciels (traitement des médias, infographie...), mais il doit également posséder des qualités artistiques. Pour actualiser en permanence ses connaissances en matière de programmation et de design web, il doit se montrer curieux et capable d’apprendre vite. Une veille régulière est indispensable.

L’intégrateur web collabore au quotidien avec l’équipe créative, les développeurs et les chefs de projet. Ilestlegarantdurespectdesspécificationstechniquesetdudesign.L’intégrateurestsouventamenéàtravailler sur plusieurs projets en même temps. À ce compte, il doit faire preuve d’adaptabilité, de rigueur et d’organisation.

RIGUEUR&

ORGANISATIONAUTONOMIE ADAPTABILITÉ

HTML 5

CSS 3PHP

www

Page 20: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

20

B) Webdesigner

Il réalise le design d’un site internet dans le respect de la charte graphique si elle existe. Il réalise des maquettes et choisit les technologies utilisées pour la partie « front » du site.

Ce travail a pour but que le site réponde au cahier des charge du client. Par nature les sites internet fontappelàl’intuitivitéduvisiteur,doncuneréflexionergonomiques’impose.

Logiciels utilisés : Photoshop, IllustratorLangages utilisés : HTML, CSS, Javascript, Php, Framework Bootstrap

Le webdesigner doit connaître et maîtriser les nombreuses possibilités et contraintes liées à l’interactivi-té dont le rôle est prépondérant dans le multimédia.Capable d’utiliser ce savoir et de l’associer à son esprit créatif, il manipule et associe des textes et des images qui devront capter l’attention des visiteurs.

Site e-commerceDorrellnewfashion

Refonte de siteAdvise

Page 21: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

21

COMPÉTENCES

Créatif et méthodique

Une bonne culture générale, une certaine sensibilité artistique et visuelle sont nécessaires pour exercer ce métier. Innovant et force de proposition, le webdesigner doit faire preuve d’un esprit vif et dynamique.

La rigueur est également indispensable pour exercer ce métier. Capable de gérer des délais de produc-tion parfois très courts, le webdesigner doit être autonome et ouvert à la critique.

Doté d’un bon relationnel, il allie fermeté et diplomatie dans les relations avec les infographistes et les intégrateurs.

Expert en technologies

Une bonne connaissance des outils d’intégration (XML, Javascript, PHP...) lui permet de dialoguer avec les intégrateurs-développeurs ou l’équipe de production. Curieux, il effectue une veille technologique et créative permanente. Le webdesigner doit aussi imaginer le site dans des résolutions très variées : mobile, tablette, ordinateur, etc.

RIGUEUR&

ORGANISATIONAUTONOMIE ADAPTABILITÉ

Page 22: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

22

C) Graphiste

Le graphiste assure plusieurs missions de la réception du concept à la livraison du projet tout en gar-dant à l’esprit le respect des exigences du client. Si dans une grande agence son rôle peut se limiter àtrouveruneidéepuisàlatraduiresimplementparuneimageavantdeconfierleprojetàd’autresprofessionnels, dans une petite structure, il est souvent amené à prendre part à toutes les étapes de la réalisation. Il doit alors faire preuve de polyvalence.

Les missions peuvent être diverses : création de logo, de bannières web, d’illustration, etc.

Logiciels utilisés : Photoshop, Illustrator

J’ai participé à l’élaboration d’une charte graphique pour la société Foxautos.

Deuxième planche de logo - Foxautos

Première planche de logo - Foxautos

Page 23: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

23

IMAGINATIONCRÉATIVITÉ RIGUEUR

COMPÉTENCES

Vêtements - Chaussures - Sacs à main

II Plateaux Rue des Jardins Face Résidence AZIZ - Abidjan - Côte d’ivoireTél.: (225) 22 41 63 95 - 47 88 41 42

Création de carte de visite pour la société Dorrellnewfashion.

Voici la carte de visite qui a été réalisée pour un site e-commerce (Dorrellnewfashion).

Dansunepetitestructure, ilnesuffitpasdetrouveruneidée.Legraphisteparticipeaumontagede la page à l’écran, à la numérisation, mais aussi à l’incorporation des textes et des images, à la sélection des couleurs... Il doit également comprendre les techniques d’impression. C’est lui qui assure le suivi de l’impression.

Au sein de l’entreprise Advise, le graphiste doit avoir une vision globale du produit. Il doit prendre en compte beaucoup d’éléments. En effet pour un logo il doit avoir une vision de son intégration dans différents contextes et sur différents supports.

Le graphiste commence par analyser la demande du client. Une fois l’idée dégagée, il doit l’expri-mer par une image. Au-delà de l’aspect esthétique, celle-ci doit transmettre, de façon pertinente, le message formulé par le client. S’ensuit la création de la charte graphique : choix du papier, des couleurs,desmots...L’imageélaboréepeutensuitesedéclinersurdessupportsvariés:affiches,PLV,packaging, site internet...

Page 24: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

24

D) À l’assaut des CMS

CMS est l’acronyme de content management system, soit, en français, « système de gestion de contenu ». Il s’agit d’un programme informatique utilisant une base de données et permettant de gérer en totalité l’appa-rence et le contenu d’un site web.

Ilpermetd’administrerunsitewebàpartird’unbackoffice*,lesadministrateursdisposantéventuellementdeprofilsetdedroitsvariés.

Aujourd’hui, le CMS est une plate-forme de déploiement de sites web très populaire. Elle permet de créer des siteswebcomplexesàmoindrecoût,grâceauxnombreuxCMSgratuitsquiexistentsurlemarché.

Chacun offre à l’utilisateur des fonctionnalités particulières. Prestashop est un CMS pour développer un site e-commerce. Wordpress s’adresse plutôt à un public plutôt large car il propose une interface très facile à gérer. Il permet notamment de faire des blogs très rapidemment.

Force de développement : les CMS en constante évolution

Grâceauxcodesopensource,chacunpeutaméliorerlesCMSenyajoutantunefonctionnalité.

Forts d’une communauté nombreuse, les CMS gratuits sont en perpétuelle évolution. En optant pour une créa-tion de sites avec un CMS comme Prestashop, on est sûr qu’une boutique ne deviendra pas obsolète sous réserve d’effectuer les mises à jour. De plus ces mises à jour augmentent la sécurité du site et le dotent aussi souvent de nouvelles fonctionnalités.

* : se référer à l’annexe de la page 60.

Page 25: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

25

COMPÉTENCES

RIGUEUR&

ORGANISATIONAUTONOMIE ADAPTABILITÉ

Dorrellnewfashion – design jusqu’à la conception avec Prestashop

J’ai travaillé dans le cadre de mon contrat d’apprentissage, à mettre en place un site Prestashop. Ce site e-commerce a pour but de vendre des vêtements sur internet.

PrestaShop est la solution e-commerce open source la plus utilisée en France et se développe de manière conséquente à l’international. Avec plus de 130 000 boutiques créées à travers le monde, PrestaShop est désormais une solution incontournable.

Une création ou une refonte de boutiques avec PrestaShop apportera beaucoup d’avantages. Son interface intuitive permet de prendre en main la gestion du contenu d’une boutique plus ai-sément que jamais. Une fois que la boutique est créée, on peut très facilement gérer le catalogue de produits, les commandes en cours, les livraisons, analyser les statistiques, etc.

Page 26: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

26

E) Montage video

L’infographiste peut prendre en charge le montage de clips vidéo, spots publicitaires et autres produits depromotionetêtresollicitépourlemontagedeproduitslongs(téléfilmparexemple).

Logiciels utilisés : After effect et Première Pro

Montage vidéo pour le logiciel Scribe

On peut être amené à travailler également avec du motion design. Le motion designer est un métier nouveau. Il conçoit puis réalise des productions graphiques incorporant à la fois de la vidéo, de l’animation 3D, des effets spéciaux, des sons ou encore de la typographie. Ce mélange de médias seretrouvedeplusenplusaujourd’hui,quecesoitpourdesfilmsd’entreprise,desclipsmusicaux,desmessages publicitaires diffusés sur le web ou sur les écrans des grands magasins par exemple. Le motion designer a donc la double compétence du créatif et du technicien. Il est capable de travailler sur toute la chaîne de production d’une animation ou d’une interface.

J’ai réalisé un montage vidéo pour la société Scribe Logiciels. Advise a réalisé, pour le compte de Scribe Logiciels, une application permettant de faire des états des lieux sur tablette tactile. J’ai créé les tutoriels vidéos pour expliquer aux acheteurs à utiliser le logiciel.

Page 27: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

27

COMPÉTENCES

CHOISIRVISIONNER MONTER

Plusieurs étapes pour faire un montage vidéo

Dérushage:consultationdelavidéoafindedéterminerlespassagesquel’onsouhaiteconserver.On note le tout sur un carnet et ainsi de suite pour chaque séquence.

Importation ou capture des séquences ainsi sélectionnées dans le logiciel de montage.

Importation de chaque séquence depuis le caméscope dans le logiciel de montage (les sé-quencesontun formathautedéfinition)ou importationdu fichierdepuis ledisquedurduca-méscope.

Montagefinal:onassemblelesdifférentesséquencesetonanimelacréation(ajouterdestitres,des effets, des transitions, etc.).

Exportdumontagefinal(plusieursformatssontpossibles:.avi,.mov,etc.).

Page 28: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

28

F) Et le référencement web ?

Le chargé de référencement a pour mission première d’analyser l’environnement du site à référencer. Il identifieensuite lacibleetsélectionne lesmots-clésafind’obtenir le référencement lepluspertinentpossible.

Logiciels utilisés : Google analytics, Réseaux sociauxLangages utilisés : HTML

Le référencement naturel, aussi appelé SEO*, désigne un ensemble de techniques et de savoir-faire pour améliorer le positionnement d‘un site dans les résultats des moteurs de recherche. Il consiste à optimiser les pages pour répondre aux exigences des moteurs. Il permet de rendre le site pertinent par rapportauxrequêtesdesinternautesetdoncdegénéreruntraficdequalité.

Techniques :

• Détermination des mots-clés cibles• Pertinence de l’information - un contenu unique et de qualité• Site lisible par les moteurs de recherche : menu clairs, structure de texte clair, navigation facilitée• Construction et organisation des pages conforment aux normes du W3C. title : correspond au <titre de la page>, c’est l’élement le plus fort pour le référencement h1 : correpond au <titre du produit>, il est unique dans une page h2 : correspond au <sous-titre du produit> strong : permet de mettre en avant un mot et de lui donner de l’importance alt : description de l’image. Cette balise, initialement destinés à faciliter l’accessibilité du web aux

non-voyants est devenue une balise majeure du référencement.

• Liens internes et externes de qualité

Les missions :

• Remplir les balises alt, renommer correctement les images, faire des plans de sites (sitemap), etc.

Le principe est donc de faire en sorte que l’on parle du site et faciliter l’accès des pages aux moteurs de recherche, principalement Google.

J’ai travaillé sur le référencement sur les sites : • everest-elevateurs.com• malta-informatique.fr

* : se référer à l’annexe de la page 60.

Page 29: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

29

COMPÉTENCES

TECHNIQUERÉSEAUX SOCIAUX

OUTILSINFORMATIQUES

Il est important de préciser que le référencement naturel n’est pas une science exacte. Il repose sur la compréhension des algorithmes complexes des moteurs de recherche. Algorithmes en constante évolution et dont bien des paramètres sont secrets. En conséquence, pour tout référenceur qui se respecteilestdifficiled’affirmerpouvoirplacerunsiteweb(surdesmotscléstrèsconcurrentiels)enpremière position dans les résultats de recherche.

En revanche, il doit s’engager à mettre en place le maximum de moyens pour améliorer son position-nement et tenter de le faire apparaître au plus haut dans les résultats.

Le référencement naturel, à l’inverse de l’achat de mots clés type Google Adwords, prend un certain temps à donner des résultats. En revanche, les effets du référencement naturel sont durables.

Référencerunsitedemanderabeaucoupd’effortsdansunpremiertempsafind’atteindreunposi-tionnement optimal. Une fois cette place obtenue, le travail de référencement naturel consistera à la maintenir. Aussi, de gros efforts ponctuels pourront être demandés pour maintenir cette place en cas de changement d’algorithme d’un moteur ou l’arrivée agressive d’un concurrent. D’où la nécessité pour un référenceur d’être continuellement en veille sur son marché et sur les évolutions techniques des algorithmes des moteurs.

« Un mot et tout est sauvé, un mot et tout est perdu ». (André Breton)

Page 30: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

30

1-3. Une veille continue et être au courant des actualités ?

A) Les outils qui permettent de rester au courant

Le monde du web évolue vite. Le métier de graphiste n’est plus le même qu’il était il y a quelques années. De nouvelles technologies apparaissent, d’autres disparaissent. C’est pourquoi il faut s’informer sans cesse, faire un travail régulier de veille graphique et technique.

De nombreux outils permettent de rester au courant des actualités des métiers du web.

PINTEREST :

Très grande source d’inspiration pour les graphistes, Pinterest est le réseau social qui permet de parta-gerdesimages.Elledisposed’unchampderechercheefficace.

Ils’agitenfaitd’unfluxd’imagescontinuquiviennentànous,enfonctiondenoscentresd’intérêts.

Le principe de Pinterest est différent de ce que peuvent proposer aujourd’hui Google+ et Facebook. Et c’est certainement ce qui fait sa force et son attrait. Dans Pinterest, on ne raconte pas sa vie. On partage ses centres d’intérêt par le biais de photos, de vidéos, de clips, etc. Comme si on disposait d’un mur virtuel, d’un espace d’exposition où on pouvait épingler ce qui fait vibrer nos jours.

Page 31: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

31

www.blogduwebdesign.com

Le BlogDuWebdesign aborde, chaque jour, les actualités, astuces, ressources et tutoriaux dans l’uni-vers du webdesign, du graphisme et du développement.

Que l’on soit graphistes, webdesigners, développeurs, DA ou étudiants, le BlogDuWebdesign est une plateforme d’entraide et de veille. On peut ainsi suivre l’actualité du web, partager ses créations avec les membres et rédiger des billets.

Ce sont là deux exemples de sites qui sont ciblés pour les graphistes. Il en existe des dizaines d’autres. D’autres supports d’information que le web existent : livres, conférence...

Se mettre à jour niveau technique

Unefoissortiducursusuniversitaireoudelaformationprofessionnelle,ilestdifficiledetrouverlamoti-vation pour apprendre de nouvelles choses. Comment faire ? Par où commencer ? Pourquoi devrais-je encore apprendre ? Certaine personne pensent qu’il est impossible d’apprendre par soi-même ! En effet il peux être dur si personne ne nous explique. Au contraire, apprendre par soi-même c’est essayer d’aller au delà de sa sphère de compétence.

Un programmateur ne s’arrête jamais, il met à jour ses connaissances. Il est au courant des innovations en matière de codage. Il mixe également les langages (HTML et javascript par exemple). Il teste, se trompe, recommence : c’est une activité de tous les instants !

« Celui qui ne progresse pas chaque jour, recule chaque jour. » Confucius

Page 32: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

32

Ilyadenombreusessourcesdeveilledenostemps.Ilsuffitdetrouvercellequinouscorrespondlemieux.Parexemplesurlesréseauxsociauxl’informationnousvientdirectementgrâceauxfluxd’actua-lité. Ce n’est pas le même cas quand on fait une recherche sur Google par exemple.

B) L’importance de la veille en 2015

Il faut juste rester dans l’air du temps (d’où l’importance de la veille graphique dans nos métiers)

Quandonafinitsesétudesetqu’onseretrouvedanslemondedutravail,onpeutviteseretrouverdépassé par la technologie. Ce que l’on a appris sera peut-être obsolète demain. On a tous parfois fait de mauvais choix car on ignorait les solutions qui s’offraient à nous. Le monde de l’informatique évoluanttrèsvite,onpeuttrèsrapidementperdrelefiletseretrouver«hasbeen».

La veille apporte beaucoup, personnellement et professionnellement. Elle apporte tout d’abord de la culture et de la connaissance. Cela permet de mieux comprendre l’environnement dans lequel on travaille, de connaître les tendances, de découvrir de nouveaux concepts…

« Les bons artistes copient, les grands artistes pillent » - Pablo Picasso

Le fait d’acquérir des connaissances par la veille technologique permet de créer, d’inventer, d’inno-ver… Cela apporte une grande richesse. Il peut arriver très souvent dans le travail de réutiliser des idées, des concepts, des technologies très diverses. Cela permet de trouver plus de solutions, de faire de meilleurs choix, de créer sans réinventer la roue…

En tant que webdesigner et graphiste, il faut s’inspirer de tout ce qui nous entoure entre le print / le motion design / le cinéma / la littérature / l’histoire ... pour cumuler des références dans divers do-maines et donner du sens à nos créations. Il devient intéressant de revenir à ce qui se faisait avant le web pour mieux comprendre et appréhender le graphisme.

Page 33: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

33

3. COMMENT LE MÉTIER D’INFOGRAPHISTE A ÉVOLUÉ JUSQU’À CE JOUR ?

3-1. L’évolution du métier au cours des années ( 1980 - 2015)

Le terme d’infographiste est très nouveau aujourd’hui. Il y a 30 ans, le monde du web n’existait pas encore. Avec le développement du nu-mérique, il y eu la création de nouveaux métiers et notamment celui de l’infographiste. Autrefois, on designait les créatifs comme des graphistes, des dessinateurs.

La profession a profondément changé au cours de ces 20 dernières années. Il y a 20 ans, ils n’étaient qu’un poignée, membres d’une élite. Il s étaient alors détenteurs de connaissances très peu diffusées, peu sensibles à une concurrence virtuellement inexistante… du moins en info-graphie ! Ces illustrateurs réalisaient des rendus à l’aquarelle, à l’acrylique ou encore au crayon.

On assiste depuis les années 80 à une explosion des moyens et des mé-thodes de la communication publicitaire tous supports avec une prime aux moyens vidéo.

OUI le graphisme

Page 34: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

34

1990

A) Avant 1980 : Un monde où l’affiche s’exprime

Auparavant, les publicitaires et leurs agents utilisaient les services de « dessinateurs publicitaires ». Ces spécialistes étaient avant tout des artistes visuels ; les typographes étaient chargés de la mise en page et de la composition du texte, les illustrateurs produisaient aussi bien des diagrammes rigoureux que des esquisses.

Il y avait également les retoucheurs, les calligraphes, les coloristes, etc. La plupart de ces dessinateurs publicitairesmaîtrisaientplusieursspécialitésàlafois,commelesaffichistesparexemple.

L’affiche : un support d’expression artistique

La fonctionpremièrede l’afficheestdemontrer,maisaussid’attirer le regard,d´êtrevuepar leplusgrand nombre. Le but est de marquer les esprits, de se souvenir du produit présenté, de la marque. Il s’agit aussi de transmettre de façon claire et percutante, le message qu’elle contient.

Objectifs immédiats : information, conviction, séduction Objectifs plus diffus : sécurisante, ambiance, esthétique.

Dansuneaffiche,onchercheàtransmettreuneinformation,àfairepasserunmessage,celaimpliquedoncunecommunicationentrelapersonnequiregardeetl’afficheprésentée.Ce mode de communication était le moyen de communication le plus employé avant les années 1980.

Page 35: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

35

1910 - O’GALOP(MARIUS ROSSILLON)

1920 - Benjamin RabierLa vache qui rit

1953 - VillemotOrangina

1930 - MourguePneu Manjou

1957 - Hervé MorvanBanania

Page 36: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

36

B) 1990 : De l’analogique au numérique

L’ordinateur personnel arrive à partir de 1983 chez les graphistes et, dans le sillage d’Adobe et d’Apple, le travail des graphistes, toutes disciplines confondues va commencer à migrer de l’analogique au numé-rique en commençant par la redécouverte et le renouvellement des formes typographiques.

Les jeunes ne sont pas plus privilégiés que les plus expérimentés face à cette évolution. Les études restent très axées sur la création et peu, voir pas du tout, sur le côté technique. Pourtant, aujourd’hui, le métier de graphiste demande des connaissances en informatique. Les « plus geeks » d’entre nous se formeront de façonautonomegrâceauxinformationsdisponiblessurinternet;quantauxautres,ilvautmieuxs’orienterversdesformationsspécifiquesproposéespardesécoles.

Aujourd’hui, le graphiste a remplacé le dessinateur publicitaire au sein des agences. L’artiste solitaire du début du siècle a désormais intégré une équipe qui constitue un des maillons de la chaîne de l’industrie de la communication.

Jusqu’àlafinduXIXesiècle,lesartsgraphiquesétaientessentiellementimprimésennoiretblancetsurpapier. Les proportions et les dimensions de l’arrière-plan, sa couleur et sa texture, font désormais intégra-lement partie du graphisme. Le papier est le support le plus répandu.

Le dessin des caractères de typographie a toujours été source de débats et, selon les époques, ty-pographes et graphistes ont subi de nombreuses pressions exercées par les modes successives et les progrès techniques.

Il y a 25 ans, l’infographie c’était…

• Des stations de travail coûteuses• Des logiciels très chers et peu développés• Des images peu réalistes• Des animations réservées aux projets à gros budget

advise

Page 37: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

37

C) 2000 : Arrivée d’un monde nouveau pour les infographistes

L’infographiste doit par conséquent s’adapter à l’évolution du numérique. C’est pourquoi il doit avoir une certaine polyvalence. Il doit également connaître tous les supports où il est possible de travailler.

« L’art de notre époque n’est pas de l’art, mais la technologie. »

L’impact des technologies est très importante dans le monde de la conception web. Plutôt que d’agir comme une barrière, la technologie a stimulé l’expression artistique dans la conception web et au-delà, permettant de plus en plus de possibilités dans de nombreux domaines différents. La technologie a éga-lement ouvert le monde de la conception de sites web à des gens qui ne possèdent pas les connais-sances de la programmation.

Aujourd’huiilestdifficiledetrouverunlivrequiaétécréésurunepressed’impression,toutcommeonauraprobablement du mal à trouver un site fait uniquement avec du HTML. Mais la différence technologique entre les deux est que l’évolution de l’une s’est faite en 500 ans et l’autre en 25 ans.

Quels facteurs ont joué un rôle dans cette rapide transformation dans le monde de la conception de sites Web? Comment la conception web a évolué au cours des deux dernières décennies?

Page 38: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

38

D) En 2015, l’information se lit visuellement.

Dans le cadre d’une conférence de TED (Technology, Entertainment and Design), le journaliste David McCandless dit qu’on est arrivé dans un monde d’information surabondante : télévision, internet, livre.

« So information is beautiful. Data is beautiful. I wonder if I could make my life beautiful... I started as a programmer, and then I worked as a writer for many years, about 20 years, in print, online and then in advertising, and only recently have I started designing. And I’ve never been to design school. I’ve never studied art or anything. I just kind of learned through doing. And when I started designing, I discovered an odd thing about myself. I already knew how to design, but it wasn’t like I was amazingly brilliant at it, but more like I was sensitive to the ideas of grids and space and alignment and typography. It ’s almost like being exposed to all this media over the years had instilled a kind of dormant design literacy in me. And I don’t feel like I’m unique...The eye is exquisitely sensitive to patterns in variations in color, shape and pattern. It loves them, and it calls them beautiful. It ’s the language of the eye. If you combine the language of the eye with the lan-guage of the mind, which is about words and numbers and concepts, you start speaking two languages simultaneously, each enhancing the other. So, you have the eye, and then you drop in the concepts. And that whole thing -- it ’s two languages both working at the same time. »

Onpeutconstaterdepuiscesdernièresannéesunetendanceversunesimplificationdescodespardes jeux d’aplats colorés et des typographies très caractérisées. Le design a évolué vers des traits épurés, simple et précis.

Si on examine les données, elles nous apparaissent sous différentes formes (infographie, images). La diversité du web est un élément primordial pour pouvoir y ajouter n’importe quel type d’information.

Page 39: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

39

Le Flat Design est-il l’avenir du design ?

Le Flat Design est un style de design caractérisé par son aspect sobre, épuré et rapidement lisible. Il se différencie d’autres procédés misant sur les effets d’ombres portées et de reliefs comme le skeuomor-phisme.Ilestnotammentinfluencerparleresponsive.

Le Flat Design existe déjà depuis un certain temps, et n’est que le résultat d’une succession d’avancées technologiques et de changements d’habitudes des utilisateurs de sites web.

Profession en perpétuelle évolution, le graphiste n’est pas épargné par la révolution numérique. La chaîne graphique, déjà bouleversée par l’arrivée des premiers ordinateurs personnels, est désormais confrontée àdenouveauxdéfisdansledomainedel’éditiondigitale.

Page 40: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

40

3-2. Le web a seulement 25 ans ?

A) L’arrivée d’internet – Le WEB 1.0

Mosaic fut le premier navigateur Web.

• Il a été le premier navigateur Web à permettre de présenter des photos en ligne sans être ouvert sur une autre fenêtre.

• Il a été le premier navigateur créé et soutenu par des programmateurs à plein temps.• Il a été le premier navigateur web destiné à des novices.

1991 : Apparition du premier site internet En Août 1991, un physicien du nom de Tim Berners-Lee a créé le premier site web à partir de son ordinateur NeXT situé à l’installation du CERN dans les Alpes suisses.

Mosaic : le premier navigateur Web

Page 41: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

41

advise

Imbrication d’image pour former un graphisme

En 1995, le CSS était pratiquement inconnu à l’époque. Ci-dessous voici la construction d’une illustration simple avec un fond de couleur.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus libero arcu, dignissim quis eros nec, suscipit pharetra diam. Fusce nec sapien a metus sagittis gravida ultricies a turpis. Duis maximus ante magna. Etiam enim

ipsum, maximus at lorem vel, placerat fringilla lectus. Sed pellentesque tortor vitae nibh dignissim ultricies. Integer vestibulum mattis neque et auctor. Suspendisse pretium ex faucibus massa auctor scelerisque. Vivamus tortor ex, imperdiet et auctor in, pharetra a leo. Vestibulum ullamc

L’arrivée du CSS a bouleversé le monde des sites internet et a donné des moyens aux développeurs et aux intégrateurs de developper leur créativité.

<- Ligne d’un tableau avec une image

<- Ligne d’un tableau avec une image

<- Ligne d’un tableau avec un fond

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus libero arcu, dignissim quis eros nec, suscipit pharetra diam. Fusce nec sapien a metus sagittis gravida ultricies a turpis. Duis maximus ante magna. Etiam enim

ipsum, maximus at lorem vel, placerat fringilla lectus. Sed pellentesque tortor vitae nibh dignissim ultricies. Integer vestibulum mattis neque et auctor. Suspendisse pretium ex faucibus massa auctor scelerisque. Vivamus tortor ex, imperdiet et auctor in, pharetra a leo. Vestibulum ullamc

Page 42: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

42

Pour la première fois, les entreprises embauchaient des concepteurs de sites Web pour exister dans le domaine du web.

• Apparition des premiers compteurs de visite au bas de sites Web.

• Le texte était toujours roi, parfois les textes étaient en forme d’image

• Sitewebanimé:présencedegifettextedéfilant

• Accent sur la couleur du texte

FIN DES ANNÉES 1990 L’AGE DE FLASH ET LE COMMENCEMENT DU WEBDESIGN

Macromedia est alors surtout reconnue pour ses logiciels Flash et Dreamweaver. En mai 2005, elle est achetée par la société Adobe Systems.

Page 43: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

43

Les connaissances : Peu de gens savaient comment construire un site Web à l’époque. Il n’y avait pas d’écoles spécialisées dans le numérique.

Lesdifficultés: La seul façon de faire un site était de coder à la main avec un éditeur de texte.

Quand un nouveau concept sortait comme Flash, tout le monde commençait à l’utiliser. Nous étions tous

des débutants dans ce domaine.

Geocities, Ifrance et Tripod hébergeaient à peu près toutes les pages personnelles, et « Google » était juste un mot qui sonnait bizarrement en 1999.

Pendant près de cinq ans, GeoCities a offert aux utilisateurs des pages d’accueil gratuites au sein de son répertoire web.

Beaucoup de personnes ont commencé à s’intéresser à la conception de sites web comme les déve-loppeurs web avec l’arrivée de Flash. GeoCities a permis deux avancées majeures dans le domaine de la conception de sites web :

• Rendre simple la création de sites web• Multiplication des sites internet (avec des design structurés en tableau et essentiellement reposant

sur des jeux de couleurs primaires)

* : se référer à l’annexe de la page 60.

Page 44: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

44

Àlafindesannées1990,lesentreprisesontcommencéàcomprendrel’intérêtpourellesdesedoterd’un site internet, pour des raisons d’image et parce qu’un nouveau marché émergait. La conséquence a été l’ouverture des premières écoles de création de sites web.

Pour la première fois, les utilisateurs des sites ont pu interagir avec un site web, mais toujours sur une base limitée. De petits changements ont commencé à apparaître, comme la première utilisation de liens inte-ractifs qui changeaient de couleur lorsque les utilisateurs avaient cliqué dessus.

L’arrivée de la programmation avec le php et l’asp a bouleversé les méthodes de création de sites internet.

B) À la recherche de nouveauté : web 2.0

“Le web 2.0 repose sur un ensemble de modèles de conception : des systèmes architecturaux plus intelligents qui permettent aux gens de les utiliser, des modèles d’affaires légers qui rendent possible la syndication et la coopération des données et des services… Le web 2.0 c’est le moment où les gens réalisent que ce n’est pas le logiciel qui fait le web, mais les services !” Kevin Kelly, ancien rédacteur en chef de Wired

Fait majeur des années 2005, l’arrivée du web 2.0 est marqué par la montée en puissance de l’intérac-tivité, l’essor des réseaux sociaux et l’apparition de nouvelle technologie. Le Web 2.0 est l’évolution du

Web vers plus de simplicité notamment pour ses utilisateurs.

Réseaux sociaux:

Facebook,Twitter,Viadéo,LinkedIn,blogs,fluxRSS,etc.Lesréseauxsociauxsontdenosjourslesnouvellescoqueluches du web 2.0.

Il y a eu également des sites qui diffusaient de la musique lorsque on les consultait.Les concepteurs de sites web ont axé la plupart de leur attention sur l’interaction entre le site et l’utilisateur. Ces principes d’interac-tivité sont encore en vie et utilisé aujourd’hui.

Page 45: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

45

L’arrivée du CSS

CSS a commencé à gagner en popularité parmi les concepteurs Web. Le CSS était devenu si important qu’il permettait aux concepteurs de créer des graphiques séparément du contenu. Avant le CSS, les codeurs avaient besoin d’écrire le code pour chaque page même si celles-ci reproduisaient un modèle similaire.

Lesfeuillesdestyleencascadeontpermisauxconcepteursdedéfinircertainsdesélémentsimportantset statique d’une page Web, telle que la taille du texte, la police, la couleur de fond, etc. Une feuille de style compense les heures de codage d’un site web. En outre, les sites ont commencé à développer un aspect plus uniforme à cause de ces feuilles de style.

Le développement des réseaux sociaux est un phéno-mène de société, du fait des nombreux services et du côté pratique et spontané offert par ceux-ci. Les interac-tions(partagesdefichiers,discussionsinstantanées,com-mentaires…), réputation, visibilité … Certains ne voient en ces médias sociaux qu’un phénomène de mode. D’autres, plus visionnaires, considèrent l’enjeu de communication considérable qui peut en découler.

Page 46: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

46

Javascript et sémantique

Javascript a été introduit en 1995, mais a commencé à gagner en popularité à partir du milieu des années 2000. L’introduction de Javascript marque la disparition des tableaux html en tant qu’élement structurant des pages. Il a été la première tentative réussie de menus animés et de calcul de données sans l’utilisation de Flash. Quatre nouveaux éléments de conception de sites web sont apparus avec Javascript:

• Menu de navigation• Les menus déroulants• Formulaires web• L’utilisateurpeutcréerducontenu(commelesprofils,revuesetcollectionsdephotos)

Javascript a notamment permis l’arrivéede l’Ajax, qui a considérablement simplifié la navigation despagesetl’affichagedespages.Eneffet,ellepermetd’actualiserunepagesanslarecharger.Unedesutilisationscourantesestl’affichagedesmurssurfacebook.Onpeutréaliserégalementdeschatssurlessites internet.

advise

Page 47: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

47

C) WEB 3.0 : Le développement n’est pas encore finit

Aujourd’hui, HTML5 est encore en développement, mais il promet de faire oublier Flash. L’interaction avec l’utilisateur est de plus en plus importante, et Google domine le monde. Plus de personnes visitent facebook.com que tout autre site en ligne, et Amazon.com est le roi incontestable de l’e-commerce. Les webdesigners travaillent sur de nouvelles et passionnantes façons de présenter le contenu, comme les infographies interactives.

Le concepteur de sites web d’aujourd’hui ne peut pas être celui du passé, en ignorant les nouvelles applications et les tendances du design.

Ilestdifficiledenepasêtreimpressionnéparlavitesseàlaquellelaconceptionwebaévoluéetconti-nue d’évoluer.

Les supports ont également beaucoup évolué notamment avec l’arrivée des téléphones mobiles. En effet l’image se transmet aussi bien sur une télévision, sur un mobile que sur un ordinateur portable. Tout le monde possède actuellement un smartphone qui permet de se connecter à internet et de naviguer sur le web.

En à peine 25 ans le web a totalement changé.

Page 48: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

48

D) L’évolution des logiciels de graphisme

LE WEB ÉVOLUE, L’INFOGRAPHISTE AUSSI ...

Apple s’est imposé dans les métiers créatifs en étant la première société à proposer au milieu des années 1980 une interface graphique et des logiciels pour la création et la retouche d’image.

Elle était la seule à le faire à l’époque, ce qui pèse encore sur sa réputation : Apple reste plébiscitée pour les métiers créatifs.

1985 - MacPaint

MacPaint est un logiciel de création et d’édition d’images matri-cielles qui était développé par l’entreprise Apple. Il est apparu avec le premier Macintosh, le 24 janvier 1984. MacPaint était alors célèbre car il permettait de créer des images qui pou-vaient être utilisées par d’autres applications. La version initiale de MacPaint a été développée par Bill Atkinson, un membre d’Apple qui a également participé à la création du Macintosh.

QuickDraw : Bibliothèque Macintosh

QuickDraw est la bibliothèque Macintosh pour créer des gra-phiques bitmap, qui a été utilisé par MacPaint et d’autres ap-plications. Il se compose d’un total de 17,101 lignes dans 36 dossiers, tous écrits en langage assembleur pour le 68000.

logiciel MacPaint

Steve Jobs, Bill Atkinson1984 - Macintosh

Les logiciels d’Apple ont beaucoup évolués depuis. De nou-velles versions sont toujours en élaboration pour avoir des lo-giciel toujours plus performants. Apple s’est imposé comme le principal distributeur de logiciel de graphisme.

Page 49: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

49

E) LE WEB EN 10 DATES CLES

1) 1990 : l’apparition du World Wide Web par Tim Berners-Lee

Tout commence en 1989 avec le chercheur Tim Berners-Lee. Il conçoit l’idée de naviguer simplement d’un espaceàunautred’internetàl’aidedelienshypertextesetgrâceàunnavigateur.

Cette date marque le début de la démocratisation d’internet.

Il lance ainsi le premier serveur web et le premier navigateur web en mode texte, appelé WorldWideWeb (plus tard rebaptisé Nexus) et développé en Objective C sur NeXT. Les 3 technologies à la base du web : l’URL, le HTML et le HTTP

2) 1993 : Premier navigateur web avec des images - NCSA Mosaic

Le « World Wide Web » se transforme en combinaison de textes et de graphiques quelques temps seu-lement après, avec le lancement de Mosaic, le pionnier des navigateurs web.

Mosaic déclenche l’accroissement de la popularité du web, c’est le premier navigateur à intégrer des images. 2 738 sites en juin, 10 022 en décembre.

Quelque temps plus tard, il y a eu la création du premier navigateur commercial, Netscape Navigator. Il seralongtempsplébiscitéparlesinternautesavantl’arrivéed’InternetExploreràlafindesannées1990.

Lenombredesitesaugmente,àtelpointqu’ildevienttrèsdifficilepourl’internautedes’yretrouver.Deuxétudiants de Stanford, Jerry Yang et David Filo, décident alors à cette époque de créer un annuaire de sites, classés de façon thématique. D’abord baptisé Jerry ’s guide to the Wold Wide Web, le site est très vite rebaptisé Yahoo! Il va vite devenir le portail numéro 1 de la Toile dans la seconde partie des années 90. Il inclut également un module de courrier électronique : Netscape Mail.

Yahoo.com - 1994

Page 50: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

50

3) 1996 : courrier électronique Hotmail et Wifi

Le 4 juillet, jour de la fête nationale américaine, Jack Smith et Sabeer Bhatia lancent, avec 300 000 $ d’investissement, un service de courrier électronique gratuit sur le Web baptisé Hotmail. En quelques mois, le cap des 100 000 utilisateurs sera dépassé.

1996 : apparition du wifi

Ilya15ansdéjà,naissaitleWifi.Latechnologie,quis’estbeaucoupamélioréeaufildesannées,oc-cupe désormais un rôle central dans nos activités.

leWifiavéritablementbouleversénosvies.Chaquejour,plusieursmilliardsd’appareilsseconnectentauWebgrâceàuneconnexionWifi,échangentdesinformations,etpermettentderesterencontactavecdesêtreschers.LeB2B*n’apasboudélatechnologieenadoptantenmasseleWifi,quecesoitenentreprise, dans les hôtels, les foires et parfois même les villes. Plus d’un foyer sur quatre dans le monde seraitconnectéàunréseauWifi.

4) 1998 : Création de Google le 4 septembre 1998

Google fonctionne avec un système de réputation de pages et classe ses réponses notamment en fonction du nombre et de la qualité des liens qui pointent vers elle.

Dans le même temps, la Tunisie s’impose comme un pionnier dans le monde arabe et africain en permet-tant l’utilisation commerciale et publique de l’Internet dans le pays.

Le succès du site est immédiat car les résultats de recherche sont tout simplement cent fois plus pertinents que chez la concurrence, rapidement ringardisée.

* : se référer à l’annexe de la page 60.

Site internet de Google en 1998

Page 51: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

51

5) 2001 : Lancement de Wikipedia - 15 janvier 2001

L’encyclopédie libre est née d’un échec : celle de Nupedia, un projet proche d’encyclopédie gratuite... maisdont lesarticles,écritspardesexperts,devaientsubiruncontrôlescientifiquestrictavantd’êtrepubliés. Devant le faible nombre d’articles publiés, Larry Sangers, son rédacteur en chef propose à Jimmy Wales, le patron de Nupedia, d’imaginer un tout autre système de validation, qui en passera par une technologie encore peu connue à l’époque. Il s’agit du Wiki, qui permet aux visiteurs d’un site d’en mo-difiereux-mêmeslecontenu.Résultat:WikipediaestdésormaisunorganeimportantduWeb,avec500millions de visiteurs uniques par mois !

6) 2004 : Lancement de Facebook

Le concept de Web 2.0 apparaît. En 11 ans, le réseau social créé par Mark Zuckerberg a atteint un milliard d’utilisateurs, bien loin du trombinoscope pour étudiants qu’il était au début. À tel point qu’il est désormaisdevenul’annuaire(nonofficiel)duWeb.

TimBernersLeen’appréciepasleservice,qu’ilestimeêtreun«WebdansleWeb»quipourraitfinirparfragmenter son invention.

Page 52: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

52

7) 2005 : Youtube et le Web 2.0 - 14 février 2005

À partir de la seconde partie des années 2000, les internautes vont s’emparer du www : ils ne se contentent plus de consommer des contenus, ils en produisent. 2004 : c’est l’émergence du Web 2.0. Le site de partage de vidéos, Youtube, révolutionne la consommation de vidéos sur le Web. Google rachète la prometteuse plate-forme un an et demi après son lancement, contre 1,65 milliard de dollars...

8) 2007 : L’apparition du 1er Iphone

Il s’agit du premier modèle de téléphone jamais fabriqué par la marque Apple. À l’époque, le premier iPhone n’avait pas d’App Store, une faible 2G, pas de fonction copier-coller ni même de possibilité de changer le fond d’écran. Ce modèle n’était pas opérationnel, les bugs étaient nombreux, et personne dans les médias ne comprenait la folie qui entourait le produit.

Mais en 2007, tout ce qui intéressait les gens avec l’iPhone, au-delà de l’aspect gadget ultra-moderne véhiculé par Apple, c’était l’expérience du web qu’offrait le téléphone avec une qualité que l’on avait pas encore vu. Naviguer sur Internet existait déjà à l’époque sur téléphone, tout comme les écrans tac-tiles,maisjamaisavecautantdeprécisionetd’efficacité.

Page 53: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

53

9) 2008 : L’arrivée des applis mobiles - App Store

En 2008, Steve Jobs annonce l’App Store, une boutique en ligne pour son iPhone qui bouleverse les règles du jeu. Six ans plus tard, les smartphones et ces petits programmes sont tellement populaires qu’ils présentent même une menace pour le Web. Car ce n’est plus un navigateur que nous ouvrons pour consulter nos sites préférés, mais des programmes indépendants, qui ont chacun pour objectif de nous garder dans leur cercle.

10) 2010 : Arrivée de l’HTML5

20 ans après son invention, le HTML fait une douce révolution, toujours sous l’impulsion de Tim Berners-Lee. GrâceàlacinquièmeversiondustandarddebalisagedespagesWebetdenombreusestechnolo-gies associées, de nouveaux services émergent. L’objectif de ce standard est de transformer les pages Web, encore trop statiques, en véritables programmes informatiques. Il n’auraient alors rien à envier aux applications pour smartphones ou aux logiciels que l’on installe sur son ordinateur. Le but était de faire du navigateur l’unique application dont on aurait besoin.

Page 54: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

54

3.3 Des questions d’efficacité

A) Quel différence avec un grand groupe ?

Grand groupe

L’un des avantages les mieux reconnus aux grands groupes est la possibilité offerte à leurs employés d’évoluerauseindel’entreprise.Promotion,orientationversunnouveaumétier,carrièredansunefilialeàl’international sont autant d’occasions d’évolution offertes aux employés des grands groupe. La plupart de ces compagnies mettent en place avec les salariés un plan d’évolution de carrière, leur offrant ainsi des perspectives à long terme au sein de l’entreprise, tout en leur permettant de se renouveler profes-sionnellement.

Ledésavantagedansungrandgroupeestquechaquepersonneestlimitéàdestâchesassezprécises.Eneffetpouruninfographiste,saprincipaletâcheseradecréerunechartegraphiquepourdesproduits(logiciels par exemple).

Pette structure

Les PME en France représentent 95% des entreprises et 70 % des emplois. Les PME offrent ainsi plus des 2/3 des opportunités d’embauche du marché de l’emploi.

L’un des avantages les mieux reconnus aux PME est le niveau de responsabilité et d’autonomie dont disposent leurs employés. En travaillant dans une entreprise de taille réduite, les jeunes diplômés ont la possibilité de mettre réellement en valeur les enseignements tirés de leurs stages et de leur formation. Ils ontainsilapossibilitéd’apprendrerapidementsurletasdenouvellesattributions,etsurtoutd’influersurle cours des choses.

Au sein de petites structures, on trouve peut-être plus aisément la reconnaissance recherchée par les jeunes. En effet il y a une relation de proximité avec tous les acteurs de l’entreprise et une plus grande visibilité sur les réalisations. Dans les plus petites structures, il y a une diversité des missions et des responsa-bilités. Le sentiment de vraiment compter. Ce qui implique évidemment une grande autonomie, une bonne dose de créativité et une implication personnelle importante. L’avantage, c’est qu’il est plus facile d’avoir une vision globale de son activité. Chaque collaborateur a le sentiment de compter vraiment au sein d’une petite agence comme Advise Communication.

Page 55: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

55

Une polyvalence plus grande

Dans une petite entreprise, la polyvalence est de rigueur. Dans une structure importante, une infogra-phiste se concentrera sur le cœur de sa fonction. Dans une PME, il sera touche-à-tout, intervenant surleréférencement,lemontagevideo,etc.Uneimplicationquiestsouventgratifiante.

Si les perspectives de mobilité géographique peuvent se révéler moins intéressantes dans les PME, l’intérêt des postes et des missions y est souvent plus grand. Missions moins compartimentées, plus grandeautonomielaisséeauxsalariésdanslaréalisationdeleurstâches.Évoluer dans une PME est la garantie d’acquérir une grande polyvalence. Une polyvalence souvent très appréciée par les recruteurs.

LessalariésdePMEontengénéraldestâchesmoinsmorcelées,etont,mieuxquedanslesgrandsgroupes, une vision plus globale de l’activité. La résultante est qu’ils voient et récoltent plus rapide-ment les répercussions de leurs actions, et développent ainsi un sentiment d’appartenance plus fort.

Page 56: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

56

B) Petite agence cherche superman ?

Pour une petite entreprise, plus encore que pour un grand groupe, chaque embauche représente un vé-ritable enjeu. Les résultats de la société en dépendent, notamment lorsqu’il s’agit d’un recrutement dans l’une des fonctions clés : production, commercial, marketing, etc.

Problème:lespetitesentreprisespeinentàtrouverdesprofilsenadéquationavecleursbesoins.

Par ailleurs, beaucoup de PME proposent des emplois qui demandent une grande polyvalence et impliquentdenombreusesresponsabilités.Untypedeprofilspourlesquelslesfichesdepostesontcom-pliquéeàdéfiniretàqualifier,cequirendévidementlerecrutementplusdifficileencore.

Pourquoi prendre une jeune graphiste en cours de formation ?

Faire des économies :Le fait d’être polyvalent est une condition à l’embauche pour permettre au chef d’entreprise de faire des économies sur la masse salariale. En effet contrairement aux grands groupes, une petite structure est parfois assez fragile.

Le coût d’un site internet peut varier selon le projet. Les frais associés à l’agence sont parfois très coûteux : hébergement, nom de domaine, locaux, ordinateur, employé... Advise Communication fonctionne en partiegrâceàlafidélisationdesaclientèle.Eneffetl’agencepossèdeunevingtainedeclientsactifs.

Pourpermettreàl’agenced’effectuerdestâchesquotidiennes,elleabesoind’unprofilpolyvalent.Ellen’a pas forcément besoin de quelqu’un d’expérimenté tout de suite, car les rôles sont assez divers (inté-gration web, logo, ...). La licence professionnelle Infographie de l’université de Cergy-Pontoise apporte toutes les compétences dont Advise peut avoir besoin.

Page 57: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

57

Avoir un regard plus jeune sur les tendances web

La licence professionnelle forme des professionnelles du multimédia. On apprend beaucoup à s’inspirer des autres pour créer un concept. La formation apporte des connaisances dans les nouvelles tendances web. C’est un fort atout pour une agence web qui doit faire face à cette évolution constante des ten-dances.

Les étudiants ont un regard plus jeune et peut-être plus actuel du monde d’aujourd’hui. Nous sommes aujourd’hui nombreux à être nés avec le web.

Le design à évolué au cours des années et les techniques aussi. C’est pourquoi prendre une infogra-phiste en cours de formation est un réel avantage pour l’entreprise Advise Communication.

Bravo !

Page 58: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

58

CONCLUSION

Pour conclure sur ce mémoire, on peut dire que le web est un monde qui ne cesse d’évoluer. Les info-graphistes qui évoluent dans le monde du web doivent par conséquent s’adapter. Une agence web est un environnement où beaucoup de domaines se mélangent. Un individu qui connaît plusieurs do-maines aura plus de facilité à se confronter aux projets. Lors de la création d’un site web par exemple, il faut également avoir l’oeil d’un graphiste. Cela permet d’être autonome au sein d’une petite struc-ture comme Advise Communication.

Je vais revenir sur l’année que j’ai passé durant cette licence professionnelle Infographiste.

Premièrement, cette année m’a apporté énormément de connaissances. Cette licence m’a donné de très bonnes connaissances dans les différents logiciels de PAO. De plus j’ai appris d’autres techniques comme la 3D, les jeux avec le logiciel Flash, les techniques de marketing, les métiers de la vidéo, etc. Je suis convaincue que toutes ces notions que j’ai apprises me seront utile par la suite.

En travaillant en collaboration avec des infographistes sur les projets de l’université, j’ai appris égale-ment d’autres techniques que je connaissais pas. J’ai appris notamment l’étude de la typographie et à maîtriser le logiciel Illustrator.

Deuxièmement, c’est la première année où je fais une formation en alternance. Cela m’a permis d’avoir un premier lien avec le monde du travail. Dans l’entreprise Advise Communication, j’exerce un travail oùjenesuispasfixéeàunetâche.Lefaitdepouvoirtravaillerautantdansledesignquedanslacréation de sites web me plait beaucoup.

Je compte éventuellement poursuivre mes études dans le but d’appronfondir mes connaissances dans le domaine du web.

Page 59: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

59

REMERCIEMENTS

J’adresse mes remerciements aux personnes qui m’ont aidé dans la réalisation de ce mémoire.

Je tiens à remercier dans un premier temps Pascal THOYER de l’entreprise Advise communication de m’avoir donnée la chance d’évoluer dans le domaine du web. J’ai ainsi pu apprendre tous les métiers associés au web. J’ai pu découvrir de nouveaux logiciels qui m’ont permis d’approfondir mes connais-sances. Il m’a guidé dans mon travail et m’a aidé à trouver des solutions pour avancer. En tant que chef de projet, il a su m’indiquer les erreurs que j’ai pu effectuer pour les corriger par la suite.

Je remercie aussi Laurent EHRHARD et Julien PINTO de l’entreprise Advise Communication pour m’avoir appris différentes facettes des métiers du web. Laurent EHRHARD m’a appris beaucoup de techniques. Il travaille en tant qu’intégrateur et connaît parfaitement l’évolution du web depuis 2000. J’ai appris notammentgrâceà luiunoutil indispensabledans leweb, le frameworkbootstrap.Grâceà JulienPINTO, j’ai pu apprendre la réalité du métier de développeur web.

J’adresse également mes sincères remerciements à tous les professeurs, intervenants et toutes les per-sonnesquiparleursparoles,leursécrits,leursconseilsetleurscritiquesontguidémesréflexionsetontaccepté à me rencontrer et répondre à mes questions durant mes recherches.

Je tiens à remercier l’équipe qui compose la licence Professionnelle Infographiste de l’université de Cergy-Pontoise pour leur gentillesse. Les professeurs m’ont été d’une grande aide. J’ai beaucoup ap-prisgrâceàeux.

Page 60: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

60

ANNEXES

1) Définition des termes techniques

Hébergement :L’hébergement internet est un service qui consiste à mettre à disposition 24h/24h, 7j/7j son site internet sur un ordinateur sécurisé et connecté à internet (serveur web).

Serveur dédiée :Dans le cadre d’un serveur dédié, l’ensemble des ressources disponibles sur la machine sont allouées à un même client, lui permettant ainsi de disposer de toute la puissance de celle-ci.

Serveur muitualisée :Sur un serveur mutualisé, plusieurs clients se partagent les ressources de la même machine.

Serveur web :Dans l’informatique, le mot « serveur web » désigne à la fois une machine physique et un logiciel. Dans le premier cas, il s’agit d’un ordinateur relié à Internet et hébergeant des ressources. Ces ressources peuvent êtredesfichiers,desprogrammesoudesbasesdedonnées.

Wordpress :WordPress est un prodigieux logiciel open-source permettant de créer et d’administrer très facilement un blog.

Thème wordpress :Un thème est un modèle de mise en forme graphique des contenus pour un site internet.

Netscape :Netscape Navigator était un navigateur Web qui a dominé le marché au milieu des années 1990.

B2B : Relation commerciale entre entreprises

Back-office:Surinternet,lanotiondeback-officecorrespondàlapartiedusiteinternetquin’estvisiblequeparl’admi-nistrateur du site et qui permet de gérer le contenu, les fonctionnalités...

SEO :LetermeSEOestunacronymeanglaissignifiant«SearchEngineOptimization».Celasetraduitenfrançaispar «Optimisation pour les moteurs de recherche» et c’est tout simplement l’équivalent anglais pour le mot référencement.

Page 61: MÉMOIRE D’ENTREPRISE - Nisha-world.frJ’ai participé à la refonte du site internet. J’ai créé une bannière web et changé les couleurs pour donner une certaine cohérence

61

1) Définition des termes techniques

2) Références sites

http://www.mosaique-info.fr/glossaire-web-referencement-infographie-multimedia-informatique/a-glossaire-infor-matique-et-multimedia/533-after-effects-definition.html

http://glossaire.infowebmaster.fr/google-analytics/

http://www.generation-nt.com/pinterest-reseau-social-invitation-mode-actualite-1542551.html

http://nicolaspene.fr/autodidacte-5-conseils-pour-apprendre-par-soi-meme/

http://www.lattitudeweb.com/developper-votre-site-e-commerce-avec-prestashop

http://tacticweb.fr/referencement-naturel/referencement-naturel-definition

http://www.lettresnumeriques.be/2013/02/01/levolution-numerique-du-metier-de-graphiste/http://arsalive.blogspot.fr/2015/01/survol-du-graphisme-des-annees-80.html

http://www.designjuices.co.uk/2011/09/web-design-evolution/

http://www.ted.com/talks/tim_berners_lee_on_the_next_web?language=fr

http://www.hbrfrance.fr/chroniques-experts/2014/09/3785-jeunes-diplomes-et-si-vous-demarriez-votre-carriere-dans-une-pmetpe/

http://www.etudiant.fr

https://tomasid.wordpress.com/2013/02/28/quelques-dates-cles-du-web/

http://www.01net.com/actualites/les-15-dates-qui-ont-fait-le-web-615826.html

http://www.journaldunet.com/ebusiness/expert/53211/comment-les-reseaux-sociaux-ont-envahi-le-web-2-0.shtml

http://geeko.lesoir.be/2014/09/10/le-wifi-fete-ses-15-ans/

http://www.tonwebmarketing.fr/webmarketing/web-design-des-annees-90-en-avez-vous-sur-votre-site

http://www.slate.fr/story/103719/2007-folie-premier-iphone

http://www.aurlom.com/avis_pme

http://www.computerhistory.org/atchm/macpaint-and-quickdraw-source-code/