Intégrateur web : passé, présent, futur.

[Article écrit pour Biig, et disponible sur biig.fr]

Un peu d’histoire

La préhistoire

De l’apparition du web jusqu’au milieu des années 2000, l’intégration web ne correspondait pas réellement à un métier nommé (ni même nommable) comme a pu l’être très rapidement celui de développeur par exemple, celui de webdesigner aussi, ou encore celui de webmaster.

Et pourtant, le HTML et le CSS (les deux langages de base de l’intégration) ont toujours été au coeur du web et de ce que l’on peut voir dans notre navigateur. A cause de ce flou autour de cette tâche, appelée alors “Montage HTML”, l’intégration était à ses débuts et par défaut confiée à tous les métiers “dinosaures” du domaine, répartition qui tenait parfois seulement aux profils ou appétences personnels des personnes occupant ces métiers.

A l’époque, les systèmes de gestion de contenus (CMS) n’en étaient qu’à leurs balbutiements. Les interfaces soignées et ergonomiques permettant de ne se focaliser que sur le contenu n’étaient pas encore disponibles. Le webmaster devait donc se retrousser les manches. Par nécessité, les langages HTML et CSS faisaient ainsi partie de son quotidien.

Et il n’était pas le seul. Des logiciels “facilitateurs” (Frontpage, ou Dreamweaver et son célèbre mode “design”) permettait également aux webdesigners de réaliser des petites tâches d’intégration rapides comme, par exemple, le montage de pages ou newsletters simples.

Très souvent aussi, au sein d’équipes réduites où le manque de temps et/ou de budget décidait parfois de tout, le développeur backend touchait également au front pour dépanner et faire avancer le projet… à sa plus grande joie en général 😑.

En réalité, tous les métiers du web de l’époque touchaient à l’intégration sans pour autant être expert en la matière, et avec d’ailleurs plus ou moins de goût et d’implication pour la chose. Il y avait donc largement assez de place pour faire de cette mission un nouveau métier, encore fallait-il un, ou plutôt, plusieurs déclics.

La naissance

Vers la fin des années 2000, l’intégration web a vécu une combinaison d’énormes tournants qui l’ont poussée à sortir de l’oeuf 🐣.

L’arrivée des devices mobiles (smartphones, tablettes notamment) et du responsive, la complexification des interfaces avec l’émergence de nouveaux métiers du design (ui, ux), mais surtout un développement exponentiel des langages dédiés à l’intégration (html et css notamment, mais aussi javascript et plus récemment le svg) ont très vite créé le besoin d’avoir de la qualité sur le sujet, et par conséquent d’avoir des personnes à forte expertise sur ce métier.

Le simple “Monteur HTML” est alors promu “Intégrateur web”. Il lui fallait maintenant jouer des coudes pour trouver sa place.

Open Captain America Gif By Agent M Loves Gif - Find & Share on GIPHY

Cher intégrateur, qui es-tu réellement ?

Si le métier d’intégrateur web s’est imposé petit à petit dans l’écosystème de la production web, il lui a fallu du talent 😎 et de la persévérance 💪 pour démontrer toute son utilité et la valeur de son travail à la production web.

Moqué, gentiment chahuté, très souvent sous-côté, l’intégrateur a longtemps joui de la réputation d’être un sous-développeur, perception notamment due à la simplicité apparente des langages qui font son quotidien (HTML et CSS). Heureusement, le temps a fait son travail, et l’apparition récente d’autres nouveaux métiers de spécialistes (Community Manager, UX designer, Data Analyst, Product Owner…) aura fini par conforter définitivement la spécificité du métier d’intégrateur et la légitimité de son existence.

Si la flemme de lire la suite vous envahit en ce moment même, passez directement à la section “Pour résumer” un peu plus bas. Mais vous allez louper des trucs, je vous préviens.

Que fais-tu ?

Le périmètre d’intervention de l’intégrateur dépend de plusieurs paramètres :

• son profil
• son expérience
• ses envies ou affinités personnelles avec des langages, outils ou technos spécifiques,
• l’entité dans laquelle il travaille, ainsi que la taille et surtout de l’organisation de celle-ci.

Avouons-le. Le travail d’un intégrateur n’est pas tout à fait le même s’il évolue au sein d’une agence ou dans une collectivité, s’il travaille essentiellement sur un seul gros projet ou s’il travaille simultanément sur plusieurs projets de moindre envergure, et enfin si il travaille seul ou dans une équipe de production dont il est l’un des maillons.

Si le coeur du métier est bien évidemment le même pour tous, voici une liste des tâches qui va occuper un intégrateur chez Biig par exemple :

