Soudainement, votre bon sens va s'effondrer aujourd'hui. Honnêtement, 99 % des gens utilisent encore Markdown avec Claude Code. Ce qu'un initié de l'équipe Claude Code d'Anthropic a dit, c'est : « Arrêtez ça. » Il a déclaré : « C'est infiniment mieux de produire en HTML plutôt qu'en Markdown. »
Parce qu'à mesure que les sorties de Claude Code deviennent plus avancées, le Markdown est difficile à lire, ne parvient pas à transmettre l'information et n'est pas partagé.
En revanche, avec le HTML :
- Vous pouvez illustrer
- Vous pouvez coder par couleur
- Vous pouvez organiser avec des onglets
- Vous pouvez même créer des curseurs et des boutons
- Vous pouvez partager directement dans le navigateur
En d'autres termes, pour révéler la véritable valeur de Claude Code, ce n'est pas seulement « ce que vous produisez » mais « le format dans lequel vous produisez » qui devient incroyablement important.
Je l'affirme.
La solution optimale à l'ère de Claude Code n'est pas seulement le Markdown, mais le HTML en premier lieu.
En fait, avant même la publication de cet article, ClaudeCodeStudio utilisait déjà cette méthode, garantissant que les supports de présentation sortent avec cette qualité en un seul essai 👇
Si vous lisez cet article jusqu'au bout, je pense que vous comprendrez pourquoi c'est possible, alors n'hésitez pas !
Au fait, avez-vous déjà vécu une expérience comme celle-ci ?
- Vous avez demandé à Claude Code d'écrire un plan, mais vous avez perdu tout intérêt après qu'il a dépassé les 100 lignes.
- Vous avez partagé une spécification Markdown avec l'équipe, mais personne ne l'a lue jusqu'au bout.
- Vous avez regardé un diagramme en art ASCII et vous vous êtes dit : « …C'est quoi, ça ? »
- Vous vouliez organiser l'information avec des couleurs ou des mises en page, mais vous n'avez pas pu l'exprimer en Markdown.
- Vous avez collé un plan dans Slack, mais il a été enterré comme une pièce jointe.
Tout cela était un « problème de format de sortie. »
Un article intitulé « Using Claude Code: The Unreasonable Effectiveness of HTML » écrit par Thariq (@trq212), un membre de l'équipe de développement de Claude Code, est actuellement viral sur X avec plus de 11 millions de vues 😳
Thariq est membre de l'équipe Claude Code chez Anthropic et un ingénieur de YC W20. En d'autres termes, c'est un article où quelqu'un qui utilise Claude Code au quotidien en première ligne a déclaré : « J'ai arrêté d'utiliser le Markdown. »
Cette fois-ci, je vais expliquer le contenu de manière facile à comprendre, y compris des exemples de prompts spécifiques 👇
Article original ici : https://x.com/trq212/status/2052809885763747935
■ Quel est le problème avec le Markdown ?
Le Markdown est utilisé depuis des années comme moyen de communication entre les agents IA et les humains. C'est simple, utilisable partout, et permet d'écrire du texte enrichi dans une certaine mesure. Claude Code, bien sûr, produit par défaut en Markdown.
Mais honnêtement, cela ne vous dit-il rien ?
À mesure que Claude Code devient capable de gérer des tâches plus complexes, les plans et spécifications qu'il produit s'allongent. Lisez-vous vraiment un fichier Markdown de plus de 100 lignes jusqu'au bout ?
Thariq écrit dans l'article :
« Je trouve difficile de lire un fichier Markdown de plus d'une centaine de lignes. »
De plus, de nos jours, nous éditons nous-mêmes les fichiers de moins en moins souvent. Nous les utilisons comme références pour des spécifications ou comme sorties pour du brainstorming. Même lors de l'édition, nous demandons à Claude de « corriger ceci ». En d'autres termes, le plus grand avantage du Markdown — le fait qu'il soit « facile à éditer à la main pour les humains » — n'a plus de sens.
Cela verbalise brillamment un problème que de nombreux utilisateurs de Claude Code ressentaient inconsciemment.
■ Pourquoi l'option HTML est « déraisonnablement efficace »
Ce que propose Thariq, c'est de changer le format de sortie de Claude Code du Markdown vers le HTML.
Vous pourriez penser : « Le HTML, ce n'est pas pour faire des pages web ? » Mais la puissance d'expression du HTML est incomparable à celle du Markdown.
Regardons ce qui peut être spécifiquement exprimé avec le HTML :
- Données structurées à l'aide de tableaux
- Design et coloration à l'aide de CSS
- Illustrations et diagrammes à l'aide de SVG
- Extraits de code à l'aide de balises script
- Interaction à l'aide de JavaScript et CSS
- Diagrammes de flux combinant SVG et HTML
- Données spatiales à l'aide de positionnement absolu ou de canvas
- Intégration d'images à l'aide de balises image
Thariq affirme :
« J'irais jusqu'à dire qu'il n'y a presque aucun ensemble d'informations que Claude peut lire que vous ne puissiez pas représenter assez efficacement avec du HTML. »
Quiconque a essayé de faire dessiner un diagramme ASCII à Claude ou d'exprimer des couleurs avec des caractères Unicode comprendra le poids de ces mots. Vous serez libéré de cette inefficacité, comme « conduire une Ferrari jusqu'à une supérette. »
■ La densité d'information est radicalement différente
La plus grande force du HTML est la « densité d'information. »
Lorsque le même contenu est écrit en Markdown et en HTML, le HTML peut transmettre beaucoup plus d'informations de manière beaucoup plus lisible. Vous pouvez basculer avec des onglets, coder par couleur ou intégrer des diagrammes.
Même si vous n'avez pas envie de lire 100 lignes de Markdown, la même quantité d'informations organisée avec des onglets et des couleurs en HTML vous rentrera directement dans la tête.
Ce n'est pas juste une « question d'apparence. » Une spécification qui n'est pas lue équivaut à une spécification qui n'existe pas. Produire dans un format qui est lu est directement lié à la qualité du travail lui-même.
■ Facilité de partage
Lorsque vous essayez de partager un fichier Markdown avec quelqu'un, cela se passe généralement comme ceci :
- Joindre comme fichier dans Slack → Personne ne l'ouvre
- Joindre à un e-mail → Personne ne l'ouvre
- Le mettre sur GitHub → Les non-ingénieurs n'y ont pas accès
Avec le HTML, il suffit de le télécharger sur S3 et d'envoyer un lien. Toute personne disposant d'un navigateur peut le lire. Vous pouvez même le rendre responsive pour qu'il soit lisible sur mobile.
Texte original de Thariq :
« La probabilité que quelqu'un lise réellement votre spécification, rapport ou résumé de PR est bien plus élevée si c'est en HTML. »
C'est un point subtil mais d'une importance cruciale dans la pratique.
■ La révolution de l'interaction bidirectionnelle
C'est là que le HTML brille vraiment.
Le HTML n'est pas seulement quelque chose à « lire. » Il peut être manipulé.
Par exemple, l'ajustement fin d'un design. Si vous demandez à Claude Code de « créer un fichier HTML avec un curseur », il produira un fichier où vous pourrez ajuster la vitesse d'animation, l'assouplissement et les couleurs en temps réel. Une fois que vous avez trouvé les paramètres qui vous plaisent, il vous suffit d'appuyer sur un bouton « copier » et de les coller dans Claude Code.
Cette interaction bidirectionnelle permet des ajustements avec un niveau de précision que les invites textuelles seules ne pourraient jamais atteindre.
Vous êtes libéré du stress de devoir transmettre « un peu plus à droite », « un peu plus vite » ou « pas cette couleur » avec des mots. Il vous suffit de déplacer le curseur.
■ Cas d'utilisation spécifiques (avec exemples de prompts)
Dans l'article, Thariq présente des modèles d'utilisation du HTML avec des exemples de prompts spécifiques. Ceux-ci sont si pratiques que je vais les présenter tels quels.
𝟭. Design, Planification et Exploration
Lorsque vous travaillez sur des tâches complexes dans Claude Code, au lieu d'un seul plan Markdown, utilisez plusieurs fichiers HTML pour jeter un « filet d'exploration. »
Exemple de prompt :
« Je n'arrive pas à décider dans quelle direction aller pour l'écran d'onboarding. Génère 6 approches complètement différentes, en variant la mise en page, le ton et la densité, et dispose-les dans une grille dans un seul fichier HTML pour que je puisse les comparer. Écris les compromis pour chacune sur des étiquettes. »
« Crée un plan de mise en œuvre détaillé dans un fichier HTML. Inclus des maquettes, des flux de données et des extraits de code importants à examiner. Rends-le lisible et facile à digérer. »
𝟮. Révision et Compréhension du Code
Vous pouvez créer des révisions de code plus faciles à lire que l'écran de diff de GitHub.
Exemple de prompt :
« Crée un artefact HTML pour réviser cette PR. Je ne suis pas familier avec la logique de streaming/backpressure, alors concentre-toi là-dessus. Affiche le diff réel avec des annotations de marge en ligne, codées par couleur selon l'importance. »
Thariq écrit : « Maintenant, je joins une explication de code au format HTML à chaque PR. »
𝟯. Design et Prototypage
Tout comme le fondement de Claude Design est le HTML, le HTML est extrêmement bon pour l'expression du design. Même si l'implémentation finale est en React ou Swift, un flux de travail consistant à esquisser d'abord en HTML puis à réécrire est efficace.
Exemple de prompt :
« Je veux faire un prototype pour un nouveau bouton de paiement. Il doit s'animer et devenir violet lorsqu'on clique dessus. Crée un fichier HTML où je peux essayer chaque paramètre d'animation avec des curseurs et des options. Inclus un bouton pour copier les paramètres qui ont bien fonctionné. »
𝟰. Rapports, Recherche et Apprentissage
Claude Code est doué pour synthétiser des informations provenant de plusieurs sources de données et les résumer dans un rapport lisible. Vous pouvez lui demander de rechercher dans Slack, la base de code, l'historique Git et Internet pour créer des rapports de direction ou des rapports d'incident.
Exemple de prompt :
« Je ne comprends pas comment fonctionne le limiteur de débit. Lis le code pertinent et crée une page d'explication HTML. Inclus un diagramme de flux de seau à jetons, 3-4 extraits de code importants avec annotations, et enfin une section « pièges ». Optimise-la pour que je puisse la comprendre en une seule lecture. »
𝟱. Interfaces d'Édition Personnalisées
C'est le cas d'utilisation qui m'a le plus choqué personnellement. Réaliser des opérations difficiles à transmettre dans une zone de texte avec un éditeur HTML jetable.
Exemple de prompt :
« Je veux réorganiser la priorité de 30 tickets Linear. Crée un fichier HTML où chaque ticket est une carte déplaçable et place-les dans quatre colonnes : Maintenant / Ensuite / Plus tard / Supprimé. Organise-les initialement en fonction de ton estimation. Inclus un bouton « Copier en Markdown » pour exporter l'ordre final avec une ligne de raisonnement pour chaque catégorie. »
« J'ajuste ce prompt système. Crée un éditeur côte à côte. À gauche, un prompt modifiable (mettant en évidence les emplacements de variables), et à droite, trois exemples d'entrées pour que le modèle se reflète en temps réel. Inclus un compteur de caractères/tokens et un bouton de copie. »
Cette idée n'est-elle pas incroyable ? Générer l'interface utilisateur nécessaire sur le moment, juste pour cette tâche. Elle n'a pas besoin d'être réutilisée. Elle n'a pas besoin d'être parfaite. Mais elle est 100 fois plus efficace que de le faire avec du texte seul.
■ Réponses aux questions courantes
Dans l'article, Thariq répond également aux questions courantes sur le HTML.
« N'est-ce pas inefficace en termes de tokens ? »
→ Il est vrai que cela utilise plus de tokens que le Markdown. Mais compte tenu de la puissance d'expression et de la « probabilité d'être réellement lu », c'est efficace dans l'ensemble. Avec le contexte d'un million de tokens d'Opus 4.7, l'augmentation est à un niveau qui n'a pas d'importance.
« Est-ce que cela ne prend pas du temps à générer ? »
→ Cela prend 2 à 4 fois plus de temps que le Markdown. Mais Thariq lui-même estime que le résultat en vaut la peine.
« Qu'en est-il du contrôle de version ? »
→ C'est honnêtement un inconvénient. Les diffs HTML ont plus de bruit que le Markdown et sont plus difficiles à réviser. Actuellement, c'est l'une des plus grandes faiblesses du HTML.
« Le design finit par avoir l'air ringard ? »
→ Cela s'améliore si vous utilisez le plugin de design frontend de Claude Code. De plus, si vous demandez à Claude Code de lire la base de code de votre entreprise pour créer un « fichier HTML de système de design » et de l'utiliser comme référence par la suite, vous pouvez l'unifier avec le style de votre entreprise.
■ Pourquoi le HTML « maintenant » ?
La raison pour laquelle cet article résonne est le timing.
Maintenant que Claude Code peut gérer des tâches complexes, les sorties sont longues et denses. Continuer à recevoir cela en Markdown, un format qui n'est que « du texte avec un peu de fantaisie », est désormais un goulot d'étranglement.
La conclusion de Thariq est la suivante :
« Je me sens beaucoup plus dans la boucle que jamais auparavant lorsque j'utilise le HTML. »
Au lieu de tout laisser à Claude Code, en faisant de la sortie du HTML, un cycle de « compréhension humaine, jugement et retour d'information » s'enclenche. C'est l'essence de la collaboration avec l'IA.
■ Résumé des points de pratique
- Aucune compétence ou configuration difficile requise. Dites simplement à Claude Code de « créer un fichier HTML. »
- N'essayez pas de créer un fichier de compétences dès le début. Essayez d'abord avec des prompts bruts.
- Commencez par « les choses que vous voulez que les gens lisent », comme des plans, des révisions, des rapports et des prototypes.
- L'effet double lorsque vous êtes conscient de « l'interactivité », comme les curseurs et les boutons de copie.
- Ouvrez le HTML généré dans un navigateur ou téléchargez-le sur S3 pour le partager.
Le Markdown n'est pas mauvais. Mais maintenant que les sorties de Claude Code sont devenues aussi avancées, le moment est venu de mettre à niveau le format du récepteur également.
La prochaine fois que vous demanderez à Claude Code de créer un plan, essayez d'ajouter une ligne : « Fais-le en HTML. » Vous serez surpris de la différence.
À ceux qui ont trouvé cet article ne serait-ce qu'un peu utile :
𝗖𝗹𝗮𝘂𝗱𝗲 𝗖𝗼𝗱𝗲 𝗦𝘁𝘂𝗱𝗶𝗼 @ 𝗝𝗮𝗽𝗮𝗻 (@ClaudeCode_love) est
un compte géré par trois passionnés de Claude Code.
Nous publions quotidiennement des articles sur l'utilisation pratique en CLI et l'automatisation.
Nous développons actuellement un agent IA avec une entreprise cotée en bourse.
Nos publications habituelles 👇
- Cas réels de développement de produits utilisant Claude Code et Claude
- Organisation de l'utilisation de Claude Code / Vibe Coding / tendances de développement
- Dernières informations sur Claude Code en provenance de l'étranger
De la philosophie de développement à la conception, la mise en œuvre et l'amélioration,
nous synthétisons les informations étrangères et primaires jusqu'au point de mettre un produit fonctionnel dans le monde, pas seulement « terminer la construction. »
Si cela vous intéresse, veuillez nous suivre et nous découvrir 👀 Je pense que cela vous sera bénéfique !
