Von geprüften Dateien zur öffentlichen Adresse

Wie veröffentlichst du eine HTML-Website? Stelle dein fertiges Projekt unter deiner eigenen Domain bereit, damit Kunden es besuchen können.

Wenn das Design fertig ist, beauftrage deinen KI-Agent mit der Veröffentlichung, etwa auf Cloudflare Pages oder Vercel. Mit Projekt- und Terminalzugriff sowie deinem autorisierten Hostingkonto kann er die unterstützten Befehle ausführen. Danach prüfst du die echte Adresse und verbindest deine Domain.

KI-Veröffentlichung ansehen Öffentliche Startprüfungen ansehen

Forma Studio

Formwell

Orbit

Beispieldesigns · ersetze die fiktiven Inhalte durch deine eigenen.

AI ChatBeispielablauf

Cloudflare Pages · vom Ordner ins Web

Meine Website ist fertig. Veröffentliche diesen Projektordner mit Wrangler auf Cloudflare Pages. Sag mir zuerst, welchen Kontozugriff und welche Freigabe du brauchst.

KI · Beispielantwort

Ich prüfe Dateien und Bildpfade. Melde dich mit deinem Cloudflare-Konto an und gib das Erstellen oder Aktualisieren des Pages-Projekts vor dem Upload frei.

Ich gebe die Veröffentlichung in einem neuen Pages-Projekt frei. Lass meine aktuelle Domain unverändert, bis ich die Vorschau geprüft habe.

KI · Beispielantwort

Nach dem freigegebenen Upload gebe ich die von Cloudflare bereitgestellte Adresse zurück und prüfe Bilder und Links. Nach deiner Freigabe können wir die Domain verbinden.

Nächste Schritte

Projekt an Agent geben
Nutze einen KI-Agent mit Datei- und Terminalzugriff; lasse index.html und Assets zusammen.
Upload freigeben
Melde dich beim Host an und bestätige das Projekt. Der Agent kann die unterstützte CLI oder API nutzen.
Echte Adresse prüfen
Öffne die zurückgegebene URL; verbinde die Domain erst nach Prüfung der Website.

Ziel: Deine Website an einer öffentlichen Adresse, danach unter deiner Domain.

Beispielablauf. Keine Live-Verbindung zu einer KI.

01 / Veröffentlichungsdateien

Wie veröffentliche ich die mit KI fertiggestellte Website?

Am einfachsten beauftragst du denselben KI-Agent mit Dateizugriff, den fertigen Ordner auf Cloudflare Pages, Vercel oder einem passenden Host bereitzustellen. Er braucht Terminal- oder API-Zugriff, dein autorisiertes Hostingkonto und die Upload-Freigabe. Die Befehle musst du nicht selbst schreiben.

Website-Dateien + Designanweisungen

Agent mit Veröffentlichung beauftragen

Nenne den Host, gib den vollständigen Ordner und bestätige Kontozugriff und konkreten Upload.

Alternativ Hilfe mit ZIP anfragen

Frage den Hosting-Support nach Hilfe beim Hochladen deines Website-ZIPs oder gib es einem vertrauten Entwickler oder IT-Kontakt. Behalte die Ordnerstruktur.

Quelldateien und technische Details ansehen

Die tatsächlichen Projektdateien

11-forma-studio · Aktuell geprüftes ZIP

Aktueller Produktdownload geprüft am 2. Oktober 2026. Dateien und externe Ressourcen gehören zu diesem Projekt; andere Templates unterscheiden sich.

index.html
RECREATE.md
assets/index.webp
assets/terra.webp
assets/vesper.webp

Was die Originalanleitung festlegt

11-forma-studio/RECREATE.md · L5

Die Anleitung beschreibt die ursprüngliche fiktive Seite. Trenne ihre Aufgabe von den Änderungen für dein eigenes Unternehmen.

Build an English single-page fictional design studio in `index.html`, with inline CSS and plain inline JavaScript at the end of its body. No framework, build step, module loader or external JavaScript dependency is needed. Supply `assets/terra.webp`, `assets/index.webp` and `assets/vesper.webp` alongside it, using the supplied image files unchanged. These files are identical copies of the corresponding fixed remote images in §9. If the local copies are not included with these instructions, obtain their exact bytes from the corresponding §9 URLs and save them at these three local paths without conversion or regeneration. The rendered page uses the remote image URLs; the local copies are not an automatic offline fallback. Runtime is **network**: images and Google Fonts need internet access. Do not call the result offline self-contained.

Ressourcen, auf die diese Quelle verweist

11-forma-studio/index.html · resource reference inspection

