Éditeur HTML WYSIWYG

Un éditeur HTML WYSIWYG vous montre la page telle que les visiteurs la verront, et le programme écrit le code à votre place. Mobirise y parvient avec des blocs prêts à l'emploi, ne coûte rien sur Windows, Mac et Linux, et enregistre du HTML et du CSS propres pour n'importe quel hébergeur.

Design portfolio website made with Mobirise, desktop view Digital products website made with Mobirise, desktop view Social media marketing website made with Mobirise, desktop view

Vérifié en octobre 2026 · par l'équipe Mobirise, qui gère mobirize.com

Mobirise comme éditeur visuel : l'essentiel

Façon d'éditer
Déposez des blocs sur la page, retapez le texte directement dessus et cliquez sur une image pour la remplacer. Chaque bloc a son panneau des paramètres : espacement, arrière-plan, éléments visibles et nombre de colonnes.
Ce qui est généré
Du HTML, du CSS et un peu de JavaScript, le tout basé sur Bootstrap 5. Les blocs reposent sur la grille Bootstrap, qui s'adapte seule aux écrans étroits comme larges.
Prix
Gratuit pour des sites personnels ou professionnels, avec un thème de départ et environ 200 blocs. Les abonnements commencent à 149 $ par an.
Systèmes
Windows 7 et versions ultérieures, macOS 10.13 et versions ultérieures avec un installateur Apple Silicon et un installateur Intel, et Linux de la famille Debian comme Ubuntu. Une version navigateur du créateur existe aussi.
Accès au code
Vous gardez les fichiers terminés quel que soit votre plan. Réécrire à la main le HTML d'un bloc demande l'extension Code Editor, un module payant.
Principale limite
Seuls les projets Mobirise peuvent être ouverts. Une page ou un modèle créé dans un autre outil ne peut pas être chargé pour continuer à l'éditer visuellement.

Ce que WYSIWYG signifie aujourd'hui pour le HTML

Le principe « ce que vous voyez est ce que vous obtenez » est né avec les traitements de texte : du gras à l'écran donnait du gras sur le papier. Sur le web, c'est plus compliqué, car la même page est dessinée par différents navigateurs sur des écrans de 360 à 2 560 pixels de large. Un éditeur HTML visuel actuel affiche donc un seul rendu, en général à la largeur d'un ordinateur avec des boutons pour la tablette et le téléphone, et laisse le reste au CSS.

Le deuxième piège, c'est le code derrière l'image. Deux pages d'apparence identique peuvent reposer sur un balisage soigné et sémantique ou sur des boîtes imbriquées avec des styles en ligne. Quel que soit l'éditeur HTML WYSIWYG que vous testez, regardez au-delà du canevas et ouvrez les fichiers exportés : titres dans le bon ordre, vraies listes, images avec texte alternatif et feuille de style lisible.

Le troisième point est le sens de la conversion. La plupart des outils visuels écrivent bien le HTML mais le lisent mal. Rendre n'importe quel HTML modifiable visuellement, l'étape « html to wysiwyg », ne réussit que si l'outil sait comment la page a été construite. Les créateurs à blocs n'acceptent donc que leurs propres projets, tandis que les éditeurs pour développeurs analysent tous les fichiers et supposent que vous connaissez le CSS.

  • Rendu en direct. Le canevas utilise un moteur de navigateur : texte, polices et espacements ressemblent à ce qu'ils seront en ligne.
  • Plusieurs largeurs. Regardez la page en tailles téléphone, tablette et ordinateur avant la mise en ligne.
  • Code lisible. Les fichiers exportés s'ouvrent dans n'importe quel éditeur de code et un développeur peut les suivre.
  • Balises sémantiques. Vous choisissez H1 à H6 pour les titres, et non un simple « grand texte ».
  • Bases d'accessibilité. Texte alternatif pour les images et contour de focus visible pour les utilisateurs du clavier.
  • Une porte de sortie. Votre site quitte l'outil sous forme de fichiers ordinaires, sans dépendance à un serveur.

Les types d'éditeurs HTML visuels

L'expression recouvre des outils pour des publics très différents. Savoir quelle famille vous convient évite l'essentiel des recherches.

Créateurs à blocs

Vous assemblez une page à partir de sections prêtes et ne voyez aucun code si vous ne le demandez pas. Mobirise et Blocs suivent ce modèle. C'est rapide pour un site complet, mais la structure interne de chaque bloc est fixée par le thème.

Canevas à placement libre

