Veröffentlichung Ihrer Website

Sobald Sie den Code geschrieben und die Dateien organisiert haben, die Ihre Website ausmachen, müssen Sie alles online stellen, damit Leute es finden können. Dieser Artikel erklärt, wie Sie Ihren einfachen Beispielcode mit wenig Aufwand online stellen können.

Welche Optionen gibt es?

Die Veröffentlichung einer Website ist ein komplexes Thema, da es viele verschiedene Methoden gibt. Dieser Artikel versucht nicht, alle möglichen Methoden zu dokumentieren. Stattdessen erklärt er die Vor- und Nachteile von drei Ansätzen, die für Anfänger praktisch sind. Dann wird eine Methode beschrieben, die für viele Leser sofort funktionieren kann.

Hosting und einen Domainnamen erhalten

Um mehr Kontrolle über den Inhalt und das Erscheinungsbild der Website zu haben, wählen die meisten Menschen den Kauf von Webhosting und einem Domainnamen:

  • Webhosting ist gemieteter Speicherplatz auf dem Webserver eines Hosting-Unternehmens. Dort legen Sie die Website-Dateien ab. Der Webserver stellt die Inhalte der Website den Besuchern zur Verfügung.
  • Ein Domainname ist die eindeutige Adresse, unter der Menschen Ihre Website finden, wie z.B. https://www.mozilla.org oder https://www.bbc.co.uk. Sie können Ihren Domainnamen von einem Domainregistrar für so viele Jahre mieten, wie Sie möchten.

Viele professionelle Websites gehen auf diese Weise online.

Darüber hinaus benötigen Sie ein File Transfer Protocol (FTP)-Programm (siehe Was kostet es: Software für weitere Details), um die Website-Dateien tatsächlich auf den Server zu übertragen. FTP-Programme variieren stark, aber im Allgemeinen müssen Sie sich mit den von Ihrem Hosting-Unternehmen bereitgestellten Details (normalerweise Benutzername, Passwort, Hostname) mit Ihrem Webserver verbinden. Dann zeigt Ihnen das Programm Ihre lokalen Dateien und die Dateien des Webservers in zwei Fenstern an und bietet eine Möglichkeit, Dateien hin und her zu übertragen.

Ein FTP-Client, der alle Dateien und Ordner einer Website anzeigt und sie auf einen Server hochlädt

Tipps zur Suche nach Hosting und Domains

  • MDN bewirbt keine spezifischen kommerziellen Hosting-Unternehmen oder Domainregistrare. Um Hosting-Unternehmen und Registrare zu finden, suchen Sie einfach nach "Webhosting" und "Domainnamen". Alle Registrare haben eine Funktion, mit der Sie prüfen können, ob der gewünschte Domainname verfügbar ist.
  • Ihr Heim- oder Büro-Internetdienstanbieter bietet möglicherweise begrenztes Hosting für eine kleine Website an. Der verfügbare Funktionsumfang ist begrenzt, könnte aber perfekt für Ihre ersten Experimente sein.
  • Es gibt auch kostenlose Dienste wie Neocities, Google Sites, Blogger und WordPress. Manchmal bekommen Sie das, wofür Sie bezahlen, aber manchmal sind diese Ressourcen für Ihre ersten Experimente gut genug.
  • Viele Unternehmen bieten Hosting und Domains an.

Verwendung eines Online-Tools wie GitHub oder Google App Engine

Einige Tools ermöglichen es Ihnen, Ihre Website online zu veröffentlichen:

  • GitHub ist eine "soziale Coding"-Seite. Sie ermöglicht es Ihnen, Code-Repositories zur Speicherung im Git-Versionsverwaltungssystem hochzuladen. Sie können dann an Codeprojekten zusammenarbeiten, und das System ist standardmäßig open-source, was bedeutet, dass jeder auf der Welt Ihren GitHub-Code finden, verwenden, daraus lernen und ihn verbessern kann. GitHub hat eine sehr nützliche Funktion namens GitHub Pages, mit der Sie Website-Code live im Internet präsentieren können.
  • Google App Engine ist eine leistungsstarke Plattform, die es Ihnen ermöglicht, Anwendungen auf der Infrastruktur von Google zu erstellen und auszuführen – egal ob Sie eine mehrschichtige Webanwendung von Grund auf neu erstellen oder eine statische Website hosten. Weitere Informationen finden Sie unter Wie hosten Sie Ihre Website auf Google App Engine?.

Diese Optionen sind normalerweise kostenlos, aber Sie könnten den begrenzten Funktionsumfang irgendwann hinter sich lassen.

Verwendung einer webbasierten IDE wie CodePen

Es gibt eine Reihe von Web-Apps, die eine Website-Entwicklungsumgebung emulieren und es Ihnen ermöglichen, HTML, CSS und JavaScript einzugeben und dann das Ergebnis dieses Codes als Website anzuzeigen – alles in einem Browser-Tab. Im Allgemeinen sind diese Tools relativ einfach, hervorragend für das Lernen, gut zum Teilen von Code (z.B. wenn Sie eine Technik mit Kollegen in einem anderen Büro teilen oder Fehler beheben möchten) und kostenlos (für grundlegende Funktionen). Sie hosten Ihre gerenderte Seite unter einer eindeutigen Webadresse. Allerdings sind die Funktionen begrenzt, und diese Apps bieten normalerweise keinen Hosting-Platz für Assets (wie Bilder).

Probieren Sie einige dieser Beispiele aus, um herauszufinden, welche am besten für Sie geeignet ist:

Screenshot der webbasierten IDE JS Bin

Veröffentlichung über GitHub

Schauen wir uns nun an, wie Sie Ihre Website ganz einfach über GitHub Pages veröffentlichen können.

  1. Melden Sie sich zuerst bei GitHub an und verifizieren Sie Ihre E-Mail-Adresse.

  2. Als Nächstes müssen Sie ein Repository erstellen, um Dateien zu speichern.

  3. Geben Sie auf dieser Seite im Feld Repository name benutzername.github.io ein, wobei benutzername Ihr Benutzername ist. Unser Freund Bob Smith würde also bobsmith.github.io eingeben. Aktivieren Sie das Kästchen "Initialize this repository with a README". Klicken Sie dann auf Create repository. Ein Beispiel einer GitHub Repository-Seite

  4. Ziehen Sie den Inhalt Ihres Website-Ordners in Ihr Repository. Klicken Sie dann auf Commit changes.

    Hinweis: Stellen Sie sicher, dass Ihr Ordner eine index.html-Datei enthält.

  5. Navigieren Sie Ihren Browser zu benutzername.github.io, um Ihre Website online zu sehen. Für den Benutzernamen chrisdavidmills gehen Sie zum Beispiel zu chrisdavidmills.github.io.

    Hinweis: Es kann einige Minuten dauern, bis Ihre Website online geht. Wenn Ihre Website nicht sofort angezeigt wird, warten Sie einige Minuten und versuchen Sie es erneut.

Weitere Informationen finden Sie unter GitHub Pages Hilfe.

Weiterführende Lektüre