Note de l’éditeur: cet article a été publié à l’origine en mars 2016 et mis à jour pour refléter les modifications apportées à certains des outils initialement recommandés.

Il n’y a pas si longtemps, presque toutes les pages Web sur Internet étaient soigneusement conçues à la main d’une manière ou d’une autre. C’était difficile, et avant que CSS ne prenne vraiment de l’ampleur et soit bien pris en charge dans la plupart des principaux navigateurs, une mise en page devait souvent être piratée en utilisant des tableaux HTML d’une manière qu’elle n’avait jamais l’intention de prendre en charge.

Alors que certains concepteurs ont développé des flux de travail entièrement basés sur l’édition manuelle de fichiers HTML bruts, l’éditeur WYSIWYG (ce que vous voyez est ce que vous obtenez) a été conçu pour des millions de concepteurs amateurs et professionnels qui ne savaient pas ou qui ne savaient pas l’outil d’activation. Au moins, il n’avait pas maîtrisé l’art du balisage hypertexte.

Des produits tels que CoffeeCup, HotDog, FrontPage, GoLive et bien d’autres ont envahi le marché, et de nombreux éditeurs WYSIWYG basés sur le Web ont également émergé. L’un des plus réussis a été Macromedia (plus tard Adobe) Dreamweaver, qui a été l’un de mes favoris personnels pendant de nombreuses années.

Ces outils de création Web ne concernaient pas seulement l’édition WYSIWYG. Même pour ceux qui sont familiers avec l’écriture directe du langage de balisage, ces outils ont fourni des avantages en matière de contrôle de modèle, de gestion de fichiers et de réduction du temps nécessaire à la création du code de fonction.

Mais tout comme ces éditeurs utiles ont élargi leur accès à la création de pages Web, quelque chose d’autre s’est produit aussi. Les systèmes de gestion de contenu comme Drupal et WordPress (et bien d’autres avant eux) ont supplanté la nécessité pour le producteur de contenu moyen de même éditer du HTML brut. Vous pouvez facilement créer un site Web fonctionnel sans vous soucier du balisage sous-jacent.

La montée en puissance du système de gestion de contenu a-t-elle changé le Web? Absolument. Cela a-t-il éliminé le besoin de passer du HTML? Eh bien, pour certaines personnes, oui. Cependant, avec le passage du Web d’une collection de contenu à une plate-forme d’applications, il y a eu autant de nouvelles opportunités de balisage. Tout logiciel en tant qu’application de service, réseau de médias sociaux et même de nombreuses applications mobiles utilisent HTML et CSS pour afficher leur annonce. Et ces systèmes de gestion de contenu? Vous avez toujours besoin de modèles pour fonctionner.

Et bien qu’il existe de nombreuses bibliothèques utiles pour normaliser et simplifier le processus de développement Web, le codage pour le Web ne bouge pas de sitôt. Les outils propriétaires sont encore courants, mais il existe une vaste collection d’alternatives open source. En voici quelques-uns à considérer.

1. BlueGriffon

BleuGriffon est un éditeur WYSIWYG open source alimenté par Gecko, le moteur de rendu développé pour Mozilla Firefox. BlueGriffon est l’un des rares dérivés de NVU, un éditeur HTML qui a depuis été abandonné. C’est le seul dérivé NVU développé activement qui prend en charge HTML5 ainsi que les composants modernes de CSS. Si vous voulez écrire le moins de HTML possible, BlueGriffon est l’outil de choix. C’est un véritable concepteur de site Web WYSIWYG par glisser-déposer et comprend même une option de double vue afin que vous puissiez voir le code derrière votre conception au cas où vous voudriez le modifier ou simplement en tirer des leçons.

Il prend également en charge le format de livre électronique EPUB afin que vous n’ayez pas simplement à publier sur le Web: vous pouvez fournir à vos lecteurs un téléchargement de votre contenu pour qu’ils l’emportent avec eux. Une version de BlueGriffon sous licence MPL, GPL et LGPL est disponible pour Linux, Windows et Mac.

2. Aptana Studio

Studio Aptana est un « outil de développement open source pour le web ouvert », ce qui signifie en pratique qu’il s’agit davantage d’un IDE avancé spécialisé dans le développement web. Basé sur le projet open source Eclipse, Aptana Studio fournit des outils pour prendre en charge la création HTML et CSS, y compris la coloration et la complétion de code, le débogage et la structuration de documents. Le principal argument de vente est le support JavaScript qui en fait un outil puissant pour développer des applications Web plus complexes.

3. NetBeans

