Start › WYSIWYG HTML-Editor

Kostenloser WYSIWYG HTML-Editor

Mobirise ist ein WYSIWYG HTML-Editor, bei dem Sie während der Arbeit die fertige Seite vor Augen haben: Überschriften ändern Sie direkt im Layout, Fotos per Klick. Den Quelltext schreibt das Programm, als statisches HTML, das auf Bootstrap 5 aufbaut.

Freeware für Windows, macOS und Linux, auch offline nutzbar. Im Browser ohne Installation.

Startseite einer Stiftung, mit Mobirise gestaltet Website einer Kosmetikmarke, im visuellen Editor von Mobirise gebaut
3

Ansichten in der Vorschau: Desktop, Tablet, Smartphone

Im Editor sehen Sie die Seite so, wie sie später online steht. Vor dem Veröffentlichen schalten Sie zwischen den drei Bildschirmgrößen um.

Über 2.500.000 Nutzer

Was ein WYSIWYG HTML-Editor ist

Die Abkürzung steht für „What You See Is What You Get“: Was Sie beim Bearbeiten auf dem Bildschirm sehen, bekommen auch Ihre Besucher zu sehen. Ein WYSIWYG-Editor blendet den Quelltext aus und lässt Sie an der Seite selbst arbeiten. Mobirise ist so ein visueller HTML-Editor, allerdings einer, der mit fertigen Blöcken arbeitet statt mit einer leeren Fläche.

Text dort, wo er steht

Klicken Sie in einen Titel oder in den Fließtext und schreiben Sie los. Schriftart, Größe und Zeilenabstand kommen aus dem Theme, das Endergebnis ist also sofort sichtbar.

Bilder austauschen

Ein Klick auf ein Foto, dann nehmen Sie eine Datei von Ihrem Computer. Format und Ausschnitt gibt der Block vor, alles drumherum bleibt an seinem Platz.

Menü statt Attribute

Jeder Block hat Einstellungen: Titel weg, zweiter Button dazu, dunkler Hintergrund, zwei Spalten statt drei. Sie klicken, und das HTML ändert sich mit.

Drei Bildschirme prüfen

Per Klick zeigt die Vorschau die Seite auf Desktop, Tablet oder Smartphone. Auf schmalen Geräten rücken die Spalten von allein untereinander.

Ein HTML-Editor mit Vorschau in einem zweiten Fenster wird so überflüssig, weil Sie ohnehin am Ergebnis arbeiten. Für ein neues Projekt kann auch die KI den Anfang machen und vier Vorschläge zur Auswahl liefern, die Sie danach auf dieselbe Weise bearbeiten.

Welches HTML im Hintergrund entsteht

Jeder Block ist ein fertiger Abschnitt aus HTML und CSS auf Bootstrap 5. Während Sie Blöcke anordnen und füllen, setzt Mobirise daraus Ihre Seiten zusammen. Heraus kommen gewöhnliche HTML-, CSS- und JavaScript-Dateien, mit denen jeder Browser und jeder Hoster umgehen kann.

Statisch, ohne Datenbank

Kein PHP, keine Datenbank, kein System im Hintergrund, das Updates verlangt. Die Dateien liegen auf dem Server und werden einfach ausgeliefert, auch vom kleinsten Webspace-Tarif.

Das Raster von Bootstrap 5

Spalten, Abstände und Umbrüche folgen dem Bootstrap-Raster. Deshalb passt sich jeder Block an schmale Bildschirme an, ohne dass jemand Media Queries schreiben muss.

Titel und Beschreibung

Für jede Seite tragen Sie in den Seiteneinstellungen einen Titel und eine Beschreibung ein. Beides landet im Kopf der HTML-Datei, genau dort, wo Suchmaschinen es auslesen.

Vier Blöcke, vier fertig programmierte Abschnitte

Ausschnitte aus Mobirise-Themes. Die Themes sind im Grunde HTML-Vorlagen, die Sie am Bildschirm anpassen statt im Quelltext. Den Code dahinter exportieren Sie in der Desktop-App kostenlos, in der Browser-Version ab BASE.

