Wie laden Sie Ihre Dateien auf einen Webserver hoch?

Zusammenfassung

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

SFTP

Es gibt mehrere SFTP-Clients. Unsere Demonstration behandelt FileZilla, da es kostenlos und für Windows, macOS und Linux verfügbar ist. Um FileZilla zu installieren, gehen Sie zur FileZilla-Downloadseite, klicken Sie auf die große Schaltfläche „Download“ und installieren Sie es anschließend wie gewohnt über die Installationsdatei.

Öffnen Sie die FileZilla-Anwendung; Sie sollten in etwa Folgendes sehen:

Anmelden

Für dieses Beispiel nehmen wir an, dass unser Hosting-Anbieter (der Dienst, der unseren HTTP-Webserver hostet) ein fiktives Unternehmen namens „Example Hosting Provider“ ist, dessen URLs wie folgt aussehen: mypersonalwebsite.examplehostingprovider.net.

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

Herzlichen Glückwunsch zur Eröffnung eines Kontos bei Example Hosting Provider.

Ihr Konto lautet: demozilla

Ihre Website wird unter demozilla.examplehostingprovider.net sichtbar sein.

Um auf diesem 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 zunächst http://demozilla.examplehostingprovider.net/ an — wie Sie sehen können, befindet sich dort bisher nichts:

Um Ihren SFTP-Client mit dem Remote-Server zu verbinden, führen Sie diese Schritte aus:

1. Wählen Sie im Hauptmenü File > Site Manager….
2. Klicken Sie im Fenster Site Manager auf die Schaltfläche New Site und geben Sie dann im vorgesehenen Feld demozilla als Namen der Website ein.
3. Geben Sie den von Ihrem Hoster bereitgestellten SFTP-Server in das Feld Host: ein.
4. Wählen Sie im Dropdown-Menü Logon Type: die Option Normal und geben Sie anschließend Ihren bereitgestellten Benutzernamen und Ihr Passwort in die entsprechenden Felder ein.
5. Geben Sie den richtigen Port und weitere Informationen ein.

Ihr Fenster sollte in etwa so aussehen:

Klicken Sie nun auf Connect, um sich mit dem SFTP-Server zu verbinden.

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

Hier und dort: lokale und Remote-Ansicht

Nach dem Herstellen der Verbindung sollte Ihr Bildschirm etwa so aussehen (wir haben uns mit einem eigenen Beispiel verbunden, um Ihnen eine Vorstellung zu geben):

Sehen wir uns an, was Sie sehen:

• Im mittleren linken Bereich sehen Sie Ihre lokalen Dateien. Navigieren Sie zu dem Verzeichnis, in dem Sie Ihre Website speichern (z. B. mdn).
• Im mittleren rechten Bereich sehen Sie Remote-Dateien. Wir sind beim Remote-FTP-Root angemeldet (in diesem Fall users/demozilla).
• Den unteren und oberen Bereich können Sie vorerst ignorieren. Sie zeigen jeweils ein Protokoll der Meldungen zum Verbindungsstatus zwischen Ihrem Computer und dem SFTP-Server sowie ein Live-Protokoll jeder Interaktion zwischen Ihrem SFTP-Client und dem Server.

Auf den Server hochladen

Die Anweisungen unseres Beispiel-Hosters besagten: „Um im Web zu veröffentlichen, legen Sie Ihre Dateien im Verzeichnis Public/htdocs ab.“ Sie müssen im rechten Bereich zum angegebenen Verzeichnis navigieren. Dieses Verzeichnis ist praktisch das Root-Verzeichnis Ihrer Website — dorthin gehören Ihre Datei index.html und andere Assets.

Sobald Sie das richtige Remote-Verzeichnis für Ihre Dateien gefunden haben, müssen Sie Ihre Dateien per Drag-and-Drop aus dem linken Bereich in den rechten Bereich ziehen, um sie auf den Server hochzuladen.

Sind sie wirklich online?

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

Und unsere Website ist online!

Rsync

Rsync ist ein Werkzeug zur Dateisynchronisierung von einem lokalen zu einem Remote-System, das im Allgemeinen auf den meisten Unix-basierten Systemen (wie macOS und Linux) verfügbar ist. Es gibt jedoch auch Versionen für Windows.

Es gilt als fortgeschritteneres Werkzeug als SFTP, da es standardmäßig auf der Kommandozeile verwendet wird. Ein grundlegender Befehl sieht folgendermaßen aus:

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

• -options ist ein Bindestrich, gefolgt von einem oder mehreren Buchstaben, beispielsweise -v für ausführliche Fehlermeldungen und -b zum Erstellen von Sicherungskopien. Die vollständige Liste finden Sie auf der rsync-Manpage (suchen Sie nach „Options summary“).
• SOURCE ist der Pfad zu der lokalen Datei oder dem lokalen Verzeichnis, von der bzw. dem Sie Dateien kopieren möchten.
• user@ sind die Zugangsdaten des Benutzers auf dem Remote-Server, auf den Sie Dateien kopieren möchten.
• x.x.x.x ist die IP-Adresse des Remote-Servers.
• DESTINATION ist der Pfad zu dem Speicherort auf dem Remote-Server, in den Sie Ihr Verzeichnis oder Ihre Dateien kopieren möchten.

Solche Angaben müssen Sie von Ihrem Hosting-Anbieter erhalten.

Weitere Informationen und Beispiele finden Sie unter 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 Option -e verwenden. Zum Beispiel:

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

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

Rsync-GUI-Werkzeuge

Für Rsync sind GUI-Werkzeuge verfügbar, für diejenigen, die sich bei der Verwendung der Kommandozeile nicht so wohlfühlen. Acrosync ist ein solches Werkzeug und für Windows und macOS verfügbar.

Auch hier müssten Sie die Zugangsdaten für die Verbindung von Ihrem Hosting-Anbieter erhalten, hätten dann aber eine GUI, in die Sie sie eingeben können.

GitHub

GitHub ermöglicht es Ihnen, Websites über GitHub Pages (gh-pages) zu veröffentlichen.

Wir haben die Grundlagen dazu bereits im Artikel Ihre Website veröffentlichen aus unserem Leitfaden Erste Schritte mit dem Web behandelt, daher werden wir hier nicht alles wiederholen.

Es ist jedoch hilfreich zu wissen, dass Sie eine Website auch auf GitHub hosten und dafür eine benutzerdefinierte Domain verwenden können. Einen ausführlichen Leitfaden finden Sie unter Using a custom domain with GitHub Pages.

Andere Methoden zum Hochladen von Dateien

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

• Web interfaces. Eine HTML-Oberfläche, die als Frontend für einen Remote-Datei-Upload-Dienst dient. Wird von Ihrem Hosting-Dienst bereitgestellt.
• WebDAV. Eine Erweiterung des HTTP-Protokolls, die eine erweiterte Dateiverwaltung ermöglicht.