HTML First

 (html-first.com)
2 points par GN⁺ 2023-11-13 | 1 commentaires | Partager sur WhatsApp

Présentation des principes de HTML First

  • Exploiter les fonctionnalités natives des navigateurs web modernes
  • Tirer parti de l’extrême simplicité de la syntaxe des attributs HTML
  • Exploiter la fonction View Source du web

Objectifs de HTML First

  • Élargir le nombre de personnes capables de travailler sur une base de code de logiciel web
  • À titre personnel, permettre à davantage de personnes de devenir programmeurs web et d’augmenter leurs revenus
  • Du point de vue métier, réduire les coûts de développement logiciel et économiser les ressources de recrutement

Deuxième objectif de HTML First

  • Rendre le développement de logiciels web plus agréable et plus fluide
  • Au lieu de passer des années à maîtriser des outils et des frameworks, atteindre rapidement un bon niveau grâce aux principes de HTML First

Comment mettre en œuvre HTML First

  • Reconnaître que HTML est facile à comprendre et l’utiliser comme base non seulement pour définir le contenu et la structure, mais aussi pour le style et le comportement

Principe : privilégier l’approche Vanilla

  • Utiliser des attributs HTML pour le style et le comportement
  • Utiliser des bibliothèques qui s’appuient sur les attributs HTML
  • Éviter les étapes de build
  • Préférer le HTML « nu »
  • Utiliser une approche compatible avec View Source

Exploiter les fonctionnalités prises en charge nativement par le navigateur

  • Obtenir les fonctionnalités via une approche « vanilla » plutôt qu’avec des frameworks externes
  • Vérifier ce qu’il est possible de faire en HTML/CSS pur avant d’ajouter une bibliothèque ou un framework

Définir le style et le comportement avec des attributs HTML

  • Le style peut être géré avec des bibliothèques SPC comme Tailwind ou Tachyons
  • Pour le comportement, utiliser des bibliothèques comme hyperscript ou Alpine
  • Le HTML peut sembler complexe, mais il est plus facile à comprendre et à modifier pour d’autres développeurs

Utiliser des bibliothèques qui exploitent les attributs HTML

  • Il est recommandé d’utiliser des bibliothèques qui tirent parti des attributs HTML plutôt que des bibliothèques centrées sur JavaScript ou sur une syntaxe personnalisée

Éviter les étapes de build

  • Les bibliothèques qui exigent une transformation des fichiers augmentent la charge de maintenance et nuisent à la fonction View Source
  • Avec des bibliothèques HTML First, le besoin de CSS et de JS supplémentaires est minimisé

Préférer le HTML « nu »

  • Principe particulièrement applicable aux implémentations backend
  • Un développeur familier de HTML peut comprendre les fichiers de vue même sans connaître le framework backend

Préserver la fonction View Source

  • L’un des charmes du web des débuts était de pouvoir « jeter un œil » au code et comprendre une partie d’une page web
  • Les sites qui suivent les principes de HTML First permettent de retrouver la fonction View Source

Conclusion

  • Les pratiques et principes décrits sur ce site restent encore minoritaires dans l’ensemble du secteur
  • L’objectif est de trouver et de mettre en relation des personnes qui partagent ces idées

L’avis de GN⁺

Le point le plus important de cet article est l’introduction des principes HTML First pour améliorer l’accessibilité et la maintenabilité du développement web. Ces principes rendent le développement web plus simple et plus rapide, tout en permettant à davantage de personnes de participer à la programmation web, ce qui profite à la fois aux individus et aux entreprises. Cette approche est intéressante car elle peut réduire la complexité du développement web, améliorer la lisibilité du code et favoriser le partage des connaissances ainsi que la collaboration au sein de la communauté des développeurs.

À lire aussi

1 commentaires

 
GN⁺ 2023-11-13
Avis Hacker News
  • En théorie et dans des exemples simples, c’est intéressant, mais il faudrait des cas concrets montrant comment ces principes s’appliquent à de grands projets et en quoi ils font une différence.
  • Je suis favorable à exploiter au maximum la plateforme web et à réduire la complexité, mais je reste sceptique sur le fait que les principes proposés réduisent réellement cette complexité.
  • Utiliser les fonctionnalités de base de HTML est une bonne chose, mais ce n’était déjà pas pratique il y a dix ans et ça ne l’est toujours pas aujourd’hui ; je n’ai pas l’impression que htmx soit meilleur que des solutions plus lourdes comme React.
  • Lorsqu’on implémente des fonctionnalités comme des menus déroulants, des sélections multiples ou des sélecteurs de date, le manque de cohérence entre navigateurs et les limites de stylisation font que les éléments HTML natifs ne suffisent pas.
  • Les exemples sont faibles, et définir le style et le comportement via des attributs HTML inline peut devenir complexe.
  • Quand on utilise les bibliothèques nécessaires, je suis d’accord avec l’idée de privilégier des bibliothèques qui s’appuient sur des attributs HTML plutôt que sur du JavaScript ou une syntaxe personnalisée.
  • Cette philosophie convient bien au développement d’une plateforme SaaS construite uniquement avec du balisage HTML.
  • Cela ressemble à un anti-pattern proposé par quelqu’un qui n’a jamais traversé le processus de construction d’un site web complexe, et à un mauvais conseil.
  • Je suis d’accord avec l’idée que l’utilisateur devrait pouvoir comprendre en affichant le code source, mais pour les applications web, il est souhaitable d’utiliser un langage typé.
  • La « localité du comportement » est une règle vaguement définie qui va à l’encontre de la séparation des préoccupations, et qualifier le CSS d’« action effrayante à distance » est une formulation exagérée.