Kontaktformular eines Design-Portfolios als Block
KontaktFluxM5
Kopfbereich eines Design-Portfolios als fertiger Block
KopfbereichFluxM5
Bildergalerie eines Kosmetikstudios als Block
BildergalerieWonderM5
Block mit den Leistungen einer Baufirma
LeistungenApexM5

Zur Ehrlichkeit gehört: Wer jede Zeile von Hand schreibt, kommt oft mit weniger Code aus. Ein Framework wie Bootstrap bringt Klassen und Dateien mit, die eine sehr schlichte Seite nicht bräuchte. Dafür hält das Layout auf jedem Gerät, ohne dass Sie es dort einzeln nachbauen.

WYSIWYG HTML-Editor oder Code-Editor?

Beide Werkzeuge liefern am Ende HTML, aber für unterschiedliche Leute. Entscheidend ist, ob Sie Code schreiben wollen oder eine fertige Website brauchen. Dazwischen liegt eine dritte Gruppe, die viele noch aus den Anfängen des Webs kennt.

Der Code-Editor

Sie tippen jede Zeile selbst, unterstützt von Syntaxfarben und Autovervollständigung, etwa in Visual Studio Code. Das ist richtig, wenn Sie HTML lernen, ein bestehendes Projekt pflegen oder jedes Zeichen kontrollieren wollen. Wie die Seite aussieht, sehen Sie meist erst im Browser.

WYSIWYG-Editoren alter Schule

Viele frühe Programme dieser Art arbeiteten wie eine Textverarbeitung: Elemente frei platzieren, Schrift aus dem Menü wählen. Im Quelltext blieben oft verschachtelte Tags, Inline-Styles und Tabellen als Layout zurück, und für Smartphones waren solche Seiten nie gedacht.

Blöcke mit fertigem Code

Mobirise lässt Sie nicht frei zeichnen. Sie stapeln Blöcke, deren HTML bereits steht und sich jeder Bildschirmbreite anpasst. Etwas Freiheit beim Platzieren geht verloren; dafür zerfällt die Seite auf dem Handy nicht.

Und wenn Sie doch in den Code wollen?

Die Erweiterung Code Editor, Teil von KIT für 149 $ im Jahr, zeigt Ihnen den Quelltext eines Blocks, HTML wie CSS, direkt in Mobirise. Nötig ist sie nicht. Wer lieber gar nichts tippt, kann Code auch von einer KI schreiben lassen.

Als HTML-Programm für Windows, Mac und Linux

Als Desktop-App ist Mobirise ein HTML-Editor für Windows ab Version 7, also auch für Windows 10 und 11, für macOS ab 10.13 und für Linux auf Debian-Basis wie Ubuntu, dort als .deb-Paket. Installiert wird es wie jedes andere Programm.

Den HTML-Editor für den Mac gibt es in zwei Ausgaben, für Macs mit M-Chip und für Intel-Rechner. Gearbeitet wird lokal, auch ganz ohne Netz; Internet ist allein für KI-Entwürfe und den Upload nötig.

Direkt zum Mac-Installer: Apple Silicon oder Intel.

Windows 7+Läuft auch unter Windows 10 und 11
macOS 10.13+Zwei Installer, passend zum Prozessor Ihres Macs
Linux.deb-Paket für Debian, Ubuntu und verwandte Systeme
LokalDas Projekt liegt auf Ihrem Rechner, bearbeitet wird ohne Verbindung

HTML-Seiten erstellen ohne Code

Vom leeren Projekt bis zur Seite im Netz, ohne ein einziges Tag zu tippen. Ob Sie online im Browser arbeiten oder in der installierten App, ändert an den Schritten nichts.

1

Theme oder KI-Entwurf

Ein Theme liefert Blöcke, die wie die Vorlage für eine einfache HTML-Seite funktionieren, nur ohne Quelltext. Oder Sie beschreiben Ihr Vorhaben in einem Satz und starten mit einem Entwurf der KI.

