Allgemeines,  Internet

In 5 Schritten zur eigenen Webseite

Schritte

Bildquelle: Pexels

Liebes Tagebuch,

ich zweifelte nicht nur einmal an meinem Intelligenzquotienten, als ich diesen Blog gegründet habe. Es kam mir oft so vor, dass ich mir zu viel vorgenommen hatte. Ich habe dann zumindest halbherzig versucht, an eines meiner Lieblingszitate zu denken:

Wer immer tut, was er schon kann, bleibt immer das, was er schon ist.

Henry Ford

In meinem Fall war das, was ich schon kann, ein Word Dokument. Darin habe ich mir IT-Kram für die Arbeit notiert. Nicht weil es nicht genug Unterlagen von der Firma gab, sondern weil ich Dinge erst dann kapiere, wenn ich sie mit meinen eigenen Worten beschreiben kann.

Irgendwann hat mich die Idee gepackt, meine Einträge mit anderen zu teilen. Mit jemandem, der vielleicht in den gleichen Schuhen steckt wie ich, oder der womöglich nicht ahnt, wie die IT-Welt aus den Augen eines Quereinsteigers aussieht. Dazu wollte ich die Inhalte in Form eines Blogs veröffentlichen. Ich hatte also eine Idee, ein Konzept und unglaublich viel Lust darauf! Und ich hatte ganz nebenbei eine Frage:
Wie um alles in der Welt macht man eine Webseite???

In 5 Schritten erkläre ich dir, wie das bei mir gelaufen ist. Und ich finde, das Ergebnis kann sich sehen lassen: Ich wurde sogar mehrmals gefragt, wer die Seite für mich gemacht hat. Sie ist also immerhin so gut, dass man sie mir nicht zugetraut hätte.
Kurzum: Wenn ich es kann, kannst du es auch. Legen wir los!

Als erstes hilft natürlich eine Zutatenliste, für alles, das ins Website-Rezept gehört:

Übersicht

Eins nach dem anderen, also legen wir doch gleich mit dem ersten Schritt los.

Schritt 1: Wunsch-Domain auf Verfügbarkeit prüfen

Der Weg zur eigenen Webseite beginnt mit einer Domain. Das ist der Name des Links, mit dem man sie aufrufen wird.

Dieser Name muss bei einem Domainregister angemeldet werden. Dort wird dafür gesorgt, dass jede Domain nur einmal vergeben wird.1. Über das Domainregister erhält die Webseite auch ihre IP-Adresse, anhand derer sie sich im Internet identifizieren lässt.2.
Die Verwaltung der Domain ist zwar nicht kostenlos, aber ab ca. 10 Euro im Jahr zu verschmerzen. Meine Domain ist bei denic registriert – so wie alle Webseiten, die auf „.de“ enden.3.

Ich hatte Glück und meine Wunschdomain itgirlsjournal.de war noch frei! Registriert habe ich sie allerdings nicht direkt bei denic. Der Empfehlung folgend habe ich das über einen Webhosting-Anbieter gemacht, der mit denic zusammenarbeitet.4. Bevor uns das zu Schritt 2 bringt, lohnt es sich zu wissen, welche Bestandteile eine Domain hat. Ruft man meine Seite auf, steht oben im Webbrowser der folgende Link: https://itgirlsjournal.de/
Genau genommen lässt sich diese Domain in mehrere Einzelteile zerlegen:

Dieser Teil gehört nicht zur Domain, sondern ist eine Protokoll-Angabe. Es regelt die Kommunikation zwischen Besucher (Client) und Webseite (Server). Mehr dazu lernen wir bei Schritt 5.5.

Wo ist bei meiner Seite das www geblieben? Dieser Teil im Link steht für die Third-Level-Domain oder auch Subdomain.6. Die Subdomain „www.“ hilft um hervorzuheben, dass es sich um eine Webseite handelt. Technisch gesehen macht es keinen Unterschied, ob eine Seite damit beginnt oder nicht. Subdomains sind dafür gedacht, eine Seite in verschiedene Bereiche zu unterteilen. Da meine Seite keine Unterteilungen hat, wie bspw. in verschiedene Sprachen oder Shops, ist bei mir keine Subdomain erforderlich. Allerdings habe ich eine Weiterleitung, die auch Aufrufe mit www.itgirlsjournal.de auf meine Seite führt.7.

Dieser Teil wird als Second-Level-Domain bezeichnet, bei deren Wahl der Fantasie kaum Grenzen gesetzt sind. Ein paar Regelungen gibt es aber doch, beispielweise können keine Umlaute verwendet werden.8.