NetBeans est une plate-forme de développement de logiciels largement utilisée pour créer des applications Web, mobiles et de bureau à l’aide de Java, JavaScript, HTML5, etc. Il est soutenu par Oracle (et son prédécesseur Sun) depuis 1999 et transféré à la Fondation Apache pour la gouvernance ouverte et les contributions de la communauté simplifiées et rationalisées en octobre 2016. Pas exactement une application de conception Web par glisser-déposer, Netbeans est un IDE Web robuste. C’est un excellent choix si vous développez des applications Web ou appréciez simplement la programmation pour le Web.

4. SeaMonkey

Singe de mer est une suite communautaire à une suite d’applications Internet autrefois produite par Mozilla. Alors que Mozilla a choisi de se limiter à des projets individuels, SeaMonkey continue de publier régulièrement toute sa suite, y compris Compositeur SeaMonkey, un simple éditeur HTML WYSIWYG. Avec Composer, vous avez des difficultés à créer des mises en page avancées (par exemple, vous ne pouvez pas personnaliser le CSS affichage ou propriété pour créer une paire de texte et d’images à deux colonnes, mais devrait utiliser une table qui ne répond pas à la place. Cependant, pour les pages de base avec zéro code écrit, c’est une option réaliste.

5. Éditeur Aloha

Éditeur Aloha est un éditeur HTML5 WYSIWYG basé sur JavaScript qui permet aux utilisateurs de modifier le contenu dans la même mise en page que celle affichée par les lecteurs. Il s’agit d’un modèle assez unique en ce qu’il n’est pas exactement une application en soi, mais intègre plutôt un éditeur dans votre page HTML. Il en faut un Node.js Donc, à moins que vous ne soyez un développeur familier avec Javascript, la configuration peut être délicate. Cependant, si vous êtes un administrateur de site à la recherche d’une interface d’édition simple permettant à vos utilisateurs de mettre à jour rapidement leurs pages, dites aloha « aloha ».

6. WordPress

Le service de gestion de contenu Open Source (CMS) et la plateforme de blogs WordPress offrent une interface de mise en page structurée mais flexible. Vous pouvez créer des articles et des pages de blog avec juste assez de flexibilité pour libérer votre créativité et avec juste assez de contraintes pour vous assurer que votre création s’affichera correctement dans tous les navigateurs. WordPress vous permet de choisir le niveau de complexité que vous souhaitez à chaque étape. Vous pouvez l’héberger vous-même en utilisant le leur célèbre installation de 5 minutes Méthode, ou vous pouvez acheter un hébergement auprès de WordPress.com. Vous pouvez utiliser le concepteur glisser-déposer pour créer des pages, ou vous pouvez pirater vous-même le HTML et le PHP. Vous pouvez choisir un thème ou un design et créer le vôtre. C’est une excellente ressource pour tous ceux qui cherchent à gérer un site Web.

7. Essayez un éditeur de texte avancé

Un certain nombre d’éditeurs de texte, bien que pas nécessairement les meilleurs pour les débutants, offrent des fonctionnalités supplémentaires qui sont incroyablement utiles pour éditer des documents HTML / CSS. Si vous travaillez côte à côte avec un navigateur moderne avec des outils de débogage intégrés, vous pourriez être aussi productif avec l’un de ces outils qu’avec une solution plus dédiée. Certains de nos favoris sont:

  • atome se décrit comme un « éditeur de texte piratable pour le 21ème siècle ». Il a été développé par GitHub et prêt à l’emploi, il prend en charge HTML et CSS ainsi que de nombreux plugins supplémentaires.
  • Supports est un éditeur de texte basé sur JavaScript développé par Adobe pour la conception Web et le développement frontal. Il offre des fonctions pour l’éditeur en ligne, l’aperçu en direct et la prise en charge du préprocesseur pour simplifier la conception Web dans le navigateur.
  • Vigueur ou Emacs. Sans participer à la guerre sainte entre ces deux éditeurs de texte traditionnels, je peux affirmer avec certitude qu’un certain nombre d’améliorations d’édition Web sont disponibles pour les deux. Si vous êtes déjà accro aux terminaux, faites votre choix. Ou, si ceux-ci ne sont pas satisfaits, essayez l’un d’entre eux Alternatives Emacs / Vim.

L’une de ces solutions est-elle une réplique fonctionnalité par fonctionnalité de Dreamweaver ou d’un autre outil propriétaire? Bien sûr que non. Ils n’étaient pas faits pour ça. Ils ont chacun leur propre feuille de route et leurs objectifs, ainsi que leurs propres forces et faiblesses. La conception Web est un grand monde avec de nombreuses utilisations et approches. Prenez le temps de trouver le flux de travail qui répond à vos besoins. Essayez un nouvel outil, voyez ce que vous aimez et ce que vous n’aimez pas, et partagez vos commentaires avec l’ensemble de la communauté dans les commentaires.

Souhaitez-vous lire plus d’articles comme celui-ci? Inscrivez-vous à notre newsletter hebdomadaire par e-mail.



Source link

Recent Posts