2

Blöcke anordnen

Per Drag-and-drop ziehen Sie Abschnitte aus der Seitenleiste an die gewünschte Stelle: Kopfbereich, Leistungen, Galerie, Kontaktformular. Was fehlt, kommt dazu, was stört, löschen Sie.

3

Inhalte einsetzen

Eigene Texte schreiben, Fotos tauschen, Farben und Spaltenzahl in den Block-Einstellungen anpassen. Danach jede Seite einmal in der Smartphone-Ansicht durchsehen.

4

Veröffentlichen

Per Klick unter einer Gratis-Adresse bei mobirisesite.com, über FTP zum eigenen Hoster, als GitHub-Pages-Seite oder als Ordner voller HTML-Dateien für später.

Für ein einzelnes Produkt oder einen Termin reicht oft eine einzige Seite mit einem klaren Button. Unterseiten kommen hinzu, sobald der Inhalt nicht mehr bequem darauf passt.

HTML-Editor kostenlos: was gratis ist, was extra kostet

Das Programm ist Freeware und bleibt es, auch für gewerbliche Projekte. Kosten entstehen erst für Extras: mehr Designs, Erweiterungen, Hosting mit eigener Domain und mehr KI.

Ohne Kosten

  • Das Programm für alle drei Desktop-Systeme, auch gewerblich nutzbar
  • Basis-Theme mit mehr als 200 Blöcken
  • Quelltext-Export aus der Desktop-App, ohne Aufpreis
  • Beliebig viele Websites auf Ihrem Webspace, über FTP, GitHub Pages oder einen lokalen Ordner
  • Online drei Seiten auf einer mobirisesite.com-Adresse mit HTTPS, dazu jeden Monat drei Generierungen der KI
  • Ein kleiner Mobirise-Hinweis auf der Seite, ab KIT ohne

Wer ein HTML-Programm kostenlos nutzen möchte, kommt mit dem Gratis-Plan also weit. Für die erste Bestellung gilt eine Erstattung binnen 14 Tagen, falls ein Abo doch nicht passt. Die Pläne im Detail stehen auf der Preisseite von Mobirise, einen Überblick über Vorlagen, KI und Hosting finden Sie auf unserer Startseite.

Wann ein visueller Editor die richtige Wahl ist

Als Homepage-Editor ist Mobirise für Menschen gedacht, die eine Website brauchen, nicht für solche, die Programmieren üben wollen. Bei manchen Vorhaben ist ein anderes Werkzeug schlicht geeigneter.

Passt

  • Selbstständige, Praxen, Vereine und kleine Firmen, die ihre Seite selbst pflegen wollen
  • Wer bisher HTML-Vorlagen von Hand angepasst hat und künftig lieber am Ergebnis arbeitet
  • Designer, die einen Entwurf als echtes, exportierbares HTML brauchen statt als Bild
  • Wer die eigene Seite als Dateien besitzen und den Hoster frei wählen möchte

Besser ein anderes Werkzeug

  • HTML und CSS lernen: Dafür sind ein Code-Editor und ein gutes Tutorial die besseren Lehrer
  • Eine bestehende, von Hand geschriebene Website Zeile für Zeile weiterpflegen: Aufgabe für einen Code-Editor
  • Einen WYSIWYG-Editor als JavaScript-Baustein in ein eigenes CMS oder eine Web-App einbauen: Mobirise ist ein Programm, keine Bibliothek
  • Elemente pixelgenau frei auf der Fläche verschieben: Mobirise arbeitet mit Blöcken und Spalten
  • Mitgliederbereich, Datenbank, Buchungssystem oder ein Blog mit vielen Autoren

Häufige Fragen zum Editor

Ist der WYSIWYG HTML-Editor von Mobirise kostenlos?