Das „.de“ beschreibt die Top-Level-Domain (TLD), die in meinem Fall einen länderspezifischen Bezug hat. Es gibt auch themenspezifische Endungen wie „.com“ oder „.org“.9. Je nach Wahl variiert auch das Preissegment der Domain.

>>Übersicht

Schritt 2: Website-Anbieter wählen und Domain registrieren

Wie ich gelernt habe, ist alles, was im Internet verfügbar ist, über Server gespeichert (mehr dazu im Eintrag „Kann das Internet fliegen?“). Während sich Firmen die Hardware teils in die eigenen vier Wände stellen, hatte ich keine Lust, meinen wertvollen Wohnraum mit einem Webserver zu teilen. Also stellt sich als nächstes die Frage, wer den Server für mich bereitstellen soll – im Fachjargon spricht man da vom Webhosting-Anbieter.10.

Zunächst landete ich bei WordPress. Eigentlich kenne ich diesen Namen nicht als Hoster, sondern als das Programm, mit dem ich meine Webseite später aufbauen, gestalten und verwalten wollte.
Ich fand heraus, dass es zwei Varianten von WordPress gibt:

Mit WordPress.com ist das Programm inklusive Hosting seitens WordPress gemeint.
Bei WordPress.org handelt es sich rein um die Software, während das Webhosting separat über einen anderen Anbieter läuft.11.
Zunächst entschied ich mich für WordPress.com. Einerseits, weil ich dann alles aus einer Hand hatte und andererseits, weil es sogar einen kostenlosen Tarif gibt! Das fand ich natürlich sehr cool für meine ersten Schritte. Allerdings beschränkt WordPress.com den Leistungsumfang in der kostenfreien Variante. So bekommt man eine Subdomain zur Verfügung gestellt, die allerdings unweigerlich mit .wordpress.com endet. Dagegen hatte ich fürs Erste nichts einzuwenden. Doch möchte man das Programm vollumfänglich nutzen und die Werbeanzeigen auf seiner Seite loswerden, muss man auf diesem Weg doch recht schnell ins Portemonnaie greifen.12.

Ich beschloss also, doch den Hosting-Anbieter zu wechseln und entschied mich für WordPress-Hosting von IONOS. Somit stand mir das ganze Spektrum von WordPress.org zur Verfügung – und zwar gleich vorinstalliert auf meinem Webserver.
Einen kostenlosen Tarif gibt es bei IONOS zwar nicht, aber dafür ist die Domain im Paket inbegriffen. Somit konnte ich in einem Aufwasch mein Kundenkonto anlegen und auch gleich über IONOS meine Domain bei denic registrieren lassen.

Der Registrierungsprozess ging dann ziemlich schnell. Nur etwa 30 Minuten – und ich war vom Normalo zum Inhaber einer Webseite geworden! Mit Sicherheit geht das sogar noch schneller, wenn man nicht jeden Schritt fürsorglich dokumentiert, um später einen Blogbeitrag darüber zu schreiben. 😉

Im Genauen durchlief ich die folgenden Aktionen:

  • Tarif wählen
  • Wunschdomain auf Verfügbarkeit prüfen und auswählen
  • Neues Kundenkonto erstellen
  • Website-Titel vergeben
  • Zugangsdaten für WordPress anlegen
  • Installationsart wählen
    Ich entschied mich für Managed Services. Bei dieser Installationsart übernimmt IONOS die Website-Updates. Die Alternative ist, die Aktualisierung der Seite selbst zu verantworten.

Tada, schon war die Webseite erstellt! Ich loggte mich erstmals in meinen WordPress Account ein und legte mit dem nächsten Schritt los.
>>Übersicht

Schritt 3: Webseite bearbeiten

Nun kommen wir zum Teil, der mir am meisten Spaß gemacht hat: Man verpasst der Webseite seine eigene Handschrift!

Nach dem Login findet man zunächst eine vorgefertigte Seite, die als Platzhalter dient. Ich begann als erstes damit, mir ein passendes Theme auszusuchen. Das ist das Layout, also der Look der Seite. WordPress liefert da zahlreiche Vorlagen zur Auswahl. Mir war es wichtig, dass die Seite viele Menü-Optionen hat, damit ich viele Möglichkeiten zum Kategorisieren habe. Auch sollten Bilder bei mir nicht so eine große Rolle spielen – der Fokus liegt ja auf meinen Texten.