Vous déposez des zones de texte et des images n'importe où, comme sur une diapositive. WYSIWYG Web Builder sur Windows en est l'exemple le plus connu. Liberté totale de placement, avec plus d'attention nécessaire pour que la page tienne encore sur un téléphone.

Éditeurs visuels pour codeurs

Pinegrow et Bootstrap Studio affichent la page et l'arbre DOM côte à côte et ouvrent des fichiers existants. Ils supposent que vous savez ce que sont un div, une classe et une media query.

Éditeurs de code avec aperçu en direct

Adobe Dreamweaver et les outils similaires privilégient le code, avec un volet de rendu à côté de la source. Vous tapez le balisage et le voyez changer. Idéal pour ceux qui préfèrent écrire le HTML eux-mêmes.

Éditeurs de texte intégrables

TinyMCE, CKEditor, Quill et TipTap sont des bibliothèques qu'un développeur intègre à un CMS ou à une application web, pour que les utilisateurs mettent en forme des articles et des commentaires. Ils éditent le contenu à l'intérieur d'une page, pas des sites entiers, et c'est généralement ce que l'on entend par éditeur HTML WYSIWYG open source.

Générateurs IA

Vous décrivez une page avec des mots et recevez une mise en page et du texte, puis vous les affinez visuellement. Mobirise AI, 8B AI et plusieurs autres créateurs démarrent ainsi ; le résultat demande tout de même votre vrai contenu.

Quel éditeur visuel choisir

Une sélection honnête selon la situation. Nous fabriquons Mobirise : lisez donc notre propre ligne avec cela en tête.

Un site entier, sans code, gratuit
Mobirise : fait de blocs, s'installe sur Windows, Mac et Linux, et son plan gratuit exporte des fichiers Bootstrap 5.
Travailler sur du HTML existant
Pinegrow : accepte n'importe quel projet existant et permet de l'éditer visuellement ou dans le code ; destiné aux personnes à l'aise avec HTML et CSS.
Du travail Bootstrap pour un paiement unique
Bootstrap Studio : paiement unique, à partir de 29 $, importe des pages terminées, fonctionne hors ligne une fois activé.
Placement libre des objets sous Windows
WYSIWYG Web Builder : un canevas à placement libre, acheté une seule fois, avec 30 jours d'essai.
Un créateur à blocs natif pour Mac
Blocs : gratuit à l'essai, l'export et la publication viennent avec une licence unique.
Écrire du code avec un volet de rendu
Adobe Dreamweaver : un éditeur de code professionnel vendu via Creative Cloud.
Une zone de mise en forme dans votre propre application
Une des bibliothèques intégrables comme TinyMCE ou TipTap ; aucun des outils de bureau présentés ici ne remplit ce rôle.

Comparatif des éditeurs HTML WYSIWYG

Sept outils dans une seule grille, avec les lignes qui avantagent les concurrents conservées.

Tableau de sept éditeurs HTML visuels, de Mobirise à Blocs
MobirisePinegrowBootstrap Studio8B AIWYSIWYG Web BuilderAdobe DreamweaverBlocs
Prix0 $ ; plans payants à partir de 149 $ par an99 $ par an, 12 $ par mois ou 149 $ en une fois29 $ en une fois ; Lifetime 59 $Pro 9 $ par mois, facturé annuellement59,95 $ en une fois, hors TVA22,99 $ US par mois avec l'engagement annuel, payé mensuellement112,99 $ en une fois (Standard)
Essai avant achatGratuit, sans limite de duréeEssai gratuit, toutes les fonctionsPas d'essai, remboursement sous 30 joursCréation gratuite, sans publicationEssai de 30 joursEssai gratuitGratuit, sans export ni publication
Façon d'éditerBlocs, texte modifié directementVisuel plus code, arbre DOMGlisser des composants, volets de codeDe la phrase au design, modifications par chatObjets à position libreCode avec aperçu en directBlocs
Ouvre du HTML existantNon, uniquement ses propres projetsOui, tout projet HTMLOui, importe des pagesNon préciséOui, importe des pagesOuiL'édition Plus importe du contenu
Compétences en code requisesAucuneHTML et CSS, selon l'éditeurUtilesAucuneAucuneOuiAucune
SystèmesWindows, macOS, Linux, navigateurWindows, macOS, LinuxWindows, macOS, LinuxNavigateur uniquementWindows uniquementWindows 10+, macOS 13+Mac, avec applications iPad et iPhone
Modifier le code à la mainExtension Code Editor payanteOuiOuiExport HTML avec ProObjets HTML personnalisésOui, c'est son mode principalNon vérifié

