Wie verknüpfe ich meine Google Stitch-Webseite mit meinem webgo Server?
Mit Google Stitch können Sie mithilfe von KI schnell moderne Webseiten generieren. Damit Ihre erstellte Seite jedoch öffentlich erreichbar ist, müssen Sie diese auf einem Webserver veröffentlichen. Wir erklären, wie Sie Ihre generierte Webseite von Google Stitch exportieren und diese per FTP auf Ihren webgo Server hochladen und korrekt mit Ihrer Domain verknüpfen.
Hinweis: Eine mit Google Stitch erstellte Webseite stellt zunächst nur eine statische Grundstruktur dar. Funktionen, Interaktivität und dynamische Inhalte müssen im Nachgang manuell im Quellcode ergänzt werden. Zudem ist es erforderlich, interne Verlinkungen im HTML-Code zu prüfen und anzupassen. Externe Einbindungen wie Bilder, Schriftarten oder Skripte sollten ebenfalls überarbeitet und insbesondere im Hinblick auf Datenschutzanforderungen korrekt integriert werden.
Google Stitch-Webseite auf meinem webgo Server hochladen
Um Ihre Google Stitch Webseite online zu stellen, müssen Sie diese exportieren und anschließend auf Ihren webgo Webspace hochladen. Ihre Seite wird hierbei als HTML-Datei exportiert. Gehen Sie dabei wie folgt vor:
Schritt 1: Google Stitch aufrufen
Öffnen Sie Google Stitch und melden Sie sich mit Ihrem Google-Konto an. Sie müssen hierfür ein kostenloses Google Konto besitzen.
Schritt 2: Webseite erstellen
Erstellen Sie Ihre Webseite mithilfe eines individuellen Prompts. Sie können das Design und die Inhalte im Editor individuell anpassen, bis alles Ihren Vorstellungen entspricht.
Schritt 3: Webseite exportieren
Klicken Sie im Editor oben links auf das Burger-Menü und dann auf "Projekt exportieren". Alle angefertigten Seiten werden nun als ZIP-Datei erstellt und automatisch heruntergeladen.
Hinweis: Der Export von allen Layouts kann ggf. nicht vollständig ablaufen. In einigen Fällen sind einige Unterseiten ohne HTML-Datei. Hier können Sie dann die jeweilige Seite auch einzeln exportieren.
Schritt 4: ZIP-Datei entpacken
Entpacken Sie die heruntergeladene ZIP-Datei auf Ihrem Computer.
Sie erhalten einen Ordner mit allen notwendigen HTML-Dateien, ggf. auch CSS- und JavaScript-Dateien.
Schritt 5: Dateien anpassen und korrekt verknüpfen
Die exportierten HTML-Dateien sind tendenziell nicht miteinander verknüpft. Sie müssten mit einem Quelltext-Editor wie z. B. Visual Studio Code, Sublime Text oder Notepad++ die einzelnen HTML-Dateien bearbeiten und die Verlinkungen und alle anderen Verknüpfungen (vor allem externe wie Font oder Scripte) anpassen. Generell empfiehlt es sich hier nun weiter an den Seiten zu arbeiten um diese vollständig funktionsfähig zu gestalten.
Tipp: Benennen Sie alle HTML-Dateien in die jeweilige Seite und die Startseite in "index.html". Alle HTML-Datein sollten dann gemeinsam nur noch in einem Ordner liegen statt in eigenen unterteilt.
Schritt 6: FTP-Verbindung herstellen
Öffnen Sie ein FTP-Programm wie FileZilla und verbinden Sie sich mit Ihrem webgo Server. Wo Sie Ihre Zugangsdaten finden und wie Sie sich per FileZilla finden, erklären wir hier:
Schritt 6: Dateien hochladen
Laden Sie den gesamten Inhalt des entpackten Ordners in das gewünschte Zielverzeichnis auf Ihrem Webspace hoch. Wichtig ist, dass sich die Startdatei in der Regel eine index.html direkt im Zielverzeichnis befindet.
Schritt 7: Domain mit Verzeichnis verknüpfen
Stellen Sie sicher, dass Ihre Domain mit genau diesem Verzeichnis verknüpft ist. Nur dann wird Ihre Webseite beim Aufruf der Domain korrekt angezeigt.
Nach dem Upload ist Ihre Google Stitch Webseite in der Regel direkt über Ihre Domain erreichbar.
Was muss ich bei Google Stitch-Webseiten beachten?
Da sich Google Stitch aktuell noch in der Beta-Phase befindet, sollten Sie folgende Punkte berücksichtigen:
Unvollständiger Export möglich
Es kann vorkommen, dass nicht alle Seiten oder Verlinkungen korrekt exportiert werden. Sie können einzelne Seiten im Nachgang separat exportieren.Externe Schriftarten
Google Stitch bindet Schriftarten häufig über externe Google APIs ein.
Aus Datenschutzgründen empfiehlt es sich, diese Schriftarten lokal in Ihre Webseite einzubinden.Externe Ressourcen prüfen
Auch andere externe Inhalte oder Skripte sollten überprüft und bei Bedarf angepasst werden, damit Ihre Seite unabhängig und stabil läuft.Quellcode UNBEDINGT anpassen
Der Quellcode der einzelnen HTML-Dateien müssen unbedingt jeweils gegengeprüft und angepasst werden. Die Seiten sind standardmäßig nicht miteinander verknüpft, weswegen Sie manuell die Verlinkungen vornehmen müssen. Auch müssen externe Verknüpfungen zu Schriftarten, Scripte und Medien (wie z. B. Bilder) angepasst werden - auch aufgrund von Datenschutzvorgaben.Dateien richtig benennen
Die exportierten HTML-Dateien werden alle als code.html abgespeichert. Jede einzelne Seite sollte daher idealerweise eine eigene Dateibezeiechnung bekommen, wie z. B. "index.html" für die Startseite und "kontakt.html" für die Kontaktseite, usw. Auch sollten alle Dateien gemeinsam in einem Ordner liegen.
Kann ich meine Google Stitch-Webseite weiter bearbeiten?
Sie können Ihre Webseite in Google Stitch natürlich im Nachgang weiterhin ändern oder erweitern. Dies erfolgt jedoch weiterhin über die Google Stitch-Plattform. Bedenken Sie hier, dass Sie nach vorgenommenen Änderungen Ihr Projekt von neuem exportieren müssen und diese Dateien ebenfalls erneut angepasst auf Ihren webgo Server hochladen müssen.
Wichtig ist, dass Sie interne Verlinkungen im Code erneut prüfen, da sich Pfade oder Seitenstrukturen geändert haben können.
Warum wird meine Google Stitch-Webseite nicht korrekt angezeigt?
Wenn Ihre Webseite nicht richtig funktioniert, kommen meist folgende Ursachen infrage:
Die Dateien wurden nicht vollständig hochgeladen
Die index.html liegt nicht im richtigen Verzeichnis
Die Domain ist nicht korrekt mit dem Verzeichnis verknüpft
Interne Links im HTML-Code sind fehlerhaft
Externe Ressourcen werden blockiert oder nicht geladen
Hinweis: Bitte beachten Sie, dass es sich bei Google Stitch Webseiten um individuell generierten Code handelt. Anpassungen am HTML, CSS oder an Verlinkungen gehen über den klassischen Hosting-Support hinaus. Unser Support kann Sie bei solchen entwicklungsbezogenen Themen daher leider nicht im Detail unterstützen. In diesen Fällen empfiehlt es sich, eine Webentwicklerin oder einen Webentwickler hinzuzuziehen, um die Seite technisch korrekt zu prüfen und anzupassen.
Sollte ich meine Google Stitch-Webseite aktiv Online nutzen?
Google Stitch dient in erster Linie dazu, schnell eine visuelle und strukturelle Grundlage für Webseiten zu erstellen. Dabei wird bereits funktionsfähiger HTML-, CSS- und teilweise JavaScript-Code generiert. Dieser Code kann grundsätzlich direkt auf einem Server betrieben werden.
Allerdings handelt es sich dabei in der Regel nicht um eine produktionsreife Webseite.
Die generierten Seiten sollten vor einer aktiven Nutzung unbedingt manuell überprüft und überarbeitet werden. Dazu gehören insbesondere:
Korrektur und Strukturierung des HTML-Codes
Prüfung und Anpassung interner Verlinkungen
Optimierung von Ladezeiten und Performance
Absicherung und Bereinigung von externen Ressourcen
Anpassung von Schriftarten und externen APIs im Hinblick auf Datenschutz
Google Stitch kann den Design- und Prototyping-Prozess deutlich beschleunigen. Es ersetzt jedoch keine saubere technische Umsetzung durch eine Entwicklerin oder einen Entwickler.
Fazit:
Eine mit Google Stitch erstellte Webseite kann als Grundlage verwendet und auch testweise online gestellt werden. Für den produktiven Einsatz sollte der Code jedoch immer fachlich geprüft und optimiert werden.
Wir hoffen, Ihnen konnte dieser Artikel weiterhelfen! 😊
➡️ Für Verbesserungen oder Vorschläge von FAQ Themen schicken Sie uns eine Mail an faq@webgo.de
War dieser Beitrag hilfreich?
Ihre Bewertung hilft uns, unsere Anleitungen weiter zu verbessern.