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 bereitstellen. In diesem Artikel besprechen wir, wie Sie dies mit verschiedenen verfügbaren Optionen wie SFTP-Clients, RSync und GitHub tun können.

Es gibt mehrere SFTP-Clients. In unserer Demo behandeln wir FileZilla, da es kostenlos und für Windows, macOS und Linux verfügbar ist. Um FileZilla zu installieren, gehen Sie zur Download-Seite von FileZilla, klicken Sie auf den großen Download-Button und installieren Sie es wie gewohnt aus der Installationsdatei.

Öffnen Sie die FileZilla-Anwendung; Sie sollten etwas wie dies sehen:

In diesem Beispiel nehmen wir an, dass unser Hosting-Anbieter (der Dienst, der unseren HTTP-Webserver hosten wird) ein fiktives Unternehmen "Example Hosting Provider" ist, dessen URLs wie folgt aussehen: mypersonalwebsite.examplehostingprovider.net.

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

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

Ihr Konto ist: demozilla

Ihre Website ist sichtbar unter demozilla.examplehostingprovider.net

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

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

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

Um Ihren SFTP-Client mit dem entfernten Server zu verbinden, befolgen Sie diese Schritte:

1. Wählen Sie Datei > Seitenmanager… aus dem Hauptmenü.
2. Drücken Sie im Seitenmanager-Fenster die Neue Seite-Taste und füllen Sie dann den Seitennamen als demozilla in den bereitgestellten Raum aus.
3. Geben Sie den SFTP-Server, den Ihr Host bereitgestellt hat, im Host:-Feld ein.
4. Wählen Sie im Anmeldetyp: Dropdown Normal aus und füllen Sie Ihren bereitgestellten Benutzernamen und Passwort in die entsprechenden Felder aus.
5. Geben Sie den richtigen Port und andere Informationen ein.

Ihr Fenster sollte etwa 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 Sie sollten es nicht verwenden.

Sobald die Verbindung hergestellt ist, sollte Ihr Bildschirm in etwa so aussehen (wir haben uns mit einem eigenen Beispiel verbunden, um Ihnen eine Vorstellung zu geben):

Lassen Sie uns ansehen, was Sie sehen:

• In der Mitte links sehen Sie Ihre lokalen Dateien. Navigieren Sie in das Verzeichnis, in dem Sie Ihre Website speichern (z. B. mdn).
• In der Mitte rechts sehen Sie entfernte Dateien. Wir sind in unseren entfernten FTP-Root eingeloggt (in diesem Fall users/demozilla).
• Sie können die unteren und oberen Bereiche vorerst ignorieren. Diese sind respektive ein Log von Nachrichten, die den Verbindungsstatus zwischen Ihrem Computer und dem SFTP-Server anzeigen, und ein Live-Log von jeder Interaktion zwischen Ihrem SFTP-Client und dem Server.

Unsere Beispielanweisungen des Hosts sagten uns: "Um im Web zu veröffentlichen, legen Sie Ihre Dateien in das Verzeichnis Public/htdocs." Sie müssen im rechten Bereich zu dem angegebenen Verzeichnis navigieren. Dieses Verzeichnis ist effektiv das Root Ihrer Website — dort werden Ihre index.html-Datei und andere Ressourcen abgelegt.

Sobald Sie das richtige entfernte Verzeichnis gefunden haben, in das Sie Ihre Dateien legen möchten, ziehen Sie sie vom linken Bereich in den rechten Bereich, um Ihre Dateien auf den Server hochzuladen.

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

Und unsere Website ist live!

Rsync ist ein lokales zu entferntes Datei-Synchronisierungstool, das normalerweise auf den meisten Unix-basierten Systemen (wie macOS und Linux) verfügbar ist, aber es gibt auch Windows-Versionen.

Es wird als ein fortschrittlicheres Werkzeug als SFTP angesehen, da es standardmäßig in der Befehlszeile verwendet wird. Ein einfacher 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 um Sicherungen zu erstellen. 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 die 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 Ort, 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 mehr Informationen und weitere Beispiele, siehe Anleitung zur Nutzung von Rsync zum Kopieren/Syncen von Dateien zwischen Servern.

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

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

Weitere Details zu den Anforderungen finden Sie unter Dateien mit Rsync über SSH kopieren.

Für Rsync sind GUI-Tools verfügbar (für diejenigen, die sich nicht so wohl fühlen, die Befehlszeile zu verwenden). Acrosync ist ein solches Tool und ist für Windows und macOS verfügbar.

Auch hier müssten Sie die Verbindungsauthentifizierungsdetails von Ihrem Hosting-Anbieter erhalten, aber auf diese Weise hätten Sie ein GUI, um sie einzugeben.

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

Wir haben die Grundlagen zur Nutzung davon im Artikel Veröffentlichen Ihrer Website aus unserem Einstieg ins Web Leitfaden behandelt, so dass wir es hier nicht noch einmal wiederholen werden.

Es ist jedoch wissenswert, dass Sie auch eine Website auf GitHub hosten können, aber eine benutzerdefinierte Domain damit verwenden können. Siehe Verwendung einer benutzerdefinierten Domain mit GitHub Pages für einen detaillierten Leitfaden.

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

• Web-Schnittstellen. Eine HTML-Schnittstelle, die als Front-End für einen entfernten Datei-Upload-Dienst fungiert. Bereitgestellt durch Ihren Hosting-Dienst.
• WebDAV. Eine Erweiterung des HTTP-Protokolls, um fortgeschrittenere Dateiverwaltung zu ermöglichen.