• Découpage des maquettes sous Photoshop / Sketch / Adobe XD : échanges préalables avec le webdesigner, création de font icons ou symbols svg, création des images utilisée dans la charte, récupération des fonts texte et couleurs projet
• Construction du HTML : respect de la sémantique, hiérarchisation cohérente du document, préparation logique du HTML en vue des styles et de l’animation
• Styles CSS : utilisation du préprocesseur (ou pas, ça dépend), nomenclature (OOCSS, ITCSS ou encore BEM)
• Responsive / Fluid design : prise en compte de tous les devices, media queries, mobile first
• Animation web : keyframes CSS, JavaScript, librairies JS dédiées, WebGL
• Compatibilité navigateurs : autoprefix selon les règles en vigueur, tests visuels ou automatisés
• Création de thèmes complets pour CMS Wordpress
• Automatisation de tâches de build et d’optimisation via Grunt, Gulp ou Webpack
• Création de templates d’email : intégration, tests de compatibilité, tests de délivrabilité
• Création et évolution de kits et starters avec nos bonnes pratiques pour démarrer rapidement un projet : kit css, kit javascript, kit config (linter, packages, gulpfile…), starter WordPress.

Des compétences techniques, mais pas seulement…

Des tâches transverses

L’amplitude des compétences techniques demandées pour être un intégrateur solide est assez large. Mais il faut également prendre en compte des notions plus globales et transverses que les tâches techniques citées ci-dessus.

En fonction de la typologie, de l’envergure et des besoins du projet sur lequel il travaille, l’intégrateur est également chargé de veiller au respect de :

• L’accessibilité : organisation et hiérarchie des contenus, sémantique des balises HTML, navigation au clavier, prise en compte de la synthèse vocale (standard ARIA)
• La performance : production de code organisé, découpé, propre, logique et léger
• Le SEO : respect des bonnes pratiques pour favoriser un bon référencement naturel
• La modularité et la maintenabilité de son code : organisation du code en composants, code tourné réutilisabilité

L’ensemble de ces compétences permettent d’améliorer la qualité globale du projet web (coucou Opquast), objectif qui n’est en réalité pas seulement l’affaire de l’intégrateur, mais bien de toute l’équipe projet (conseil, prod, client).

En bonus

S’il faut des compétences bien évidemment, quelques petites pincées des qualités citées ci-dessous ne sont que bienvenues :

• La rigueur : pour soi-même (si on travaille seul.e) ou pour l’ensemble des membres de l’équipe dans laquelle on travaille, l’intégrateur se doit d’avoir et de suivre des règles, des conventions, des bonnes pratiques, qui facilitent la pérennité, la maintenabilité et éventuellement une passation facilitée et sereine de son code à un autre intégrateur
• L’adaptabilité / La flexibilité : Quel que soit le type de projet, le travail de l’intégrateur doit prendre en compte et souvent anticiper à la fois les besoins et contraintes du client et ceux de l’utilisateur final du produit. Dans un environnement technique qui en découle et très souvent différent (Symfony, Angular et WordPress chez Biig), l’intégrateur doit avoir une bonne compréhension des langages utilisés par ces outils (PHP, Twig, JavaScript, Typescript pour les outils cités plus haut). Le contexte d’intégration change ainsi régulièrement, les contraintes qui lui sont liées également, obligeant l’intégrateur à s’adapter sans cesse.
• La créativité / “L’oeil graphique” : L’intégrateur a pour mission de construire et mettre à disposition du navigateur ce qu’a conçu et imaginé le webdesigner. Expliquée et décortiquée sous toutes les coutures par le webdesigner, la maquette laisse toutefois systématiquement une part d’interprétation au moment de la coder, notamment au niveau des effets liés à l’interaction utilisateur (hover, focus, click, drag & drop, scroll… et autres interactions ‘tap’ sur appareils mobiles). C’est ce que l’on va appeler l’animation d’interface. L’animation n’est pas (et ne doit pas être) une surcouche optionnelle de l’intégration. L’animation fait partie du design, c’est un outil du design. C’est d’ailleurs le langage commun du binôme intégrateur/webdesigner, ce qui lie leur travail respectif.

Pour résumer

Un intégrateur n’est pas à la base du design d’un site web ou d’une webapp. Il doit toutefois et dans l’idéal collaborer avec le webdesigner pour construire l’expérience utilisateur et élaborer la charte graphique. Comment ? Tout simplement en apportant à cette construction ses compétences techniques, sa connaissance de la “faisabilité” technique des idées du webdesigner avec qui il échange tout au long du projet.

Un intégrateur ne s’occupe pas non plus (ou très peu) des aspects fonctionnels du projet sur lequel il travaille. Si sa mission utilise les mêmes outils (framework ou cms, gestionnaire de dépendances, versionning, virtualisation des environnements de travail…) et process (méthode agile, scrum, travail en sprints, daily meetings, …) que le développeur, il va plutôt prendre en charge la mise en forme de ces fonctionnalités et du contenu associé, c’est-à-dire tout ce qui est purement visuel et visible dans le navigateur.