Als nächstes erstellte ich erste Seiten, Beiträge und Menüs. All das spielt sich nicht auf der Ebene ab, die Seitenbesucher vorfinden. Die Verwaltung läuft hinter der Bühne, im sogenannten Backend (wörtlich übersetzt wohl „das hintere Ende“). WordPress unterteilt sein Backend in verschiedene Bereiche – zum Beispiel hat man dort auch seine Mediathek für die Bilder, verwaltet die Kommentare der Besucher, legt Sicherheitseinstellungen fest und vieles mehr. Durch diesen Aufbau ist es auch recht leicht, sein Theme umzustellen. Man ändert zwar die Optik des Webauftritts, nicht aber die Struktur der Seiten, Beiträge, etc. Insofern kann man seine Webseite mit nur wenigen Klicks in einem völlig neuen Licht erstrahlen lassen. Das ist wirklich eine coole Sache!

Ein wichtiger Teil im Backend sind auch die Plugins (übersetzt geht das wohl in die Richtung „zum einstecken“ bzw. „dranstecken“). Das bezeichnet Erweiterungen, die über die Standard-Struktur von WordPress hinausgehen. Ich habe beispielsweise ein Plugin installiert, das meine Seite regelmäßig sichert. Sollte sie einmal einen Schaden nehmen, kann ich auf das letzte Backup zurückgreifen, das dieses Plugin erstellt hat.
>>Übersicht

Schritt 4: Rechtlichen Rahmen schaffen

Für jede Person, die eine Webseite betreibt, ist Datenschutz ein notwendiges Übel – aber Spaß sieht anders aus. Ich fasse mich so kurz wie möglich:
Den rechtlichen Rahmen meiner Webseite bilden die folgenden drei Bestandteile:

  • Datenschutzerklärung
  • Impressum
  • Cookie Banner

Die Datenschutzerklärung gibt den Seitenbesuchern Einblicke, welche Daten wie lange über sie erhoben werden und wohin sie ggf. noch weitergeleitet werden.
Glücklicherweise gibt es kostenlose Konfiguratoren wie bei eRecht24, mit denen man die Datenschutzerklärung erstellen kann.13. Sie gehen bereits beim Erstellen individuell auf die Seite ein, daher waren bei mir im Nachgang nur wenige Anpassungen nötig.

Das Impressum zeigt den Seitenbesuchern, mit wem sie es zu tun haben. Hierzu muss der Name des Seiteninhabers genannt werden und eine ladungsfähige Adresse angegeben werden. Auch hierzu gibt es unterstützende Konfiguratoren für die Erstellung.14.

Gut beschäftigt war ich auch mit dem Cookie Banner. Cookies sind Textdateien, die auf den Geräten der Seitenbesucher gespeichert werden. Benötigt werden sie für verschiedene Einsatzzwecke – beispielsweise um die Webseite korrekt darzustellen oder um die Besuche auszuwerten.15.
Es war zwar meine eigene Seite, aber welche Cookies zum Einsatz kamen, musste ich selbst erst einmal herausfinden! Ein hilfreicher Anhaltspunkt war die Anzeige der Seitenquellen. Dazu macht man einen Rechtsklick auf die Seite, geht auf „Untersuchen“ und navigiert zum Bereich „Quellen“.

Um Zustimmungen zu Cookies auf meiner Seite zu verwalten, nutze ich das Plugin Real Cookie Banner. Sollte eine solche Zustimmung fehlen, bietet das Tool auch einen sogenannten Content Blocker als Funktion. Über diesen lassen sich gewisse Dienste im Interesse der Besucher blockieren.

Mein Herzenstipp (Nachtrag Stand Dezember 2022): Um die Rechtssicherheit meiner Seite abzuprüfen, nutze ich den Website-Scanner von eRecht24.
Das Thema Datenschutzkonformität führte mich zudem zum WordPress Plugin „Local Google Fonts“. Es sorgt dafür, dass die Schriftarten von Google lokal auf dem Webserver gehostet werden. Achtung: Seitenbetreiber, die ihre Schriftarten remote über Google Server hosten, könnten eine Abmahnung erhalten. Der Google-Fonts Scanner von eRecht24 verschafft hierüber Klarheit. Infos zum Plugin sowie zur Installation gibt es hier.

Wichtige Anmerkung:

Ich bin kein Jurist und kann nicht garantieren, dass meine Ausführungen zum rechtlichen Rahmen korrekt und vollständig sind. Für Expertentipps rate ich, andere Seiten zu besuchen, die sich mit einem rechtssicheren Internetauftritt beschäftigen.
>>Übersicht

Schritt 5: Domain verknüpfen und SSL Zertifikat installieren

