Pour créer un site web, modifier le code d’un fichier WordPress ou créer une application web vous aurez probablement besoin d’un éditeur HTML pour éditer vos fichers HTML, mais aussi les CSS et les fichiers Javascripts ou JSx par exemple.
Vous avez ainsi deux choix d’éditeurs possibles :
Les éditeurs HTML WYSIWYG, “What you see is what you get”, ce que vous voyez est ce que vous obtenez. Ce genre d’éditeurs nécessite peu ou pas de connaissances en informatique, mais ils sont un peu passés de mode et surtout limitant en terme de création de site.
Les éditeurs de code. Ces IDE affichent le code HTML, CSS et JS du site ou de l’application d’un côté et de l’autre, le rendu est obtenu sur un navigateur web grâce à un serveur local. C’est la solution la plus utilisée et de loin aujourd’hui. De nombreuses extensions existent pour faciliter le travail du programmeur, comme : le Live Reload permettant de rafraîchir les pages à chaque modification ou à chaque sauvegarde, la coloration syntaxique, l’autocomplétion et des raccourcis d’écriture avec EMMET, pour ne citer que ces exemples.
Pour une plus grande maîtrise du code, je vous conseille donc vivement d’utiliser les IDE (environnements de travail intégrés) présentés dans la première partie.
1- Les meilleurs éditeurs de code gratuits (IDE).
Profitez pleinement de toutes les possibilités offertes par les éditeurs modernes présentés ci-dessous :
Visual Studio Code : C’est l’IDE de microsoft que j’utilise et probablement la plus utilisée dans le monde. En plus d’être gratuit et disponible sur toutes les plateformes, Visual Studio Code offre une multitude d’extensions qui vont changer votre vie de programmeur. Parmi celles-ci, on peut noter : accès directs à plusieurs terminaux simultanément, emmet d’origine ainsi que l’auto-complétion bien sûr, l’enregistrement automatique, le live reload, un serveur local. Que vous travailliez avec React, angular, Vue ou Svelte, il existe toujours au moins une extension pour vous.
De plus vous pourrez l’utiliser pour programmer dans d’autre langages informatiques et leurs frameworks (python et Django, C, C++, Ruby, ….). Cet éditeur a été créé avec électron JS, il utilise WebKit le moteur de rendu de chroome pour fonctionner d’où la facilité de création de Plugins et l’intérêt qu’il a suscité. Bref, une petite merveille gratuite. Un must pour tout programmeur.
Sublime Text 2 et Sublime Text 3 ne sont pas des éditeurs HTML entièrement gratuits, mais les possibilités qu’ils offrent dans leurs version de démonstration sont absolument bluffantes. Cet éditeur dans ses deux versions, offre toutes les options d’auto-complétion, d’écriture rapide disponible. Longtemps leader des IDE, il est maintenant supplanté par Visual Studio Code. Néanmoins, de nombreux professionnels utilisent toujours cet éditeur pour tous les langages de programmation. La version 3 est en préparation. C’est aussi un must de la programmation.
Brackets est l’éditeur de code HTML d’adobe. Rapide et très complet, grâce à ses plugins, il vous apportera une facilité de création digne des meilleurs payants comme sublime texte. Avec brackets vous aurez accès à l’auto-complétion, la fermeture des balises automatiques, l’écriture rapide avec emmet (ancien zendcoding) et bien d’autres extensions de gestion de projets. Encore un must. (J’ai l’impression de me répéter… )
Atom développé par Github, est une IDE qu’utilisent de nombreux développeurs. “Atom, l’éditeur hackable”, tel est le slogan du site des créateurs. Atom est donc paramétrable à souhait. Certains l’adorent, essayez-le et vous serez peut-être séduit.
Komodo fait partie des poids lourds des éditeur HTML du web. Komodo edit est gratuit contrairement à Komodo IDE. Les possibilités offertes font pléthores. Emmet est disponible pour Komodo ainsi que de nombreuses autres possibilités. Une pointure parmi les éditeurs html.
Aptana Studio correspond à la version web d’éclipse, l’IDE très connue pour java. Grâce à ses nombreux plugins, vous avez accès à toutes les possibilité d’une IDE web. Il est également possible de faire du développement mobile hybrides avec aptana studio et appaccelerator (titanium).
Notepad++ un éditeur HTML très léger, mais très rapide, pour éditer les fichiers. Pour moi c’est l’éditeur idéal pour faire des modifications rapide dans un fichier sans avoir à lancer l’armada des gros éditeurs. Il offre tout de même de nombreuses possibilités et peut être une solution simple à adopter pour de nombreux langages.
NetBeans est un éditeur de code généraliste particulièrement adapté à HTML, CSS, PHP et Java. Il offre des outils puissants comme l’autocomplétion et tout un tas d’aide à la création de code. Le revers de la médaille, c’est que netBeans est parfois lent. Par ailleurs, certaines fonctionnalités simples, comme changer l’encodage peuvent se révéler complexes. Pour les gros projets, Netbeans semble mieux convenir alors que notepad++ est peut-être plus adapté au petit projets. C’est une question de goûts et d’habitudes. Pour ma part, j’utilise les deux.
Arachnophilia, un éditeur de HTML sympa, à posséder également. Peut tourner avec java, pour un multiplatformes.
A noter pour terminer qu’il existe un plugin de l’IDE Eclipse, pour les habitués de cette interface, spécialement conçu pour le HTML. Ce plugin peut se télécharger ici : Eclipse HTML Editor.
2- Les meilleurs éditeurs WYSIWYG gratuits.
Ces IDE ne sont à choisir que si on ne connaît rien en programmation web et si on se souhaite rien apprendre (fainéant, va bosser… ). D’ailleurs, la plupart de ces projets ne sont plus mis à jour. Préférez donc les IDE de la première partie.
- Les éditeurs HTML spécifiques.
Il existe beaucoup d’éditeurs HTML disponibles sur le Web, de qualités très différentes et de prix très variés. Si Dreamweaver est probablement un des meilleurs, c’est aussi un logiciel très cher.
Les éditeurs html wysiwyg gratuits sont peu nombreux et sont pour la plupart assez anciens. Néanmoins, Voici donc une petite sélection d’éditeurs HTML gratuits :
BlueGriffon est un éditeur HTML wysiwyg moderne plein de ressources. Il gère la majorité des éléments HTML5 ce qui est rare pour un freeware. A tester.
NVU, l’éditeur HTML de Mozilla. Sans doute un des meilleurs freeware de sa catégorie même s’il n’est pas très récent. Simple à utiliser, il est très performant sur les tableaux.
KompoZer, c’est le petit ou le grand frère de NVU (fork). Ils ont le même coeur. Donc sont assez équivalents.
OpenElement, encore un éditeur HTML WYSIWYG de qualité en français pour n’importe quel type de site.
Amaya, est un bon éditeur HTML open source, respectant les normes W3.
Enfin, des éditeurs HTML un peu spéciaux :
HTML-Kit (barre d’outil de création pour navigateurs)
- Les éditeurs HTML non-spécifiques.
Les traitements de texte peuvent également servir pour créer du code HTML, mais ce n’est pas leur fonction première. Il suffit d’enregistrer vos pages au format HTML tout en insérant des liens Hypertexte dans vos pages. Les puristes diront avec raisons, que les standards du html ne sont pas respectés et que les erreurs sont fréquentes. Mais c’est un moyen extrêmement rapide de réaliser des pages HTML. Vous connaissez les principaux traitement de texte : Open office - Libre Office ou Word.
j’espère que vous cet article vous a permis d’avancer dans votre démarche. A bientôt sur Outils-web.fr