L’intégrateur n’est donc ni un webdesigner, ni un développeur. Il est précisément à mi-chemin entre les deux. Bien calé entre maquette et code, l’intégrateur web reste définitivement un technicien (le code reste son quotidien) doté d’une forte culture et sensibilité ergonomiques et graphiques.

L’intégrateur tient un place centrale dans la production web. Pour écarter ce qui pourrait paraître comme de l’arrogance, on ne parle non pas d’importance mais bien de position. L’intégrateur est une passerelle entre deux métiers tout aussi importants que le sien : le webdesign et le développement. Et c’est bien là la conclusion de tout ça : tous les métiers du web sont importants et se complètent. Chacun a ses spécificités et un niveau de complexité certain. Rien ne pourra résumer plus simplement cette idée que ce tweet :

Dans ma boule de cristal, je vois…

Né dans le passé, devenu légitime récemment (on parle bien du début/milieu des années 2010), le métier d’intégrateur suit actuellement encore l’évolution des langages dont il dépend. Il est donc en évolution permanente avec un avenir prometteur devant lui. En voici les raisons :

Le CSS, du bourgeon à la fleur

Si certains langages sont installés et ont les reins solides depuis longtemps (le PHP côté backend par exemple, ou encore le JavaScript qui vit actuellement une seconde jeunesse côté frontend), ça n’est pas encore le cas du CSS qui a déjà tellement changé depuis son apparition et qui continue de grandir actuellement sous nos yeux à vitesse grand V.

Pour s’adapter à son époque, le CSS se modernise et se dynamise. Si les préprocesseurs enrichissent déjà les possibilités techniques, les variables et fonctions natives pointent désormais le bout de leur nez. En parallèle, de nouvelles propriétés CSS naissent tous les jours pour répondre aux besoins techniques et aux besoins des interfaces. Enfin, l’ensemble des navigateurs, qui quoiqu’on en dise, ont un peu droit de vie et mort sur les technos web (R.I.P. Flash), tendent à uniformiser leur interprétation du langage.

Tous les feux sont au vert et tout va dans le bon sens pour que le CSS atteigne très vite le niveau de maturité des langages plus anciens 🤘.

Des sous-branches qui poussent

Les navigateurs, les utilisateurs et l’intégrateur d’aujourd’hui ne sont plus les mêmes que ceux d’il y a 10 ans, et ne seront certainement pas les mêmes dans 10 ans.

Autrefois affublé du nom de simple “monteur HTML”, le métier d’intégrateur s’est petit à petit enrichi d’autres langages (CSS, JavaScript, Actionscript et Flash à une autre époque, ou encore SVG et WebGL plus récemment) pour devenir aujourd’hui un métier polyvalent, avec des spécialisations qui s’ouvrent et poussent dans différentes directions :

1. L’accessibilité : S’il est bien de créer des sites/apps et ses contenus, il est encore mieux, voire indispensable, de le rendre accessible à tous, c’est-à-dire de prendre en compte les facultés et difficultés éventuelles des internautes (situation de handicap, daltonisme par exemple…), ou encore leur mode de consultation (navigation au clavier, lecteur d’écran pour ne citer qu’eux). On est d’accord, l’accessibilité n’est pas censée être une spécialisation mais bien au coeur de tous les métiers de la production web. Pourtant, ça n’est pas encore toujours le cas. A ce jour, seuls quelques irréductibles (de plus en plus toutefois) en font leur cheval de bataille (et ils ont raison), en attendant que tous soient convertis, de gré ou de force.
2. La qualité : Après l’éclosion d’Internet où les sites ont poussé comme des champignons, il est l’heure pour ce média de se structurer et se rationaliser un peu. La qualité web est une notion un peu plus large et transverse que l’accessibilité. Elle regroupe non seulement les principales règles d’accessibilité, mais aussi des bonnes pratiques d’ergonomie, de navigation, d’utilisation, de qualité des contenus, de performance… En France, la problématique de qualité web est mise en avant et portée depuis déjà une dizaine d’années par l’organisme Opquast et la certification “Maîtrise de la qualité web en projet web” qu’il propose. Une certification “must-have” pour un intégrateur.
3. L’animation 2D / 3D : Avec un retour en grâce du JavaScript, l’utilisation croissante du format d’image SVG, et la solidification du standard WebGL, le CSS est en train de devenir un outil puissant du design et de l’interaction utilisateur. La combinaison de tous ces langages/formats tente de répondre à une problématique à laquelle a répondu Flash pendant plusieurs années : l’animation et la fluidification de la lecture des contenus. Après un trou de 10 années sur le sujet (oui la mort de flash c’était il y a déjà longtemps), ça y est ! Tout est enfin mûr pour s’y remettre. Animons le web !