Ja. Die Software kostet auf allen drei Desktop-Systemen nichts, samt Basis-Theme mit über 200 Blöcken und HTML-Export, und Sie dürfen damit auch kommerzielle Seiten bauen. Bezahlt werden Premium-Themes, Erweiterungen wie der Code Editor und Hosting mit eigener Domain, ab 149 $ im Jahr.

Was heißt WYSIWYG genau?

„What You See Is What You Get“. Sie bearbeiten die Seite in der Gestalt, die auch Ihre Besucher sehen, statt Tags und Attribute zu tippen. Das Gegenstück ist ein Code-Editor, in dem Sie den Quelltext schreiben und das Ergebnis im Browser prüfen.

Kann ich HTML-Seiten erstellen, ohne HTML zu können?

Ja. Texte, Bilder und Block-Einstellungen bedienen Sie mit der Maus, den Code setzt Mobirise zusammen. HTML-Kenntnisse schaden nicht, etwa wenn Sie später einzelne Blöcke im Code Editor anpassen möchten, eine Voraussetzung sind sie aber nicht.

Kann ich den HTML-Code selbst bearbeiten?

Ja, mit der Erweiterung Code Editor aus dem KIT-Paket: Damit passen Sie das HTML und CSS eines Blocks an, ohne Mobirise zu verlassen. Alternativ exportieren Sie die ganze Seite als Dateien und arbeiten in einem Code-Editor Ihrer Wahl weiter.

Gibt es den HTML-Editor für Windows, Mac und Linux?

Ja: für Windows ab 7, für macOS ab 10.13 mit je einem Installer für M-Chips und Intel-Prozessoren und für Linux als .deb-Paket für Debian-basierte Systeme. Alle drei sind kostenlos und haben denselben Funktionsumfang.

Lässt sich der Editor offline nutzen?

Mit der Desktop-App schon. Bearbeiten, Vorschau und das Speichern in einen lokalen Ordner laufen auf Ihrem Rechner. Netz brauchen Sie nur, wenn die KI etwas entwerfen oder die Seite online gehen soll.

Kann ich den Editor auch online im Browser nutzen?

Ja. Mobirise AI läuft als Website-Editor im Browser, ohne Installation und auch auf dem iPad, für das es keine eigene App gibt. Android-Nutzer können zusätzlich zur App „AI Website Builder: Mobirise“ greifen. Überall arbeiten Sie mit demselben Programm; nur die Desktop-App kommt auch ohne Internet aus.

Was ist ein HTML-Programm, und ist Mobirise eines?

Mit HTML-Programm ist meist jede Software gemeint, mit der man Webseiten baut, vom Code-Editor bis zum Baukasten. Mobirise gehört zur visuellen Sorte: Sie gestalten, das Programm schreibt das HTML. Wer den Code lieber selbst tippt, sucht eigentlich einen Code-Editor.

Kann ich das erzeugte HTML bei einem anderen Hoster hochladen?

Ja. Aus der Desktop-App exportieren Sie in jedem Plan HTML, CSS und JavaScript und laden die Dateien per FTP zu einem beliebigen Hoster oder auf GitHub Pages. In der Browser-Version ist der Code-Export ab BASE enthalten.

Schreibt bei Mobirise auch eine KI den Code?

Auf Wunsch ja. Mobirise AI entwirft aus wenigen Sätzen, einer Handskizze oder dem Bildschirmfoto einer Seite vier Varianten, die Sie danach im visuellen Editor oder per Chat weiter anpassen. Kostenlos sind drei solche Durchläufe im Monat.

Kann ich Elemente frei auf der Seite verschieben?

Nicht pixelgenau. Sie verschieben ganze Blöcke und legen in deren Einstellungen fest, was im Block angezeigt wird und in wie vielen Spalten. Der Vorteil dieser Einschränkung: Die Seite bleibt auf dem Smartphone geordnet, ohne dass Sie nacharbeiten.

Die erste Seite visuell bauen

Kostenlos als Programm für Ihren Rechner oder ohne Installation im Browser: In beiden Fällen arbeiten Sie mit demselben WYSIWYG HTML-Editor.