So veröffentlichst du eine mit Gemini erstellte Website

Einleitung

Viele Menschen nutzen Gemini, um Websites zu erstellen. Wenn du das Canvas-Tool aktivierst, gibt dir Gemini eine einzelne HTML- oder React-Datei mit einer Vorschau daneben. Aber sobald du den Code hast, ist der nächste Schritt nicht offensichtlich. Du musst sie noch irgendwo hosten, eine Domain verbinden, sie auf Mobilgeräten zum Laufen bringen und herausfinden, wie du sie später weiter bearbeiten kannst.

Klassische Entwicklertools wie GitHub und Netlify können die Datei online hosten, aber dann erfordert jede Änderung das Verwalten von Code-Dateien, Deployments und technischen Details. Die meisten Leute möchten sich damit nicht beschäftigen.

In dieser Anleitung zeige ich dir, wie du eine mit Gemini erstellte Website mithilfe eines neuen KI-Tools namens Repaint in eine echte, veröffentlichte Website verwandelst. Damit kannst du von deinem Code ausgehen, die Seite veröffentlichen und Änderungen per Chat mit der KI vornehmen.

Warum es schwierig ist, von Gemini aus zu veröffentlichen

Gemini kann Code generieren, ist aber kein vollständiger Website-Builder. Wenn du fragst, wie du auf deiner eigenen Domain veröffentlichst, verweist es auf andere Plattformen. Normalerweise empfiehlt es Entwicklertools wie GitHub, Netlify und Vercel oder schlägt vor, in einem klassischen Website-Builder wie Framer, Wix oder Squarespace neu zu bauen. Beides ist nicht ideal.

Entwicklertools sind praktisch, weil sie den von Gemini generierten Code direkt ausführen können. Der Nachteil ist, dass jede Änderung das Bearbeiten bestimmter Code-Dateien erfordert. Für Nicht-Entwickler bedeutet das, ständig Dateien in den deployten Code hinein- und herauszuschieben, nur um einfache Änderungen mit KI vorzunehmen.

Die meisten Leute umgehen die Code-Komplexität, indem sie einen Website-Builder wie Wix, Squarespace oder Webflow verwenden. Diese Plattformen machen das Veröffentlichen von Änderungen einfacher. Das Problem ist, dass sie keine von Gemini generierten Seiten ausführen können, sodass du alles manuell neu aufbauen musst. Und danach musst du alles von Hand bearbeiten.

Deshalb solltest du einen KI-Website-Builder wie Repaint verwenden. Er bietet dir die Flexibilität, eigenen Code auszuführen, und die Bequemlichkeit, alles an einem Ort zu bearbeiten und zu veröffentlichen.

Was ist Repaint?

Repaint ist eine KI-Plattform zum Erstellen von Websites. Sie basiert auf demselben chatbasierten Workflow, der Gemini so nützlich macht. Du kannst Änderungen in einfacher Sprache anfragen, das Ergebnis prüfen und so lange iterieren, bis die Seite stimmt.

Aber Repaint ist eine vollständige Website-Plattform, nicht nur ein Ort, an dem Code generiert wird. Das bedeutet, es übernimmt die Aufgaben rund um den Betrieb einer Website, die Gemini nicht abdeckt:

• Es veröffentlicht deine Seite, sodass sie online tatsächlich besucht werden kann.
• Es ermöglicht dir, eine eigene Domain zu verbinden, damit die Seite unter deiner echten URL läuft.
• Es hält die Seite mit KI bearbeitbar, sodass du später Änderungen vornehmen kannst.
• Es hilft bei der Verwaltung von SEO-Details wie Seitentiteln, Beschreibungen und Seitenstruktur.
• Es kann neue Seiten anlegen, wenn deine Website wachsen muss.

Das ist der Unterschied zwischen dem Generieren einer Code-Datei und einem echten Ort, an dem du deine Website langfristig verwalten kannst.

Schritt 1: Code aus Gemini importieren

Wenn Gemini eine Website erstellt, zeigt es den Code und eine Live-Vorschau in einem Canvas-Panel an. Standardmäßig ist die Ausgabe HTML, aber du kannst stattdessen React anfordern. Eine Eigenheit, die man kennen sollte: Gemini öffnet Canvas nicht automatisch, wenn du nach einer Website fragst. Du musst das Canvas-Tool aus dem Dropdown neben dem Nachrichtenfeld aktivieren und dann erneut fragen.