Das geprüfte HTML verweist weiterhin auf externe Bilder und Schriften. Ein HTML-Upload garantiert keinen Offlinebetrieb. Behalte die Anleitung im Arbeitsordner und prüfe Ressourcen an der finalen Adresse.

https://fonts.googleapis.com
https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Roboto+Mono:wght@400;500;600&display=swap
https://fonts.gstatic.com
https://ods-assets.creatsly.com/projects/forma-alture-20260922/49907c7329e1102160019a4e0d4e3fb88fbcc23feeeb84fd438e015cfa61f235-terra.webp
https://ods-assets.creatsly.com/projects/forma-alture-20260922/9c5a32e7009a0237cd53e2e9bddb08e332a91b2ceea1610b33779efca4b00958-index.webp
https://ods-assets.creatsly.com/projects/forma-alture-20260922/ded00e174920f597aebde21225728384cbb832b97304e163c680f89df93cebfc-vesper.webp

Cloudflare Pages · Direct Upload ↗ Vercel · Deployments ↗

AI ChatBeispielablauf

Host für dieses Projekt wählen

Kann dieses HTML-Projekt auf Cloudflare Pages oder Vercel laufen? Prüfe die Dateien und erkläre Upload-Optionen vor meiner Auswahl.

KI · Beispielantwort

Ich prüfe statische Dateien, Build oder Backend. Für einen statischen Ordner bietet Cloudflare Wrangler oder Dashboard-Upload; Vercel hat einen CLI-Weg. Wir prüfen gewählten Tarif und Limits.

Nutze Cloudflare. Zeige vor Änderungen die Konto- und Upload-Freigabe.

Nächste Schritte

Projekt prüfen
Ermittle statische Dateien sowie Build- und Dienstanforderungen.
Upload-Wege vergleichen
Wähle dokumentierte CLI, API oder Dashboard-Methode.
Konto freigeben
Bestätige Tarif und Projekt vor dem Upload.

Ziel: Hosting passend zu deinen tatsächlichen Website-Dateien.

Beispielablauf. Keine Live-Verbindung zu einer KI.

02 / Hosting wählen

Wo kann ich diese Website-Dateien hosten?

Für eine einfache HTML-Website sind Cloudflare Pages und Vercel Hosting-Beispiele; auch viele klassische Hosts liefern HTML aus. Dein Agent kann die unterstützte CLI oder API nutzen. Cloudflare nimmt im Dashboard ZIP oder Ordner an; Wrangler lädt einen entpackten Ordner hoch. Prüfe Tarif und benötigte Dienste.

Konto und Projekt

Erstelle oder nutze dein Hostingkonto. Lass Tarif- und Projektentscheidungen vorab erklären.

Dateien zusammenhalten

Veröffentliche index.html und nötige lokale Ressourcen mit gleichen Pfaden. Prüfe externe Bilder und Schriften.

AI ChatBeispielablauf

Öffentliche Host-Vorschau prüfen

Gib mir nach dem Upload die echte Vorschau-URL des Hosts. Prüfe sie außerhalb des lokalen Ordners.

KI · Beispielantwort

Ich öffne die echte Adresse und prüfe Bilder, Navigation und Kontaktziele. Zur Freigabe verwenden wir eine Vorschau-Bereitstellung.

Lass die alte Website unverändert. Ich prüfe diese URL am Handy vor Freigabe des Domainwechsels.

Nächste Schritte

Zurückgegebene URL nutzen
Nimm die Adresse aus dem tatsächlichen Deployment-Ergebnis.
Online-Ressourcen testen
Öffne sie in anderer Sitzung und prüfe Bilder und Links.
Website freigeben
Prüfe am Handy vor Austausch der Live-Domain.

Ziel: Eine geprüfte Version zum Weiterbearbeiten oder Veröffentlichen.

Beispielablauf. Keine Live-Verbindung zu einer KI.

03 / Zuerst Staging

Wie prüfe ich die bereitgestellten Dateien?

Lass den Agent die tatsächlich erstellte Host-Adresse zurückgeben. Öffne sie im Browser und auf dem Handy; prüfe Bilder, Navigation und Kontaktlinks. Nutze eine Vorschau zur Freigabe, bevor du eine bestehende Website ersetzt.

01
Geprüfte Version bereitstellen
Lade gemäß Anweisungen des gewählten Hosts hoch oder stelle bereit.
02
In anderer Sitzung öffnen
Prüfe öffentlichen Zugriff, Assets, Navigation und Bildschirmgrößen außerhalb des lokalen Ordners.

Quelldateien und technische Details ansehen

Drei getrennte Zustände zum Prüfen

Authored publication workbook · no deployment executed

