Quand on commence à apprendre à coder pour développer nos premiers sites, il est primordial de savoir s’entourer d’un IDE (Integrated Development Environment) simple, clair et efficace.

Oui, nous pouvons très bien utiliser les grands classiques comme Bloc-notes sur Windows ou TextEdit pour les Mac… mais à quels outils les coupler à des fins plus performantes ? Lors d’un précédent article, j’avais souligné les avancées du HTML5 avec la sortie de ses dernières fonctionnalités et ce qu’elles peuvent apporter. En dépit de toutes ces nouvelles fonctionnalités et de la création de normes autour du W3C, à chaque navigateur son fonctionnement… ce qui crée un paysage disparate pour les développeurs.

Nous avons tous un navigateur de prédilection, mais tous les essayer nous permet de tester notre site internet dans tous les sens, non pas juste par acquit de conscience, mais surtout parce qu’il faut que ça fonctionne. Naturellement, Google Chrome et Mozilla Firefox figurent dans le classement des plus complets sur le marché. En fonction de ce que vous avez développé, ou que vous souhaitez faire développer, il est intéressant de faire les recettes sur une variété de vieilles versions de navigateurs classiques. À quoi bon s’intéresser aux versions antérieures ? Tout simplement parce que tout le monde n’a pas les dernières versions en date. Pour véritablement tester votre site dans des conditions réelles, il existe des outils de virtualisation comme Microsoft Windows Virtual PC, Oracle VM et bien d’autres. Grâce à ces outils, vous pourrez profiter d’un vrai navigateur par défaut, et observer les comportements de votre site.

IDE Integrated Development Environment

Comme vous ne pourrez pas installer tous les navigateurs avec les versions passées et présentes sur votre machine, je vous conseille vivement de passer par des sites spécialisés comme https://browsershots.org pour commencer.

Lorsque vous allez développer un site, et que vous ne passerez plus uniquement par Bloc-notes ou TextEdit, voici quelques critères pour vous aider à passer en 100% IDE via des logiciels spécialisés dans le développement.

Le premier, et pas des moindres, c’est la coloration syntaxique pour la reconnaissance automatique des balises, attribut, propriétés ou fonctions. Cela permettra d’identifier la structure des codes sources en s’abîmant moins la rétine. Pour le second, un peu comme le logiciel Microsoft Word qui propose des corrections orthographiques, vous pourrez retrouver des suggestions automatiques de code avec la possibilité de les compléter. Cela permet de gagner du temps, mais de minimiser les coquilles ou les erreurs. L’auto-indentation du code est une autre particularité qui favorise une meilleure arborescence des balises, très utile pour indenter automatiquement du code CSS ou HTML5 (notamment sur NotePad++ ou SublimeText3). Ces quelques exemples des caractéristiques récurrentes de logiciels spécialisés dans le développement ont pour but de faire gagner du temps aux développeurs, mais aussi d’éviter de faire d’incessants allers-retours entre les feuilles de style et les pages web.

Pour ceux qui aiment bien voir en direct ce qu’ils sont en train de coder, pour les plus impatients en somme, il est conseillé de passer par Wysiwyg (What You See Is What You Get) ou bien par Adobe Dreamweaver qui est le plus connu des deux. Ces deux logiciels de création existent pour ceux qui ont besoin d’être d’avantage épaulé dans leur développement.

Pour résumer, si vous souhaitez adopter un environnement IDE, il est important de développer votre site sur un éditeur qui compile les critères énoncés plus haut, vous permettant de gagner en efficacité. Ensuite, vous pourrez passer à la moulinette votre travail sur un simulateur suffisamment performant.