Um den Code zu erhalten, klicke oben im Canvas auf den Share-Button und dann auf Copy contents. Gehe zum Repaint Code-Importer und füge ihn ein. Damit startet der Website-Erstellungsprozess. Repaint verwendet deinen Code, um eine vollständige Website zu erstellen, die du veröffentlichen und weiter bearbeiten kannst.

Falls du noch keine Website in Gemini erstellt hast, empfehle ich, React anzufordern. Das ist näher am Format, das Repaint verwendet, sodass die Wahrscheinlichkeit geringer ist, dass kleine Designdetails bei der Übertragung verloren gehen. HTML funktioniert auch, eventuelle Probleme können später per Chat mit Repaint behoben werden.

Schritt 2: Planen, was Repaint bauen soll

Nachdem du deinen Code eingefügt hast, stellt Repaint einige Fragen, bevor es die Website baut. So kannst du entscheiden, ob du die Gemini-Version genau übernehmen, sie als grobe Inspiration nutzen oder daraus eine größere Seite mit mehr Unterseiten machen möchtest.

Den Inhalt planen

Gemini erstellt häufig Single-Page-Sites, bei denen Links zu Abschnitten scrollen, statt neue Seiten zu öffnen. Aber die meisten Unternehmen brauchen mehr als eine einzige Seite. Wenn du also eine Single-Page-Site hast, solltest du in Erwägung ziehen, sie von Repaint als mehrseitige Website bauen zu lassen.

Du kannst diesen Moment auch nutzen, um mehr Inhalte hinzuzufügen. Gemini erstellt in der Regel keine großen Seitensammlungen wie Blogposts. Wenn du die Website in Repaint importierst, kannst du den Umfang erweitern und alles aufnehmen, was du möchtest.

Neue Seiten passen sich dem bereits vorhandenen Stil an.

Den Stil planen

Standardmäßig übernimmt Repaint den Stil deines Originals. Das bedeutet, dass dasselbe Erscheinungsbild erhalten bleibt: Farben, Layout, Typografie und Abstände.

Aber du musst den Stil nicht behalten. Wenn du damit nicht zufrieden bist, kannst du Repaint bitten, deine Website neu zu gestalten. Repaint kann:

• Das Original so genau wie möglich nachbilden
• Den Stil einer anderen Website übernehmen, die dir gefällt
• Einen individuellen Stil für deine Inhalte erstellen
• Einen Stil aus der Repaint Stil-Bibliothek auswählen
• Für dich entscheiden

Mach dir darüber nicht zu viele Gedanken. Wenn dir das Ergebnis nicht gefällt, kannst du später neue Versionen anfragen.

Den Plan prüfen

Bevor irgendetwas generiert wird, schreibt Repaint genau auf, was es bauen wird: welche Seiten, welche Inhalte und welchen Stil. Schau es dir an und nimm letzte Änderungen vor. Es ist deutlich schneller, den Plan anzupassen, als die gesamte Website neu zu generieren.

Sobald du bestätigst, baut Repaint deine neue Website!

Schritt 3: Website generieren

Sobald du den Plan bestätigst, beginnt Repaint mit dem Aufbau deiner Seite. Du siehst Fortschrittsmeldungen, während es jede Seite bearbeitet. Eine einfache Startseite kann ein bis zwei Minuten dauern. Eine größere Website mit mehr Seiten kann länger dauern.

Repaint hostet nicht einfach den Code, den du eingefügt hast. Es nutzt die Gemini-Version als Ausgangsmaterial und baut dann die Seite, die in deinem Plan beschrieben ist. Wenn du eine exakte Nachbildung verlangt hast, versucht es, das Original genau zu treffen. Wenn du mehr Seiten oder einen anderen Stil gewünscht hast, verwendet es die Gemini-Version stattdessen als Ausgangspunkt.

Manchmal gehen während der Generierung Details verloren. Das passiert häufiger, wenn deine Originaldatei HTML ist, da React näher an dem ist, was Repaint verwendet. Falls wichtige Details verloren gehen, kannst du sie im nächsten Schritt korrigieren.