Quelle und lokale Vorschau sind vorhanden. Dieses Beispiel behauptet keine Staging-Adresse, Domain-Einrichtung oder echten Anfrageeingang. Fülle die Checkliste für deinen Host aus.

Quelldateien → vorhanden
Staging-Upload / öffentliche Ressourcen → ausstehend
Eigene Domain / HTTPS / echte Aktion / Wiederherstellung → ausstehend

AI ChatBeispielablauf

Eigene Domain verbinden

Die Vorschau funktioniert. Verbinde meine Domain mit diesem Projekt. Zeige die nötigen Änderungen, bevor du DNS bearbeitest.

KI · Beispielantwort

Ich prüfe Host und DNS, füge die Domain zum Projekt hinzu und schlage die genauen DNS-Änderungen vor. Dafür brauche ich autorisierten Zugriff auf beide Konten.

Behalte meine E-Mail-Einträge. Lass mich jede Änderung freigeben, die die bisherige Website ersetzt.

KI · Beispielantwort

Ich erhalte andere Einträge, ändere nur Freigegebenes und prüfe Domain und HTTPS, sobald der Anbieter sie als bereit meldet.

Nächste Schritte

Domain bestätigen
Du brauchst Zugriff auf das Konto für Domain oder DNS.
Mit Projekt verbinden
Füge die Domain beim Host hinzu und nutze dessen tatsächliche Werte.
HTTPS und Links prüfen
Öffne die eigene Domain und teste Seiten und Kontakt.

Ziel: Besucher erreichen die neue Website unter deiner Firmendomain.

Beispielablauf. Keine Live-Verbindung zu einer KI.

04 / Domain und HTTPS

Was ändert sich mit eigener Adresse?

Füge deine Domain zum Hostingprojekt hinzu und verbinde sie mit den DNS-Werten des Anbieters. Dein Agent kann dich anleiten oder mit autorisiertem Konto- und DNS-Zugriff helfen. Prüfe Änderungen vorher, erhalte E-Mail-Einträge und teste die Domain mit HTTPS, sobald sie bereit ist.

Domain verbindenDu brauchst Zugriff auf Domain oder DNS. Füge bei Cloudflare Pages die Domain zuerst zum Projekt hinzu.Eigene Adresse prüfenÖffne die finale Domain und teste HTTPS, Seitenpfade und Kontakt, ohne andere Dienste zu ändern.

Lokal auf diesem Gerät markiert; nichts wird übermittelt.

Cloudflare Pages · Custom domains ↗

AI ChatBeispielablauf

Empfangene Anfrage prüfen

Sende eine klar markierte Testanfrage von der veröffentlichten Website. Ich prüfe Postfach oder Formulardienst.

KI · Beispielantwort

Ich nutze das öffentliche Formular und prüfe die Antwort. Zustellung bestätigen wir separat am Empfangsziel, nicht nur anhand der Erfolgsmeldung.

Prüfe bei fehlendem Eingang Request, Benachrichtigungen und Spam, bevor es als fertig gilt.

Nächste Schritte

Von öffentlicher Seite senden
Nutze das echte Besucherformular mit markierten Testinhalten.
Empfangsziel prüfen
Prüfe die Nachricht im Postfach oder Dienstkonto.
Fehler beheben
Lass die Verbindung korrigieren und wiederhole denselben Test.

Ziel: Eine Anfrage kommt an deinem gewählten Ziel an.

Beispielablauf. Keine Live-Verbindung zu einer KI.

05 / Besucherprüfungen

Was muss an der finalen Adresse funktionieren?

Teste den Besucherablauf: Lesen, Navigation und echte nächste Aktion. Eine Formular-Erfolgsmeldung belegt keinen empfangenen Kontakt.

SeitenverhaltenPrüfe Mobilansicht, Tastatur, Dialoge, Bewegungspräferenzen und Ressourcenladen.Echter EmpfangSende eine Testanfrage und prüfe Empfang, Fehlerverhalten und Spamschutz.

Lokal auf diesem Gerät markiert; nichts wird übermittelt.

AI ChatBeispielablauf

Dieselbe veröffentlichte Website aktualisieren

Ergänze diese Leistung im gespeicherten Website-Ordner. Sichere zuerst die aktuelle Version und bereite ein Update für dasselbe Hostingprojekt vor.

KI · Beispielantwort

Ich bearbeite die Dateien und zeige die Vorschau. Nach Freigabe kann ich mit autorisiertem Zugang im bestehenden Projekt bereitstellen. Die vorige Version bleibt zur Wiederherstellung erhalten.

Die neue Leistung ist freigegeben. Veröffentliche diese Version und prüfe meine bestehende Domain.