Bis ich die Webseite in einen passablen Zustand versetzt hatte, lief sie unter einer System-Domain. Sie war somit zwar schon online, stand aber noch nicht in Verbindung mit meiner Domain itgirlsjournal.de.
Es kostete allerdings nur einen Klick – und schwupps, war die Verbindung hergestellt.

Im nächsten Schritt wurde ich darüber in Kenntnis gesetzt, dass noch kein SSL-Zertifikat zugewiesen ist. Was war das nun wieder?
SSL steht für Secure Sockets Layer und bezeichnet eine Technologie, die eine sichere Verbindung zwischen Besucher und Webseite herstellt. Durch Verschlüsselung wird sichergestellt, dass Daten wirklich nur zwischen ihnen beiden ausgetauscht werden und niemand anders Informationen abfangen kann. Zum Schutz der Seitenbesucher ist ein gültiges SSL-Zertifikat sogar gesetzlich vorgeschrieben, sobald es um die Übertragung personenbezogener Daten wie beispielsweise der E-Mail Adresse geht.
Solltest du einmal von TLS (Transport Layer Security) hören, so ist damit die neueste Version der SSL-Technologie gemeint.16.

Ob man es mit einer sicheren Seite zu tun hat, lässt sich oben in der Browserzeile erkennen. SSL-verschlüsselte Seiten werden mit https:// angezeigt. Zudem erscheint ein kleines Schloss als Symbol. Klickt man darauf, erfährt man Näheres zum Zertifikat – mitunter, ob es noch gültig ist.
Steht in der Browserzeile ein http:// (also ohne das „s“ am Schluss) oder ein durchgestrichenes Schloss, ist der Austausch zwischen Besucher und Seite ein leichtes Angriffsziel für Dritte, die den Informationsfluss anzapfen wollen. Auf so einer Seite ist Vorsicht geboten – besonders wenn sie Angaben zur Person abfragt.16.

Mit diesem Wissen fand ein SSL-Zertifikat selbst für meine Seite unabdingbar. In meinem Fall war es bereits im Paket beim Hosting-Anbieter inbegriffen. Daher musste ich nur einen Klick auf „SSL-Zertifikat einrichten“ tätigen, um es zu installieren.

GESCHAFFT!

Dann hielt ich kurz inne. Ich hatte es geschafft. Ich hatte eine eigene Webseite! Es war ein ziemlich kribbeliges Hochgefühl, nun wirklich online zu sein. Und dazu gibt es viele Gründe! Eine Webseite gibt dir nicht nur einen Kanal, dich mitzuteilen, sondern schafft unglaublich viele Möglichkeiten.
Networkchuck beschreibt auf YouTube sehr treffend, warum man eine Webseite haben sollte. Insbesondere nimmt er die Furcht davor, dass sie floppen könnte. Denn Fun Fact: Keine Besucher hat man bereits ohne Webseite. Also was verliert man? Nichts!17.
Wenn du also noch keine Webseite hast, wird es jetzt Zeit loszulegen.
>>Übersicht



Quellen:

  1. https://kinsta.com/de/blog/beste-domainregister/
  2. https://www.denic.de/ueber-denic/
  3. https://www.ionos.de/digitalguide/domains/domaintipps/was-kostet-eine-domain/
  4. https://www.denic.de/domains/de-domains/registrierung/
  5. https://www.ionos.de/digitalguide/domains/domaintipps/was-kostet-eine-domain/
  6. https://www.ionos.de/digitalguide/domains/domainverwaltung/was-ist-eine-subdomain/
  7. https://www.internetwerk.de/blog/domains/2017/06/15/domain-mit-www-oder-besser-ohne/
  8. https://www.denic.de/domains/de-domains/registrierung/
  9. https://www.denic.de/wissen/top-level-domains/
  10. https://www.one.com/de/hosting/was-ist-hosting
  11. https://www.elmastudio.de/wordpress-org-vs-wordpress-com-was-ist-der-unterschied/
  12. https://wordpress.com/de/pricing/
  13. https://www.e-recht24.de/muster-datenschutzerklaerung.html
  14. https://www.e-recht24.de/impressum-generator.html
  15. https://devowl.io/de/wordpress-real-cookie-banner/
  16. https://blog.hubspot.de/marketing/was-ist-ssl
  17. https://www.youtube.com/watch?v=gwUz3E9AW0w – NetworkChuck – „you need a website RIGHT NOW!! (create a website for FREE)“

Eine Antwort schreiben

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Cookie Consent mit Real Cookie Banner