Si un intégrateur aguerri doit pouvoir être à l’aise de base dans les 3 domaines que sont l’accessibilité, la qualité et l’animation, il n’en reste pas moins vrai que ce sont encore des niches à expérimenter, creuser, développer, perfectionner et intégrer définitivement dans le coeur d’un métier toujours plus complet.

Conclusion

Appelé historiquement “Monteur HTML,” puis “Intégrateur web”, la question se pose alors de la pertinence du nom historique de ce métier, sacrément ancré dans le passé, et dont le sens n’est pas très explicite de prime abord.

Si à l’origine “Monteur HTML” s’avérait quand même être plutôt clair sur la mission associée, mais bien trop restrictif pour le métier qu’il est devenu, on peut émettre l’hypothèse que le terme d’intégrateur web semble avoir été choisi pour son formidable côté fourre-tout, un peu comme la commode dans votre entrée dans laquelle le tiroir le plus haut contient de manière très bordélique à peu près tout ce qui ne va pas dans les autres tiroirs.

Ce qui renforce cette idée est qu’intégrateur web est une spécificité française, qui n’a pas d’équivalent anglophone… assez farfelu d’ailleurs pour un domaine où tous les noms de métiers sont anglicisés par défaut.

Le passé récent a déjà donné une chance à l’intégrateur de changer de nom pour trouver quelque chose qui correspond mieux à ce qu’il fait désormais. “Développeur frontend”, ça sonne bien. En complémentarité avec le développeur backend qui s’occupe de tout ce qui se passe sous le capot, ça colle carrément bien même. Du front, du back, c’est simple et logique.

Oui mais non. Le métier de développeur se diversifie et se spécialise lui aussi. JavaScript, TypeScript, Angular, React et autres frameworks passent pas là et raflent la mise. Le développeur frontend sera désormais l’équivalent du développeur backend, non pas côté serveur mais côté client (navigateur). Au menu : MVC, web sockets, local storage, tests unitaires et fonctionnels, services workers… Intégrateurs, passez votre chemin.

Si la communauté des intégrateurs se pose déjà la question depuis quelques mois (années ?), certaines réflexions récentes et construites ont fait émerger au moins 2 appellations plutôt pertinentes :

• Frontend Designer
  Appellation la plus logique.
  Ce terme permet d’illustrer au plus juste la position de l’intégrateur. On en revient au concept de “mi-chemin entre design et développement”.
• “Frontend” rappelle sur quel aspect du projet web l’intégrateur web travaille : le front, la partie visible par l’utilisateur.
• “Designer” rappelle sa proximité avec le webdesigner et l’intérêt pour les 2 métiers de travailler et échanger régulièrement.
• UI Developer
  Appellation la + technique.
• “UI” rappelle l’interface utilisateur et directement ce sur quoi porte le travail de l’intégrateur. Par association, rappel également de son binôme UX (expérience utilisateur), ce qui crée un lien direct avec le webdesigner.
• “Developer” : parce que l’intégrateur est un technicien qui code toute la journée, dans des langages qui évoluent et se rapprochent de plus en plus de la logique de développement pur.

Et vous, vous en pensez quoi ?

Lectures complémentaires 🧐

• Les intégrateurs sont-ils des développeurs ou des webdesigners ?
  Le 02/03/2008, par Eric Le Bihan
  https://www.lesintegristes.net/2008/03/02/la-vie-des-integrateurs-chapitre-i-les-integrateurs-sont-ils-des-developpeurs-ou-des-webdesigner/
• Je ne suis pas développeur
  Le 27/01/2015, par Christophe Andrieu
  https://www.stpo.fr/blog/je-ne-suis-pas-developpeur/
• Les mots qui fâchent : intégrateur web vs. développeur frontend
  Le 22/07/2015, par Marie Guillaumet
  https://marieguillaumet.com/les-mots-qui-fachent-2-integrateur-web-vs-developpeur-front-end/
• Frontend Design
  Le 07/02/2016, par Brad Frost
  http://bradfrost.com/blog/post/frontend-design/
• Designer Frontend & Developpeur Frontend
  Le 20/09/2017, par Alexis Blondin
  https://www.alticreation.com/designer-front-end-developpeur-front-end/
• Je suis intégratrice web, et non le métier d’intégrateur web n’est pas voué à disparaître
  Le 04/01/2017 (modifié le 02/02/2019), par Julie Moynat
  https://www.lelutinduweb.fr/je-suis-integrateur-web/

Originally published at medium.com on February 21, 2019.