Chiffres relevés du 13 au 16 octobre 2026 sur les pages de tarifs et de documentation de chaque éditeur, en dollars hors taxes sauf mention contraire. Les offres changent souvent : vérifiez sur la page de l'éditeur avant d'acheter.

Édition HTML en temps réel, de deux façons

Ceux qui cherchent un éditeur html en temps réel veulent l'une de deux choses : modifier la page et voir le résultat immédiatement, ou taper du code et regarder un aperçu se rafraîchir. Ce sont des outils différents.

Éditer sur la page elle-même

Dans Mobirise, vous cliquez sur un titre de la page rendue et vous tapez ; la modification est la page, sans rien à rafraîchir. Les changements d'espacement ou de couleur d'arrière-plan apparaissent pendant que vous déplacez le curseur. Le mode aperçu permet de passer entre les vues téléphone, tablette et ordinateur. Cela convient à ceux qui pensent en mises en page plutôt qu'en balises, et l'application de bureau le fait hors ligne.

Télécharger l'application

Du code à côté d'un aperçu en direct

Vous tapez le balisage dans un volet pendant qu'un second volet se redessine après chaque frappe. Les bacs à sable web proposant un éditeur HTML, CSS et JS en temps réel fonctionnent ainsi, tout comme les vues scindées de Dreamweaver, Pinegrow et de nombreux éditeurs de code. C'est une bonne façon d'apprendre le HTML et cela donne un contrôle total, mais rien n'empêche un balisage cassé. Sur Mac, nos notes sur les outils de codage pour macOS couvrent cette voie.

Ajoutez l'extension payante Code Editor et Mobirise couvre les deux styles : ouvrez le HTML et le CSS d'un bloc ou d'une page, modifiez-les et regardez le canevas se mettre à jour.

Générer du HTML sans l'écrire

Tout générateur de code HTML transforme des clics, ou une phrase tapée, en balisage, et sa valeur dépend du résultat. L'extrait ci-dessous montre le genre de structure Bootstrap 5 qu'un créateur à blocs produit pour une simple section à deux colonnes. C'est un balisage générique qui illustre le principe, pas un fichier de thème Mobirise.

<section class="features">
  <div class="container">
    <div class="row align-items-center">
      <div class="col-12 col-lg-6">
        <h2>Fresh bread every morning</h2>
        <p>Baked on site from 6 am, six days a week.</p>
        <a class="btn btn-primary" href="menu.html">See the menu</a>
      </div>
      <div class="col-12 col-lg-6">
        <img src="../assets/images/bakery.webp" alt="Loaves cooling on a rack"
             class="img-fluid" loading="lazy">
      </div>
    </div>
  </div>
</section>

Sur téléphone, les classes de grille empilent les colonnes, et à partir du grand point de rupture elles se placent côte à côte. Vous choisissez le niveau de titre dans l'éditeur, les images passent en WebP automatiquement, et le texte alternatif est repris des paramètres de l'image.

À partir de vos choix

Choisissez un bloc, réglez ses colonnes et son espacement, saisissez votre texte. Le conteneur, les lignes et les classes sont écrits pour vous, de façon identique à chaque fois.

Un générateur de code HTML à partir de texte

Mobirise AI prend une phrase ou deux dans n'importe quelle langue et renvoie quatre designs avec textes et images inclus. Il nécessite une connexion, et les comptes gratuits disposent de 3 générations par mois ; voir créer une première ébauche avec l'IA.

Un créateur HTML pour des sites entiers

L'application garde menus, liens entre pages et en-tête commun cohérents d'une page à l'autre, une corvée que le HTML écrit à la main rend fastidieuse.

Récupérer les fichiers

Publier dans un dossier local donne du HTML, du CSS et du JavaScript ordinaires, sur tous les plans, gratuitement. Le créateur en ligne ne propose l'export du site qu'avec BASE et GROW.

Où Mobirise trouve sa place comme outil HTML visuel

Un bon choix

  • Votre but est un site complet sans code, et l'offre gratuite suffit pour commencer
  • Vous voulez les fichiers HTML finaux à placer chez n'importe quel hébergeur
  • Vous utilisez Linux, où les outils visuels de création de site sont rares : il répond donc aussi aux recherches sur Linux
  • Vous comptez continuer à éditer hors ligne sur un portable
  • Il vous faut une page Bootstrap 5 adaptative et vous n'avez aucune envie d'apprendre la grille

