Als das „World Wide Web“ 1991 zum ersten Mal der Öffentlichkeit vorgestellt wurde, waren alle Websites Sammlungen von statischen HTML-Dokumenten – jede Datei enthielt das Markup, das erforderlich war, um eine komplette Seite in einem Webbrowser darzustellen. Fast sofort machten sich die Pioniere des Internets daran, Webseiten dynamisch zu erstellen, indem sie Code auf Webservern ablaufen ließen und Inhalte aus Datenbanksystemen extrahierten.

Obwohl statische Websites nicht ganz verschwanden, als CMS die Oberhand gewannen, ist eine moderne Herangehensweise an das Konzept der statischen Websites heute bei denjenigen beliebt, die Wert auf Geschwindigkeit und Sicherheit legen.

Auf der statischen Seiten-Hosting-Plattform von Kinsta sind Websites tatsächlich schnell und sicher. Sie sind außerdem kostenlos.

Werfen wir einen genaueren Blick auf statische Websites und darauf, wie Kinsta dir helfen kann, deine Website auf Edge-Servern weltweit bereitzustellen.

Ist eine statische Website das Richtige für dein Webprojekt?

Eine statische Website bietet vorgefertigte HTML-, CSS-, JavaScript- und Mediendateien.

„Der Vorteil von statischen Inhalten ist, dass sie schnell und effizient sind“, sagt Michael Fuller, JavaScript-Entwickler bei Kinsta und Mitglied des Teams, das an der Einführung der statischen Seiten Hosting-Plattform von Kinsta beteiligt war. „Der Server muss die Seite nicht erst aufbauen, indem er mit der Datenbank spricht, sondern schickt den Nutzern einfach die vorgefertigten Dateien.“

„Anstatt statische Dateien komplett von Hand zu erstellen, gibt es eine Reihe von Generatoren für statische Websites„, sagt er. „Das sind Kits, die den Erstellungs- und Aktualisierungsprozess einer statischen Website vereinfachen, indem sie die von dir bereitgestellten Dateien in eine funktionierende Website verwandeln.“

Welche Art von Projekten können als statische Websites eingesetzt werden?

„Wenn du keine Seiten hast, auf denen man sich einloggen muss, keine Datenbank oder etwas anderes, das dynamische Inhalte erfordert, dann hast du wahrscheinlich einen guten Kandidaten für eine statische Website“, sagt Fuller. „Das können z. B. Portfolios, Marketingseiten oder sogar ein Blog sein, wenn du mit einem statischen Website-Generator neue Beiträge schreiben kannst.“

Und wenn eine Website keine Verbindung zu einem Server oder einer Datenbank hat, bietet sie weniger Möglichkeiten für Sicherheitsverletzungen.

„Für fortgeschrittene Fälle kannst du einen gemischten Ansatz wählen“, sagt Fuller. „Du kannst eine statische Website erstellen, die ein JavaScript-Framework nutzt, um mit einem separat verwalteten Server zu kommunizieren. Auf diese Weise erhältst du die Geschwindigkeitsvorteile bei den anfänglichen Ladezeiten, kombiniert mit der Flexibilität einer dynamischen Website.“

Ein Überblick über das statische Website-Hosting bei Kinsta

Hier ist, was du auf der Hosting-Plattform für statische Seiten von Kinsta kostenlos bekommst:

  • 100 statische Websites pro Unternehmen
  • 1 gleichzeitige Erstellung pro Website
  • 1 GB Build-Image-Größe pro Website
  • 600 Erstellungsminuten pro Monat und Unternehmen
  • 100 GB Bandbreite pro Monat und Unternehmen

Wie bei den Plattformen Anwendungs-Hosting und Managed WordPress Hosting von Kinsta gibt es auch hier kostenlose SSL-Zertifikate, Unterstützung für benutzerdefinierte Domainnamen und eine optionale API für die Website-Verwaltung.

Kinsta erstellt und überträgt statische Website-Inhalte an die 260+ Rechenzentren im globalen Cloudflare-Netzwerk – dieselbe Plattform, die auch das Kinsta CDN und das Edge-Caching für WordPress-Sites unterstützt.

Bereitstellen einer statischen Website bei Kinsta

Der erste Schritt bei der Bereitstellung einer statischen Website bei Kinsta ist die Verbindung deines bevorzugten Git-Hosts mit deinem Konto in MyKinsta.

„Wir unterstützen derzeit drei der führenden Git-Anbieter: BitBucket, GitHub und GitLab„, sagt Fuller. „Das bedeutet, dass du zusätzlich zu den Vorteilen, die wir für deine Website bieten, auch deren Versionskontrolle und Tools nutzen kannst.“

Auswahl eines Git-Anbieters in MyKinsta
Auswahl eines Git-Anbieters in MyKinsta

Nachdem du den Zugriff von MyKinsta auf deinen Git-Anbieter autorisiert hast, kannst du deine erste statische Website hinzufügen, indem du ihr Repository und ihren Zweig auswählst:

Hinzufügen einer statischen Website in MyKinsta
Hinzufügen einer statischen Website in MyKinsta

