Wie laden Sie Ihre Dateien auf einen Webserver hoch?

Wenn Sie eine einfache Webseite erstellt haben (siehe HTML-Grundlagen für ein Beispiel), möchten Sie sie wahrscheinlich online, auf einem Webserver, veröffentlichen. In diesem Artikel werden wir besprechen, wie das mit verschiedenen verfügbaren Optionen wie SFTP-Clients, RSync und GitHub geschehen kann.

Es gibt verschiedene SFTP-Clients. Unsere Demo behandelt FileZilla, da es kostenlos ist und für Windows, macOS und Linux verfügbar ist. Um FileZilla zu installieren, gehen Sie auf die FileZilla-Download-Seite, klicken Sie auf den großen Download-Button und installieren Sie es dann wie gewohnt vom Installationsprogramm.

Öffnen Sie die FileZilla-Anwendung; Sie sollten etwas Ähnliches sehen:

Für dieses Beispiel nehmen wir an, dass unser Hosting-Anbieter (der Dienst, der unseren HTTP-Webserver hosten wird) eine fiktive Firma "Beispiel-Hosting-Anbieter" ist, deren URLs so aussehen: mypersonalwebsite.examplehostingprovider.net.

Wir haben gerade ein Konto eröffnet und diese Informationen von ihnen erhalten:

Herzlichen Glückwunsch zur Kontoeröffnung bei Beispiel-Hosting-Anbieter.

Ihr Konto lautet: demozilla

Ihre Website wird unter demozilla.examplehostingprovider.net sichtbar sein

Um auf dieses Konto zu veröffentlichen, verbinden Sie sich bitte über SFTP mit den folgenden Zugangsdaten:

• SFTP-Server: sftp://demozilla.examplehostingprovider.net
• Benutzername: demozilla
• Passwort: quickbrownfox
• Port: 5548
• Um im Web zu veröffentlichen, legen Sie Ihre Dateien im Verzeichnis Public/htdocs ab.

Sehen wir uns zuerst http://demozilla.examplehostingprovider.net/ an — wie Sie sehen können, ist dort bisher nichts:

Um Ihren SFTP-Client mit dem entfernten Server zu verbinden, folgen Sie diesen Schritten:

1. Wählen Sie Datei > Servermanager… im Hauptmenü.
2. Drücken Sie im Servermanager-Fenster die Schaltfläche Neue Seite, dann füllen Sie im vorgesehenen Feld den Seitennamen als demozilla aus.
3. Geben Sie den von Ihrem Host bereitgestellten SFTP-Server im Feld Host: ein.
4. Wählen Sie im Dropdown-Menü Anmeldetyp: Normal, und geben Sie Ihren Benutzernamen und Ihr Passwort in die entsprechenden Felder ein.
5. Geben Sie den richtigen Port und andere Informationen ein.

Ihre Fensteransicht sollte ungefähr so aussehen:

Drücken Sie nun Verbinden, um sich mit dem SFTP-Server zu verbinden.

Hinweis: Stellen Sie sicher, dass Ihr Hosting-Anbieter eine SFTP (Secure FTP)-Verbindung zu Ihrem Hosting-Bereich anbietet. FTP ist von Natur aus unsicher und sollte nicht verwendet werden.

Sobald Sie verbunden sind, sollte Ihr Bildschirm in etwa so aussehen (wir haben unser eigenes Beispiel angeschlossen, um Ihnen eine Vorstellung zu geben):

Lassen Sie uns ansehen, was Sie sehen:

• Im linken mittleren Bereich sehen Sie Ihre lokalen Dateien. Navigieren Sie in das Verzeichnis, in dem Sie Ihre Website speichern (z. B. mdn).
• Im rechten mittleren Bereich sehen Sie entfernte Dateien. Wir sind in unser entferntes FTP-Stammverzeichnis eingeloggt (in diesem Fall users/demozilla).
• Sie können die unteren und oberen Bereiche vorerst ignorieren. Diese zeigen respektive ein Protokoll von Nachrichten an, die den Verbindungsstatus zwischen Ihrem Computer und dem SFTP-Server anzeigen, sowie ein Live-Protokoll jeder Interaktion zwischen Ihrem SFTP-Client und dem Server.