Choisissez autre chose si

  • Votre point de départ est un site HTML existant ou un modèle acheté : Pinegrow et Bootstrap Studio chargent des fichiers externes
  • Chaque élément doit se trouver à un endroit précis : WYSIWYG Web Builder offre un canevas libre
  • Vous aimez taper chaque balise : un éditeur de code avec volet d'aperçu conviendra mieux
  • Vous voulez une zone de mise en forme dans votre propre CMS : choisissez une bibliothèque intégrable
  • Il vous faut une mise en page distincte pour téléphone : Mobirise garde une seule mise en page adaptative partout

Questions sur l'édition HTML visuelle

Existe-t-il un éditeur HTML WYSIWYG gratuit pour un site entier ?

Oui. Mobirise est gratuit pour des sites privés ou professionnels sur Windows, Mac et Linux, et l'édition gratuite n'expire jamais. Elle comprend un seul thème de base et plus de 200 blocs ; les thèmes premium et les modules font partie des abonnements.

Quelle est la différence entre WYSIWYG et un éditeur de code ?

Un éditeur visuel permet de modifier la page rendue pendant que le logiciel produit le balisage. Un éditeur de code vous oblige à taper le balisage et, au mieux, affiche un aperçu. Les outils visuels accélèrent les mises en page, tandis que les éditeurs de code contrôlent chaque balise.

Mobirise peut-il ouvrir et modifier un fichier HTML existant ?

Non. Seuls les projets créés dans Mobirise s'ouvrent, y compris les sites récupérés depuis Mobirise AI via Import by Link. Pour modifier visuellement du HTML d'une autre origine, regardez du côté de Pinegrow ou de Bootstrap Studio.

Existe-t-il un éditeur HTML visuel pour Mac ?

Mobirise propose deux installateurs Mac, Apple Silicon (M1 à M4) et Intel, nécessitant macOS 10.13 ou plus récent. Blocs, Pinegrow et Bootstrap Studio fonctionnent aussi sur Mac. Les installateurs sont listés sur la page du téléchargement gratuit pour ordinateur.

Puis-je voir et modifier le code HTML dans Mobirise ?

Les fichiers exportés vous appartiennent toujours et n'importe quel éditeur de texte les ouvre. Modifier le code des blocs et des pages dans l'application demande l'extension Code Editor, incluse avec KIT, BASE et GROW.

Un éditeur web WYSIWYG produit-il des pages adaptées aux mobiles ?

Cela dépend de l'outil. Les blocs Mobirise sont tous adaptatifs : une seule mise en page convient aux petits comme aux grands écrans, et chaque taille peut être prévisualisée. Les canevas à placement libre demandent plus de soin, comme expliqué dans le comportement des mises en page glissées sur téléphone.

Comment télécharger un tel éditeur en toute sécurité ?

Récupérez les installateurs uniquement sur le site de l'éditeur. Pour Mobirise, utilisez history.mobirisesite.com ou download.mobirise.com ; le fichier Windows pèse environ 105 Mo et chaque fichier Mac environ 134 Mo.

TinyMCE ou CKEditor est-il un créateur de site web ?

Non. Les développeurs les intègrent dans une application ou un CMS pour que les utilisateurs mettent le texte en forme. Ils produisent du HTML pour une seule zone de contenu, pas pour un site entier avec pages, menus et hébergement.

L'éditeur fonctionne-t-il sans internet ?

L'application de bureau édite et prévisualise hors ligne, avec les thèmes et les blocs que vous avez déjà. L'IA, la publication, la connexion, ainsi que le téléchargement de nouveaux thèmes ou de mises à jour nécessitent internet.

Le code généré est-il assez propre pour être confié à un développeur ?

Le résultat est du HTML et du CSS standards sur Bootstrap 5, avec les titres de votre choix et des images WebP. Un développeur peut le lire et l'héberger n'importe où, mais attendez-vous à trouver des classes de thème dans le balisage.

Puis-je l'utiliser sans aucune connaissance en code ?

Oui, c'est pour ces personnes qu'il est conçu. Si vous voulez un site sans jamais voir de code, notre page sur la création de site visuelle et gratuite passe en revue les limites du travail sans code.

Où puis-je publier ce que je crée ?

Envoyez par FTP ou FTPES vers l'hébergeur de votre choix, sur GitHub Pages, dans un dossier local, ou vers une adresse mobirisesite.com gratuite en HTTPS (le plan gratuit en autorise trois). Utiliser votre propre domaine sur l'hébergement Mobirise demande BASE ou GROW.

Essayez l'éditeur visuel

Installez Mobirise sur Windows, Mac ou Linux et créez une première page qui ressemble exactement à ce qu'elle sera en ligne. Le même créateur s'ouvre aussi dans votre navigateur.