Schritt 4: Website mit KI bearbeiten

Sobald Repaint die erste Version generiert hat, siehst du sie auf der rechten Seite deines Bildschirms. Jetzt kannst du Änderungen genauso vornehmen wie in Gemini. Du schreibst, was geändert werden soll, Repaint aktualisiert die Seite, und du prüfst das Ergebnis.

Du kannst Repaint zum Beispiel bitten:

• Eine neue Seite hinzuzufügen
• Die Farben oder Schriften zu ändern
• Ein Kontaktformular einzufügen
• Bilder zu generieren
• Die Texte umzuschreiben

Du kannst weiter Änderungen vornehmen, bis sich die Seite veröffentlichungsbereit anfühlt.

Schritt 5: Website veröffentlichen

Wenn die Seite fertig ist, klicke auf den Publish-Button. Repaint stellt die Seite online und gibt dir eine Live-URL, die du mit jedem teilen kannst. Sie sieht etwa so aus: https://xxxxxx-xxxxxx-xxxxxx.sites.repaint.com

An diesem Punkt wird aus deiner Arbeit eine echte Website im Internet. Du kannst sie auf deinem Handy öffnen, jemandem schicken oder in einem echten Browser testen.

Du musst auch keinen Code exportieren oder Dateien an anderer Stelle deployen. Ab jetzt ist Repaint der Ort, an dem du die Seite bearbeitest und veröffentlichst. Wenn du später Änderungen vornehmen willst, kannst du Repaint bitten, die Website zu aktualisieren, und dann die neue Version mit demselben Button veröffentlichen.

Schritt 6: Domain verbinden

Wenn du bereit bist, deine eigene URL zu verwenden, gehe zu Website-Einstellungen > Domains und klicke auf Eigene Domain verbinden. Dafür ist ein kostenpflichtiger Plan erforderlich. Die Preisdetails findest du hier.

Deine Domain wird auf einer Plattform außerhalb von Gemini und Repaint verwaltet. Sie ist bei einem Domain-Anbieter wie GoDaddy, Namecheap oder Cloudflare registriert. Du musst sie nirgendwohin verschieben. Du aktualisierst lediglich die Einstellungen bei deinem Domain-Anbieter, sodass die Domain auf deine Repaint-Seite zeigt.

Wenn du das noch nie gemacht hast, keine Sorge. Bitte Repaint, dich Schritt für Schritt durch den Prozess zu führen. Du erfährst genau, was zu tun ist.

Die Änderung kann ein paar Stunden dauern, bis sie wirksam wird. Sobald Repaint deine Domain als verifiziert anzeigt, ist deine Website unter deiner eigenen Domain live.

Fazit

Mit Gemini lässt sich leicht eine erste Version einer Website erstellen, aber diesen Code online zu bringen und zu pflegen ist nach wie vor schwierig. Repaint bietet dir einen Weg, diesen Code in eine echte Website zu verwandeln, die du veröffentlichen, mit einer Domain verbinden und weiterhin mit KI bearbeiten kannst. Repaint macht es so einfach wie nie, aus generiertem Code eine veröffentlichte Seite zu machen.

Häufig gestellte Fragen

Wie lange dauert es, eine Gemini-Website mit Repaint zu veröffentlichen?

Wenn deine Seite bereits fertig ist, sollte es nur ein paar Minuten dauern. Code teilen, Seite planen und Website generieren dauert in der Regel 2-5 Minuten. Danach hängt die Zeit bis zur Veröffentlichung davon ab, wie viele Anpassungen du vornimmst.

Wie viel kostet die Veröffentlichung mit Repaint?

Das Importieren deines Codes in Repaint, das Generieren einer Seite, das Bearbeiten und Veröffentlichen ist kostenlos. Die wichtigsten Einschränkungen im kostenlosen Plan sind ein begrenztes Kontingent, keine eigene Domain und ein Repaint-Badge auf der Seite. Kostenpflichtige Pläne beginnen bei 20 €/Monat bei jährlicher Abrechnung oder 25 €/Monat bei monatlicher Abrechnung. Das umfasst ein erweitertes Kontingent, Unterstützung für eigene Domains und entfernt das Repaint-Badge.

