Eine statische Website ist eine Sammlung statischer Dateien, die der Browser des Benutzers gleich zu Beginn des Website-Ladevorgangs abruft. Im Gegensatz zu dynamischen Websites, die bei jedem Besuch eines Benutzers spontan generiert werden, sind statische Webseiten lediglich eine Ansammlung von HTML, Bildern, Stilen, Skripten und anderen Dateien.

Struktur einer statischen Website

Damit alles übersichtlich bleibt, empfiehlt es sich, die Website in folgende Verzeichnisse und Dateien aufzuteilen:

1. index.html: Dies ist die Startseite Ihrer Website und im Allgemeinen die erste Datei, die Benutzer sehen, wenn sie auf Ihre Website zugreifen. Es sollte die Grundstruktur und den Inhalt Ihrer Website enthalten, einschließlich einer Kopfzeile, eines Navigationsmenüs, eines Hauptinhaltsbereichs und einer Fußzeile.

2. CSS-Ordner: In diesem Ordner werden die Stylesheets Ihrer Website gespeichert, die das Erscheinungsbild Ihrer Website steuern, z. B. Schriftart, Farben, Layout und mehr.

3. Bilderordner: Dieser Ordner enthält alle auf Ihrer Website verwendeten Bilder, wie Logos, Illustrationen und Fotos.

4. Skriptordner: Dieser Ordner enthält alle JavaScript-Dateien, die Sie für interaktive Funktionen und dynamische Effekte auf Ihrer Website verwenden.

5. Favicon.ico: Diese winzige Datei ist für das kleine Bild verantwortlich, das im Tab Ihres Browsers, in Ihren Lesezeichen und anderswo angezeigt wird.

6. Robots.txt-Datei: Diese Textdatei steuert das Crawling und die Indexierung Ihrer Website durch Suchmaschinen.

7. .htaccess-Datei: Diese optionale Konfigurationsdatei wird für erweiterte Einstellungen wie die Umleitung von URLs, das Einrichten des Passwortschutzes und mehr verwendet.

So erstellen Sie eine statische Website

Beim Erstellen einer statischen Website werden die Struktur und der Inhalt der Website mithilfe von HTML, CSS und JavaScript erstellt und auf einem Webserver gehostet. Hier ist eine grundlegende Übersicht über die Schritte, die Sie befolgen können:

1. Planen Sie Ihre Website: Definieren Sie Zweck, Struktur und Inhalt Ihrer Website. Zeichnen Sie eine Sitemap, um zu visualisieren, wie die Seiten miteinander verknüpft werden.

2. Erstellen Sie die HTML-Dateien: Schreiben Sie den HTML-Code für jede Seite Ihrer Website, einschließlich der Kopf-, Navigations-, Hauptinhalts- und Fußzeilenabschnitte.

3. Design mit CSS: Erstellen Sie CSS-Stylesheets, um das Erscheinungsbild und Layout Ihrer Website zu definieren, z. B. Schriftarten, Farben und Positionierung.

4. Fügen Sie Funktionen mit JavaScript hinzu: Verwenden Sie JavaScript für alle interaktiven Elemente wie Menüs, Formulare, Animationen und mehr.

5. Bilder optimieren: Komprimieren und optimieren Sie Bilder, um ihre Dateigröße zu reduzieren, ohne die visuelle Qualität zu beeinträchtigen.

6. Testen Sie Ihre Website: Testen Sie Ihre Website gründlich auf verschiedenen Browsern und Geräten, um sicherzustellen, dass sie wie vorgesehen funktioniert.

7. Wählen Sie einen Webhosting-Anbieter: Wählen Sie einen Webhosting-Anbieter aus, der Unterstützung für statische Websites bietet.

8. Stellen Sie Ihre Website bereit: Laden Sie die Dateien und Ordner Ihrer Website auf den von Ihnen gewählten Hosting-Anbieter hoch.

9. Bewerben Sie Ihre Website: Sobald Ihre Website online ist, vermarkten und bewerben Sie sie, um ihre Sichtbarkeit zu erhöhen und Besucher anzulocken.