Oben haben wir die automatische Bereitstellung bei der Übergabe ausgewählt. Das bedeutet, dass Kinsta die Site neu bereitstellt, wenn Änderungen in den Zweig auf dem Git-Host übertragen werden.

Als Nächstes wird MyKinsta versuchen, die für dein Projekt erforderlichen Build-Einstellungen zu ermitteln:

MyKinsta Static Site Hosting Details hinzufügen
Ermittelte Build-Einstellungen für ein Projekt, das Nuxt.js zur Erstellung einer statischen Website verwendet

„Wenn wir in der Lage sind, den Generator und den Paketmanager zu erkennen, den du verwendest, füllen wir diese mit den dafür verwendeten Standardkonventionen aus“, sagt Fuller. „Zum Beispiel lautet der Befehl für Node.js-basierte Builds normalerweise yarn build oder npm run build, und das Veröffentlichungsverzeichnis ist normalerweise etwas wie build, dist, public oder out.“

„Du kannst auch deine eigenen Umgebungsvariablen angeben, wenn dein Build-Prozess davon Gebrauch macht

„In der ersten Version von Static Site Hosting unterstützen wir nur Node.js für die Erstellung von Websites“, sagt Fuller, „aber wir arbeiten daran, dir in Zukunft weitere Plattformen anzubieten

Du kannst jedoch auch viele statische Websites erstellen, die nicht auf Node.js-Tools angewiesen sind. Als Beispiele haben wir beschrieben, wie du eine Jekyll- und eine Hugo-Site bereitstellst, die beide nicht mit Node.js gebaut werden können. In beiden Fällen werden die Website-Assets außerhalb der Kinsta-Plattform erstellt und dann einem Ordner oder einer Verzweigung in einem Git-Repository hinzugefügt, um als statische Website bereitgestellt zu werden.

Du kannst auch statische Inhalte bereitstellen, für die es keinen Build-Schritt gibt, z. B. einfache HTML-Seiten.

„Wenn du keinen Generator verwendest, muss kein Build-Befehl angegeben werden und wir gehen davon aus, dass dein Repository vorgefertigte Dateien enthält“, sagt Fuller.

Sobald eine Bereitstellung ausgelöst wird, wird es zur Build-Warteschlange der Website hinzugefügt.

„Wenn die Bereitstellung beginnt, erstellen wir eine Build-Instanz in Google Cloud Platform und ziehen den Code aus deinem Repository“, sagt Fuller. „Wenn ein Build-Befehl angegeben wurde, verwenden wir ein Image, das auf der von dir angegebenen Plattform basiert – im Moment Node.js – um diesen Befehl auszuführen. Danach überprüfen wir die Dateigröße aller Dateien im Veröffentlichungsverzeichnis, um sicherzustellen, dass sie innerhalb unserer Grenzen liegt.“

„Der letzte Schritt ist der Upload, bei dem wir deine Dateien in einen Cloudflare R2 Bucket pushen

MyKinsta Static Site Hosting Website Details
Details zur neuen statischen Website-Bereitstellung

Maximale Geschwindigkeit mit inkrementellen Bereitstellungen

Der Bereitstellungsprozess beim Static Site Hosting optimiert die Erstellungszeiten, indem nur die Dateien auf die Cloudflare-Server hochgeladen werden, die sich tatsächlich geändert haben.

„Wir behalten die zuvor hochgeladenen Dateien über mehrere Bereitstellungen hinweg bei. Wenn du also eine frühere Version erneut bereitstellen möchtest, müssen nur wenige Dateien neu hochgeladen werden“, sagt Fuller. „Dazu benennen wir die Dateien in den Hash-Wert ihres Inhalts um und halten die ursprünglichen Pfade fest. Diese speichern wir in einer Map-Datei für die jeweilige Bereitstellung, wobei der Pfad der Schlüssel und der neue Name der Wert ist.

„Wenn eine Anfrage an die Website gesendet wird, verwenden wir die Map der aktuellen Bereitstellung, um zur richtigen Version der Datei zu gelangen.“

Static Site Hosting Infrastruktur
Die Infrastruktur hinter dem Static Site Hosting von Kinsta

Zusammenfassung

Die statische Seiten Hosting-Plattform von Kinsta bietet eine blitzschnelle Bereitstellung von Inhalten auf einem erstklassigen Netzwerk von Edge-Servern, unterstützt durch das MyKinsta-Dashboard, das die Bereitstellung zum Kinderspiel macht.

Und das alles ist kostenlos.

Wenn du schnell mit dem statischen Seiten-Hosting bei Kinsta loslegen willst, schau dir unsere Bibliothek mit Schnellstart-Beispielen für eine Reihe von statischen Seiten Generatoren an. Die Beispiele enthalten Git-Repositories, die du kopieren kannst, um deine eigenen Projekte zu starten.

Steve Bonisteel Kinsta

Steve Bonisteel is a Technical Editor at Kinsta who began his writing career as a print journalist, chasing ambulances and fire trucks. He has been covering Internet-related technology since the late 1990s.