Nächste Schritte

Gesicherten Ordner bearbeiten
Nutze die Dateien des aktuellen veröffentlichten Stands.
Sichern und Vorschau prüfen
Behalte Vorversion und gib die neue Vorschau frei.
Im selben Projekt veröffentlichen
Lass ein freigegebenes Update erstellen und prüfe die bestehende Domain.

Ziel: Neue Inhalte sind online, vorige Dateien bleiben erhalten.

Beispielablauf. Keine Live-Verbindung zu einer KI.

06 / Aktualisieren und wiederherstellen

Wie bleibe ich aktualisierungs- und wiederherstellungsfähig?

Behalte veröffentlichte Dateien und Hostingprojektdaten. Für Updates öffnest du den Ordner im KI-Tool, beschreibst Änderungen und lässt erneut in dasselbe Projekt bereitstellen. Sichere vorher die vorige Version für eine mögliche Wiederherstellung.

01
Freigegebenen Stand behalten
Speichere unabhängig genau die veröffentlichten Quellen und notiere den zugehörigen Bereitstellungsstand.
02
Betroffene Prüfungen wiederholen
Prüfe öffentliche Aktion und geänderte Sektionen nach jeder Bereitstellung erneut.

Veröffentlichungscheckliste vorbereiten

Bewahre Projektdaten für die nächste KI-Veröffentlichung auf.

07 / Frontend wählen

Welche Vorlage passt zum Veröffentlichungsplan?

Wähle eine Präsentation für dein Tool und Hosting. Diese Designs liefern Frontends; echte Kurse, Buchung oder Konten brauchen separat organisierte Dienste.

Forma Studio

Redaktionelles Studio-Frontend; prüfe echte Quelle, Anleitung und Medien vor Anpassung oder Veröffentlichung.

Preis und Dateien ansehen ↗

Dateien prüfen

Aktueller Download geprüft am 2. Oktober 2026. Prüfe die ausgewählten Dateien auf der Produktseite.

index.html
RECREATE.md
assets/index.webp
assets/terra.webp
assets/vesper.webp

Einige Ressourcen können von externen URLs geladen werden. Prüfe dein gewähltes Projekt vor der Veröffentlichung.

Formwell

Nutze eine leistungsorientierte Präsentation als Startdesign. Die kostenlose Probe enthält echte Quelldateien und Anleitung.

Preis und Dateien ansehen ↗

Dateien prüfen

Aktueller Download geprüft am 2. Oktober 2026. Prüfe die ausgewählten Dateien auf der Produktseite.

index.html
RECREATE.md
assets/common-ground.png
assets/loop-radio.png
assets/mono-house.png
assets/serein.png

Einige Ressourcen können von externen URLs geladen werden. Prüfe dein gewähltes Projekt vor der Veröffentlichung.

Orbit

Erkläre Beratungsleistungen und Vorgehen. Die Präsentation liefert keine Beratungsautomatisierung.

Preis und Dateien ansehen ↗

Dateien prüfen

Aktueller Download geprüft am 2. Oktober 2026. Prüfe die ausgewählten Dateien auf der Produktseite.

index.html
RECREATE.md
assets/bridge.webp
assets/connect.webp
assets/folio.webp
assets/lens.webp
assets/loop.webp
assets/relay.webp

Einige Ressourcen können von externen URLs geladen werden. Prüfe dein gewähltes Projekt vor der Veröffentlichung.

Framewise

Präsentiere einen Kurs, Ansatz und Lehrplan. Kursbereitstellung und Lernkonten bleiben separat.

Preis und Dateien ansehen ↗

Dateien prüfen

Aktueller Download geprüft am 2. Oktober 2026. Prüfe die ausgewählten Dateien auf der Produktseite.

index.html
RECREATE.md
assets/creator-blue.png
assets/creator-coral.png
assets/creator-lilac.png
assets/creator-mint.png

Einige Ressourcen können von externen URLs geladen werden. Prüfe dein gewähltes Projekt vor der Veröffentlichung.

Beispieldesigns · ersetze die fiktiven Inhalte durch deine eigenen.

Formwell / Website-Dateien + Designanweisungen

Teste ein echtes Template, bevor du dich entscheidest.

Lade das originale Formwell-Projekt herunter. Gib die Dateien und RECREATE.md an ein geeignetes KI-Tool, probiere eine kleine Änderung und prüfe das Ergebnis.

Das kostenlose Beispiel ist Formwell. Originaldesign und Anleitung sind auf Englisch. Die Produktpreise bleiben unverändert.

Formwell-ZIP herunterladen RECREATE.md herunterladen ↗