Warum nicht einfach GitHub Pages, Netlify oder Vercel verwenden?

Das kannst du, vor allem, wenn du dich mit dem Verwalten von Code wohlfühlst. Diese Tools sind gut darin, Dateien online zu stellen. Aber jede wesentliche Änderung führt dich zurück in den Code, was bedeutet, dass du ständig Dateien zwischen Gemini, deinem Editor und deinem Hosting-Tool hin- und herkopierst.

Repaint ist anders, weil es eine vollständige Website-Plattform ist, nicht nur ein Ort, an dem Dateien ausgeliefert werden. Das bedeutet, du kannst weiterhin mit KI bearbeiten, Änderungen von derselben Stelle aus veröffentlichen, Seiten verwalten, SEO-Einstellungen aktualisieren, Bilder optimieren, Formulare anbinden und deine eigene Domain nutzen. Es ist auf die langfristige Verwaltung einer Website ausgelegt, nicht nur auf das erste Deployment.

Muss ich programmieren können, um Probleme zu beheben?

Nein. Repaint ist für Menschen gemacht, die nicht programmieren. Nachdem du deinen Code aus Gemini importiert hast, musst du nie wieder Code verwalten. Wenn etwas nicht stimmt, kannst du es per Chat mit der KI beheben. Programmierkenntnisse können hilfreich sein, wenn du sehr spezifisch sein möchtest, sind aber nicht erforderlich.

Sieht die Seite genauso aus wie die Gemini-Version?

Wenn du Repaint sagst, dass das Original nachgebildet werden soll, sollte sie fast genauso aussehen. Gelegentlich gehen einige Details verloren, weil Repaint den Code in sein eigenes Website-Format übersetzt. Übersetzungsprobleme treten häufiger auf, wenn das Original von Gemini HTML war. Wenn das passiert, lässt sich in der Regel mit ein paar Prompts alles beheben.

Was passiert, wenn die KI einen Fehler macht?

Während du Änderungen vornimmst, speichert Repaint jede Version deiner Seite. Du kannst Repaint bitten, zurückzugehen, und es wird zu einer früheren Version zurückkehren. Oder wenn du zu einem bestimmten Zeitpunkt zurück möchtest, kannst du jede frühere Version manuell wiederherstellen. So kannst du frei Änderungen vornehmen, ohne dass du riskierst, deine Seite zu ruinieren.

Funktionieren Formulare und Buttons nach dem Import?

Ja. Kontaktformulare haben in deiner ursprünglichen Gemini-Seite wahrscheinlich nicht funktioniert. Aber wenn du die Seite zu Repaint überträgst, kann es das Formular in ein echtes Kontaktformular umwandeln, das E-Mail-Benachrichtigungen sendet, sobald Einsendungen eingehen. Buttons sollten funktionieren, wenn sie auf echte Seiten oder Abschnitte verweisen. Wenn ein Button ins Leere zeigt, kannst du Repaint bitten, ihn zu verknüpfen.

Kann Repaint Bilder, Icons und andere Assets aus meiner Gemini-Seite verarbeiten?

Gemini bezieht Bilder oft aus Quellen wie Unsplash und verlinkt sie per URL, anstatt sie in deinem Code zu speichern. Wenn du deinen Code importierst, kann Repaint diese Bilder abrufen und Kopien speichern, sodass sie dauerhaft für deine neue Seite verfügbar bleiben. Repaint kann auch Bilder generieren, falls du noch welche hinzufügen möchtest.

Kann ich SEO-Einstellungen, Analytics und Metadaten hinzufügen?

Ja. Du kannst eigenen Code, Analytics und Metadaten einfach hinzufügen, indem du Repaint darum bittest. Es kann technisches SEO für dich einrichten und Skripte sowie Einbettungen von anderen Plattformen ergänzen. Um Google Analytics hinzuzufügen, teile einfach deine GA-ID.

Ersetzt Repaint das Hosting, oder brauche ich weiterhin einen separaten Host?

Repaint ist eine Hosting-Plattform. Es betreibt deine Website. Du brauchst keine separate Hosting-Plattform wie GitHub Pages, Netlify, Vercel oder einen anderen Website-Builder.