Unsere Beispielhostanweisungen sagten uns: "Um im Web zu veröffentlichen, legen Sie Ihre Dateien im Verzeichnis Public/htdocs ab." Sie müssen in Ihrem rechten Bereich zu dem angegebenen Verzeichnis navigieren. Dieses Verzeichnis ist im Wesentlichen das Wurzelverzeichnis Ihrer Website — dorthin gehören Ihre index.html-Datei und andere Assets.

Sobald Sie das richtige entfernte Verzeichnis gefunden haben, um Ihre Dateien abzulegen, ziehen Sie zum Hochladen Ihrer Dateien auf den Server diese einfach von links nach rechts.

So weit, so gut, aber sind die Dateien wirklich online? Sie können dies überprüfen, indem Sie zu Ihrer Website (z. B. http://demozilla.examplehostingprovider.net/) in Ihrem Browser zurückkehren:

Und unsere Website ist live!

Rsync ist ein Werkzeug zur Synchronisierung von Dateien zwischen lokalem und entferntem Speicher, das auf den meisten Unix-basierten Systemen (wie macOS und Linux) allgemein verfügbar ist, aber auch Windows-Versionen existieren.

Es gilt als ein fortgeschritteneres Werkzeug als SFTP, da es standardmäßig in der Befehlszeile verwendet wird. Ein grundlegender Befehl sieht so aus:

rsync [-options] SOURCE user@x.x.x.x:DESTINATION

• -options ist ein Bindestrich, gefolgt von einem oder mehreren Buchstaben, zum Beispiel -v für ausführliche Fehlermeldungen und -b zum Erstellen von Backups. Die vollständige Liste finden Sie auf der rsync Man-Seite (suchen Sie nach "Options summary").
• SOURCE ist der Pfad zur lokalen Datei oder zum Verzeichnis, von dem Sie Dateien kopieren möchten.
• user@ sind die Anmeldedaten des Benutzers auf dem entfernten Server, zu dem Sie Dateien kopieren möchten.
• x.x.x.x ist die IP-Adresse des entfernten Servers.
• DESTINATION ist der Pfad zum Speicherort, an den Sie Ihr Verzeichnis oder Ihre Dateien auf dem entfernten Server kopieren möchten.

Solche Details müssten Sie von Ihrem Hosting-Anbieter erhalten.

Für weitere Informationen und Beispiele siehe How to Use Rsync to Copy/Sync Files Between Servers.

Natürlich ist es eine gute Idee, wie bei FTP eine sichere Verbindung zu verwenden. Im Fall von Rsync geben Sie SSH-Details an, um die Verbindung über SSH herzustellen, indem Sie die -e Option verwenden. Zum Beispiel:

rsync [-options] -e "ssh [SSH DETAILS GO HERE]" SOURCE user@x.x.x.x:DESTINATION

Weitere Details zu den erforderlichen Informationen finden Sie unter How To Copy Files With Rsync Over SSH.

Für Rsync sind GUI-Tools verfügbar (für diejenigen, die sich mit der Befehlszeile nicht so wohl fühlen). Acrosync ist ein solches Tool, und es ist für Windows und macOS erhältlich.

Auch hier müssten Sie die Verbindungsdaten von Ihrem Hosting-Anbieter erhalten, aber auf diese Weise hätten Sie eine grafische Benutzeroberfläche, um sie einzugeben.

GitHub ermöglicht das Veröffentlichen von Websites über GitHub Pages (gh-pages).

Die Grundlagen zur Nutzung dieses Dienstes haben wir in dem Artikel Veröffentlichen Ihrer Website aus unserem Einstieg in das Web Leitfaden behandelt, daher werden wir hier nicht alles wiederholen.

Es ist jedoch wissenswert, dass Sie auch eine Website auf GitHub hosten können, jedoch mit einer benutzerdefinierten Domain. Weitere Informationen finden Sie unter Using a custom domain with GitHub Pages.

Das FTP-Protokoll ist eine bekannte Methode zur Veröffentlichung einer Website, aber nicht die einzige. Hier sind einige weitere Möglichkeiten:

• Webschnittstellen. Eine HTML-Oberfläche dient als Front-End für einen Dienst zum Hochladen von Dateien. Bereitgestellt von Ihrem Hosting-Dienst.
• WebDAV. Eine Erweiterung des HTTP Protokolls, um erweiterte Datei-Management-Möglichkeiten zu ermöglichen.