von ConstanzeStraub | Dez. 11, 2020 | Design, Empfohlenes, Startseite, Text, WordPress
Ob WordPress, Squarespace oder Wix: Jede Website lebt von ihren Texten. Die besten Inhalte nützen dir aber wenig, wenn das Lesen anstrengt. Auf vielen Websites sehe ich dieselben Fehler bei Lesbarkeit und Typografie, und fast immer behebst du sie mit wenigen Handgriffen. Viele dieser Fehler entstehen, weil vor der Gestaltung niemand ein > Website-Konzept entwickelt hat. Mit ein bisschen Einfühlungsvermögen und den richtigen Werten machst du es deinen Leserinnen und Lesern deutlich leichter.
Website-Texte lesbar gestalten: das Wichtigste in Kürze
Diese Werte sorgen dafür, dass deine Texte gern gelesen werden:
- Zeilenlänge: 50 bis 75 Zeichen inklusive Leerzeichen
- Schriftgröße im Fließtext: mindestens 16 Pixel, besser 18 Pixel
- Zeilenabstand: das 1,5- bis 1,7-Fache der Schriftgröße
- Absätze: höchstens drei bis fünf Zeilen
- Kontrast zwischen Schrift und Hintergrund: mindestens 4,5 : 1
- Fließtext linksbündig, nie im Blocksatz
Fehler 1
Die Zeilen sind zu breit
Viel zu breite Textblöcke sehe ich ständig. Breit laufende Zeilen lesen sich extrem anstrengend, ich bekomme davon Kopfschmerzen. Probier es selbst aus: Halte ein DIN-A4-Blatt quer vor deine Augen, etwa 50 Zentimeter entfernt, so wie vor deinem Monitor. Wandere mit den Augen die obere Kante des Blatts entlang, von Blattspitze zu Blattspitze, von links nach rechts und wieder zurück, ein paar Mal hintereinander.
Das ist Schwerstarbeit für die Augen. Und genau das verlangst du von deinen Leserinnen, wenn deine Zeilen über die ganze Bildschirmbreite laufen. Beim Tennis bewegst du den Kopf von links nach rechts. Vor dem Monitor macht das niemand.
Übrigens: Übliche Monitore sind weitaus breiter als ein Din-A4-Blatt. Leider machen viele den Fehler, ihre Website für ihr viel kleineres Notebook zu optimieren. Das Problem: Auf dem nächst größeren Display laufen die Textzeilen 40 cm breit…
Wie breit darf eine Zeile sein?
Früher lautete die Empfehlung: nicht breiter als 800 Pixel oder etwa 20 Zentimeter. Das Problem dabei: Pixel ist nicht gleich Pixel. Auf einem hochauflösenden Display sind 800 Pixel deutlich schmaler als auf einem älteren Monitor. Verlässlicher ist die Zahl der Zeichen pro Zeile.
Außerdem hängt die Lesbarkeit auch von der Größe und Art der Schrift ab. Eine breit laufende Montserrat in 28 Pixel Höhe liest sich angenehmer als eine schmal laufende Roboto Condensed in 17 Pixel Höhe, auch wenn die Zeile dieselbe Breite hat.
Gut lesbar sind 50 bis 75 Zeichen inklusive Leerzeichen. Dafür gibt es in CSS eine eigene Einheit: ch entspricht ungefähr der Breite eines Zeichens. Ungefähr, weil natürlich nicht alle Zeichen gleich breit sind (ein t ist schmaler als ein M). Mit max-width: 70ch; begrenzt du die Zeile auf rund 70 Zeichen, egal auf welchem Display. In Divi trägst du die Angabe im Textmodul unter Erweitert > Benutzerdefiniertes CSS > Hauptelement ein. Die Zeile passt sich der Schriftgröße automatisch an, du musst nichts nachrechnen.
Fehler 2
Textwüsten – zu wenig Absätze
Oft gesehen, besonders auf Magazinseiten: Die Textblöcke haben zu wenig Absätze. Texte nehmen auf den meisten Websites den größten Teil der Fläche ein. Umso erstaunlicher, wie wenig Aufmerksamkeit die Absätze bekommen. Riesige Textblöcke ohne Gliederung machen jede Seite unübersichtlich, die berüchtigten Textwüsten. Lesen am Bildschirm ist anstrengend, und auf Websites wird anders als in Büchern eher gescannt als gelesen.
Gliedere deine Texte deshalb in kurze, leicht verdauliche Happen: Absätze mit höchstens drei bis fünf Zeilen, alle drei bis vier Absätze eine Zwischenüberschrift. So erkennen deine Leserinnen auf einen Blick, wo sie einsteigen wollen. Auch Listen helfen:
- Listen bringen Abwechslung in den Text.
- Listen lockern lange Seiten auf.
- Listen bleiben gut im Gedächtnis.
- Google übernimmt gut strukturierte Listen gern in die Suchergebnisse.
Fehler 3
Schriften, die das Lesen erschweren
Vorbei die Zeiten, als Websites mit drei oder vier Schriften auskommen mussten. Mit Google Fonts steht dir heute eine riesige Auswahl zur Verfügung. Wer die Wahl hat, hat die Qual: Die meisten Websitebetreiberinnen sind keine Designerinnen und greifen zu Schriften, die im Fließtext schwer zu lesen sind.
Ein wichtiger Hinweis vorab: Binde Google Fonts lokal ein, sonst verstößt deine Website gegen die DSGVO. Wie du Google Fonts DSGVO-konform einsetzt, habe ich im Artikel > Google Fonts DSGVO-konform einbinden beschrieben.
Schmale und sehr feine Schriftschnitte
Manche Schriften sind sehr schlank geschnitten, etwa die Condensed-Schnitte vieler Schriftfamilien. Ich finde sie schick, sie wirken edel. Im Fließtext sind sie eine Katastrophe, besonders für Augen ab 50. Ebenso problematisch sind sehr feine Schnitte, oft als „Thin“ oder „Light“ bezeichnet. Auf Papier sehen sie elegant aus, auf dem Display verschwimmen die dünnen Linien. Für Überschriften und kurze Teaser können schmale Schnitte gut funktionieren, für längere Texte nimm einen normalen Schnitt.
Script-Schriften
Script-Schriften sehen aus wie von Hand geschrieben. Sie wirken nahbar und bringen eine persönliche Note in den Text. Zu vielen Branchen passen sie wunderbar. Ihr Haken: Sie sind oft miserabel lesbar. Neulich las ich auf einer Website eine wunderschön geschwungene Überschrift. Aber: Ich konnte auf den ersten Blick nicht erkennen, ob ein Buchstabe ein f oder ein s war. Ich kam ins Stocken und musste mehrmals lesen. Es war ein s.
Wer fünf Sekunden braucht, um eine Überschrift zu entziffern, verliert wertvolle Zeit, bevor er überhaupt erfährt, worum es geht. Setz Script-Schriften deshalb sparsam ein, für einzelne Akzente, nie im Fließtext.
Serifen-Schriften, besser als ihr Ruf
Lange galt die Regel: Serifenschriften gehören auf Papier, am Bildschirm sind sie schwer lesbar. Das stimmte zu Zeiten grob auflösender Monitore. Auf heutigen Displays funktionieren gut gemachte Serifenschriften auch im Fließtext, viele Zeitungen setzen sie online ein. Voraussetzung ist eine ausreichende Schriftgröße. Wichtiger als die Frage „Serife oder nicht“ ist eine andere Regel: Kombiniere höchstens zwei Schriften, eine für Überschriften und eine für den Fließtext. Und: Setze den Fließtext mit Serifenschriften nicht zu klein.
Fehler 4
Formatierungen, die das Lesen erschweren
Auf einer Website mit Rezepten musste ich vor einiger Zeit einen Text lesen, der in sechs längeren Absätzen kursiv gesetzt war. Ich habe drei Anläufe gebraucht, um ihn zu erfassen. Natürlich war das Rezept nicht schwer zu verstehen. Aber ich hatte Mühe, den Text lesen zu können. Denn: Im längeren Fließtext ist Kursivschrift das reinste Augenpulver.
Ähnlich anstrengend sind ganze Absätze in Fettschrift oder in Großbuchstaben. Hinzu kommt die Wirkung solcher Formatierungen: Hervorhebungen wirken nur, wenn sie selten sind: Ist alles fett, ist nichts mehr wichtig. Und unterstrichene Wörter halten Leserinnen auf Websites für Links. Hebe nur einzelne Begriffe fett hervor, sparsam und gezielt.
Fehler 5
Zu kleine Schrift und ungünstiger Zeilenabstand
Was nützt das schönste Layout, die besten Bilder und der hilfreichste Inhalt, wenn die Schrift kaum zu lesen ist? Auf vielen Websites ist die Schrift zu klein oder der Zeilenabstand zu eng. Junge Augen kommen damit zurecht, ältere nicht. Gib deine Texte deshalb auch Menschen über 50 zum Testen. Auch wenn du selbst in diesem Alter bist: Du kennst deine Inhalte und kannst deshalb alles lesen. Nicht aber deine Besucher: Sie sind neu auf deinen Texzen und bemerken Probleme, die dir selbst nicht auffallen.
Für den Fließtext gilt als Untergrenze 16 Pixel, angenehmer sind 18 Pixel. Auf dem Smartphone bleibt die Schrift gleich groß, denn du hältst das Handy näher vor die Augen. Beim Zeilenabstand liegt der gute Bereich beim 1,5- bis 1,7-Fachen der Schriftgröße. Ist er zu eng, kleben die Zeilen aneinander und das Auge rutscht in die falsche Zeile. Ist er zu weit, zerfällt der Text in einzelne Streifen, und deine Leserinnen müssen unnötig scrollen. Überschriften brauchen weniger Abstand, dort reicht das 1,1- bis 1,3-Fache.
Fehler 6
Komplizierte Sätze, die die Lesbarkeit vermindern
Zugegeben, dieser Punkt betrifft weniger die Gestaltung als den Inhalt. Trotzdem gehört er hierher: Mit deinen Formulierungen entscheidest du mit darüber, wie gern deine Besucherinnen lesen. Du wirkst nicht schlauer oder professioneller, wenn du Thomas-Mann-Schachtelsätze baust oder Fachbegriffe wie ein Wissenschaftler verwendest. Bei komplizierten Sätzen passiert nur eins: Du wirst nicht verstanden. Worauf es ankommt:
- Einfachheit: kurze Sätze, kurze Wörter, überflüssige Fachbegriffe vermeiden
- Satzbau: ein Gedanke pro Satz, das Wichtigste an den Anfang
- Prägnanz: viele Verben und anschauliche Bilder machen den Text lebendig und verständlich
Lesbarkeit messen: der Flesch Reading Ease
Für die Lesbarkeit von Texten gibt es sogar ein wissenschaftliches Maß, den Flesch Reading Ease. Er berechnet aus Satzlänge und Silbenzahl einen Wert, der zeigt, wie leicht ein Text zu lesen ist. Deinen eigenen Text prüfst du kostenlos auf fleschindex.de. Falls dich das Thema interessiert und du tiefer darin einsteigen möchtest, kann ich dir Bücher zu diesem Thema empfehlen: „Deutsch für junge Profis“ von Wolf Schneider und „Das Leben und das Schreiben“ von Stephen King. Ja, DER Stephen King, der von „Carrie“ und „Shining“. Horrorfilm-Fan bin ich nicht gerade, das Buch empfehle ich trotzdem gern.
Fehler 7
Zu wenig Kontrast
Hellgraue Schrift auf weißem Grund sieht modern aus und ist für viele Augen eine Zumutung. Genauso schwierig sind bestimmte Farbkombinationen, etwa gelbe Schrift auf rotem Grund oder Hellblau auf Dunkelblau. Du weißt nie, wie gut die Augen deiner Leserinnen sind, egal ob deine Zielgruppe junge Eltern sind oder Menschen im Ruhestand.
Als Maßstab gelten die internationalen Richtlinien für Barrierefreiheit (WCAG): Normaler Text braucht einen Kontrast von mindestens 4,5 : 1 zum Hintergrund, große Überschriften mindestens 3 : 1. Deine Farbkombination prüfst du kostenlos mit dem Contrast Checker von WebAIM. Du gibst Schrift- und Hintergrundfarbe ein und siehst sofort, ob der Kontrast reicht.
Barrierefreiheit ist seit Juni 2025 auch ein rechtliches Thema: Das Barrierefreiheitsstärkungsgesetz gilt vor allem für Onlineshops und digitale Dienstleistungen für Verbraucherinnen. Lesbare Kontraste gehören aber auf jede Website. Was du bei Bildern für die Barrierefreiheit tun kannst, liest du in meinem Artikel Website-Bilder optimieren.
Fehler 8
Zu viele unterschiedliche Farben
Wie oft habe ich Websites gesehen, die aussehen wie zugeklebte Litfaßsäulen: hier ein Bild, da eine Grafik, knallbunt und überladen. Die Elemente einer Website haben zwei Aufgaben:
- die Leserinnen informieren
- die Leserinnen beim Lesen führen
Und was haben nun Farben mit der Lesbarkeit zu tun? Form follows function: Die Inhalte sind der Maßstab für die Gestaltung, für Texte, Bilder, Farben, Schriften und Weißraum. Wenn deine Texte umgeben sind von zu vielen farbigen Elementen oder die Schriften selbst viele unterschiedliche Farben haben, werden die Lesenden maximal verwirrt. Die Einordnung der Inhalte fällt schwer, die Lesenden werden abgelenkt.
Zwei bis drei Farben reichen für eine stimmige Website, dazu eine Akzentfarbe für Buttons und Links. Sparsam eingesetzt, strukturieren Farben die Seite und führen das Auge. Zu viele Farben und Bilder ermüden. In Nullkommanix sind deine Leserinnen von der Reizflut übersättigt und verlieren das Wesentliche aus den Augen. Du möchtest, dass sie deine Texte lesen und dein Angebot verstehen. Manchmal ist weniger mehr.
Fehler 9
Blocksatz und zentrierter Fließtext
Blocksatz sieht ordentlich aus: Alle Zeilen enden bündig, links wie rechts. Im Buch funktioniert das, weil dort Silbentrennung und sorgfältiger Satz die Abstände ausgleichen. Eine intensive Arbeit, für die es nicht umsonst Profiprogramme gibt. Auf Websites fehlt das. Der Browser zieht die Wortabstände auseinander, bis die Zeile voll ist, und es entstehen Löcher im Text. Untereinander liegende Lücken bilden sogar senkrechte weiße Bahnen, im Druck heißen sie Gießbäche. Im Beispielbild siehst du einige der Gießbäche mit einem roten Punkt markiert.
Auf dem Smartphone wird es noch schlimmer: Bei schmalen Zeilen mit wenigen Wörtern reißen die Lücken besonders weit auf. Da kann es schon mal passieren, dass in einer Zeile zwei Wörter stehen, links und rechts, dazwischen eine riesige Lücke. Setz deinen Fließtext deshalb linksbündig. Der unregelmäßige rechte Rand stört nicht, er hilft dem Auge sogar, die nächste Zeile zu finden. Dasselbe gilt für zentrierten Fließtext. Für eine Überschrift oder ein kurzes Zitat ist er in Ordnung. Bei mehreren Zeilen muss das Auge an jedem Zeilenanfang neu suchen, wo es weitergeht.
Fazit: Lesbarkeit ist Gestaltung
Lesbare Website-Texte entstehen aus vielen kleinen Entscheidungen: Zeilenlänge, Schrift, Schriftgröße, Zeilenabstand, Kontrast und Satzbau. Jede einzelne wirkt unscheinbar. Zusammen entscheiden sie darüber, ob deine Besucherinnen bleiben und lesen oder nach wenigen Sekunden wieder gehen. Gute Gestaltung beginnt beim Konzept und endet nicht beim Design. Sie zeigt sich darin, wie mühelos deine Besucherinnen deine Texte lesen.
Du möchtest Website und Texte aus einer Hand, lesbar gestaltet und auf deine Zielgruppe abgestimmt? Buch dir ein kostenloses Erstgespräch.
Du willst deine Website selbst bauen und dabei begleitet werden? In meinem 1:1-Website-Mentoring „Website Gold“ zeige ich dir, wie.
FAQ zur Lesbarkeit von Website-Texten
von ConstanzeStraub | Dez. 1, 2020 | Allgemein, Anleitungen, WordPress
Eine Website bauen ist einfacher als du denkst.
Diese Tipps helfen dir, dein Business online zu stellen
Du möchtest deine Website selber machen.
Du weißt, dass du mit einer Website noch mehr Kunden gewinnt.
Noch mehr Reichweite aufbaust.
Super, eine gute Idee.
Wenn du noch grübelst: Das schaff ich nie, ich bin technisch unbegabt…
Vergiß deine Glaubenssätze.
Was ich vor 15 Jahren dachte:
Eine Website selber machen? Nie im Leben! Ist mir viel zu technisch…
In dieselbe Posaune pustete mein ehemaliger Chef aus der Werbeagentur. Er und sein Partner hatten die Agentur an den Nagel gehängt. Ich wurde arbeitslos und mein Chef hat in seiner Wohnung allein weitergemacht.
Tja, wohl eins der ersten Home-Offices.
Kurze Zeit später hab ich ihn nach seiner Website gefragt: „Ich brauch keine“, so seine Antwort.
Okay, dann brauch ich sowas auch nicht. Schließlich stand das Internet noch in den Kinderschuhen. So hab ich mich in meiner bequemen Verweigerungshaltung ausgeruht.
Aber irgendwie mussten Kunden her.
Also hab ich mich einige Zeit später bei einem VHS-Kurs angemeldet: HTML für Anfänger. Ich hab Sachen gelernt wie HTML und CSS und viele Buchstaben in spitzen Klammern. Alles böhmische Dörfer für mich, ich war genervt.
Wo ist das denn bitte schön kreativ?
Hartnäckig wie ich bin hab ich unzählige Fachbücher durchstöbert. Las auf schlauen Internetseiten (das Internet wurde mit mir nicht nur älter, sondern auch schlauer) und bald war sie online: meine 1. Website.
Grauenhaft. Aus heutiger Sicht.
Mach es einfacher als ich und bau spielerisch deine Website selber
Nie war es so einfach wie heute, eine eigene Website selber zu machen! Du brauchst keine HTML-Kenntnisse (wie ich damals), du musst nichts programmieren.
Heute gibt es solche Systeme wie WordPress.
Was ist WordPress?
Einfach gesagt ist WordPress ein Haufen von Dateien, in die nette Menschen Programmierzeilen geschrieben haben, damit andere nette Menschen ohne Programmierkenntnisse daraus eine eigene Website bauen können. Bei WordPress ist die Programmiersprache PHP.
PHP kann man lernen und es ist nicht soooo schwierig. Da das aber kaum jemand möchte, wurde das System so gebaut, dass du dich im System anmelden kannst, um dort deine Inhalte zu verbreiten (Texte, Bilder und Videos, deine Dateien eben).
Viel brauchst du nicht für deine eigene Website: Du brauchst vor allem ein PC (oder ein Notebook), ein Internetzugang und ein Provider bzw. Hoster. Ein Hoster ist die Firma, die die Dateien deiner Website auf einem Rechner (Server) speichert und veröffentlicht, also im Internet für alle erreichbar macht.
Dann brauchst du natürlich die Software WordPress, ein gutes Theme und ein Programm, mit dem du deine Dateien auf deinen Hoster hochladen kannst. Das ist alles.
Du bekommst jetzt Schweißperlen auf der Stirn? Immer mit der Ruhe – schließlich fährst du Auto, ohne zu wissen, wie du den Motor austauschen kannst… Lies weiter, ich erkläre alles Schritt für Schritt.
Die verdammte Angst vor der Technik – alles Mumpitz
Schritt 1
Hoster suchen
Am besten wählst du einen Hoster, der für WordPress geeignet ist. Denn nicht jeder bringt alle sinnvollen Voraussetzungen mit. Zu dem Thema gibt es reichlich Empfehlungen und unterschiedliche Meinungen, die ich in meinem Kurs und dem Workshop ausführlich erläutere. Ich mache es hier kurz:
Mein Hoster ist allinkl.
Viele Webautoren empfehlen allinkl wegen des super Preis-Leistung Verhältnis und dem kundenfreundlichen Support.
Schritt 2
Domain überlegen
Überlege dir eine sinnvolle Domain. Ob du deinen eigenen Namen nimmst oder einen Fantasienamen bleibt dir überlassen. Meine Grafikdesign-Seite heißt consenza-design. Manche Marketingexperten raten dazu, einen Kunstnamen zu wählen, andere wiederum dazu, den eigenen Namen zu nehmen.
Darauf kann ich an dieser Stelle nicht eingehen. Ist sicher Geschmacksache.
Update 2022: Heute würde ich auf jeden Fall den Eigennamen wählen.
Welche Domainendung?
Als Domainendung nehme ich grundsätzlich de. Natürlich ist auch com möglich, für de gibt es aber einige gute Gründe. Da ich in Deutschland lebe, werden wahrscheinlich die meisten davon ausgehen, dass ich eine de-Domain habe. Und eine Länderdomain ist vertrauenswürdiger als .net oder .info oder was auch immer.
Wenn du Müller oder Schröder heißt: Nimm auf keinen Fall eine Domain mit Umlauten. Also bitte mueller. Oder schroeder. Seit 2002 sind Umlaute zwar möglich – trotzdem sieht man sie selten. Nicht ohne Grund: Umlautdomains haben einige Nachteile – technische, psychologische und marketingstrategische Nachteile.
Okay, weiter:
Schritt 3
Datenbank, Subdomain und FTP-Zugang anlegen
Vorweg: allinkl bietet wie viele andere WordPress-Hoster die sogenannte 1-Klick-Installation von WordPress an. Das heißt: Die Installation funkioniert quasi automatisch. Meine Empfehlung: Mach die Installation manuell. Dann lernst du von Anfang an, wie alles läuft (später wirst du eh auf deine Dateien manuell zugreifen müssen). Du siehst, welche Dateien WordPress umfasst. Du weißt, was alles in deiner manuellen Installation enthalten ist. Es kann auch sein, dass du später mal die ein oder andere Datei öffnen musst. Dann hast du schon mal einen Blick dafür.
Weiter mit allinkl: einloggen. Leg dir hier eine Datenbank an, eine Subdomain und einen FTP-Zugang. Alle Daten (Benutzername, Passwörter, vom Provider vorgegebene Daten etc.) schön ordentlich aufschreiben. Und ich meine ORDENTLICH!
Wenn man beim Notieren der Daten schludert, verliert man schnell die Übersicht. Ergebnis: Frust.
Hab ich selbst erlebt. Aus meiner eigenen Erfahrung weiß ich: Wenn du hier nicht gewissenhaft bist, passieren schnell Fehler. Eher als dir lieb ist liest du deine schnellen Skizzen falsch ab und zack – eine Fehlermeldung. Dann kommt dieses doofe weiße Fenster von WordPress mit dem gefühlten Mittelfinger…
Oder alles war auf einem kleinen Zettel notiert. Der natürlich, kennt man ja, sich irgendwann selbständig macht.
Und unter das Sofa flattert… Das Geschrei ist groß…
Datenbank anlegen
Datenbank, uuuh, was ist das denn nun wieder…
Hier werden einfach gesagt alle Informationen gespeichert, also alles, was du in deiner WordPress-Website schreibst und tust. Ohne Datenbank kein WordPress.
Keine Sorge: Das Anlegen der Datenbank ist kinderleicht.
Die Datenbank befindet sich bei allinkl in der technischen Verwaltung. Im sogenannten KAS. Wie die Bezeichnungen bei anderen Hostern sind ist meist unterschiedlich. Manchmal muss man etwas suchen, dann könnte dieser Punkt im Bereich „Hosting“ oder „Webspace“ liegen. Einfach etwas schauen. Hast du den Link „Datenbank“ gefunden, gehst du einfach auf „Datenbank anlegen“ oder „neue Datenbank“ (je nach Hoster). Dort erhältst du meist vom Hoster den Datenbanknamen.
Das Passwort vergibst du selber. Speichern, fertig.
Datenbankname, Benutzername und Passwort gut notieren, das brauchst du nachher, wenn du Datenbank und WordPress verbindest (die eigentliche Installation von WordPress).
Und was ist nun eine Datenbank?
Stell dir eine Datenbank vor wie ein Regal voller Bücher. Und immer, wenn jemand eine deiner Seiten auf deiner Website besucht, greift er oder sie quasi ins Regal, holt sich ein Buch raus und liest darin…
Subdomain anlegen
Warum Subdomain?
Ich installiere mein WordPress immer auf eine Subdomain und leite dann später auf die richtige Domain weiter. Auf der Subdomain kann ich in Ruhe alles ausprobieren, ohne eine Baustellenseite vorzuschalten, was ich lästig finde.
Wie gesagt, das ist meine Vorgehensweise, du kannst es selbstverständlich auch mit einer Baustelle machen und direkt auf deiner richtigen Domain alles installieren. Besucher sehen dann nur eine Platzhalterseite. Was du an der Website machst, siehst hier nur du.
Was ist eine Subdomain?
Ein Subdomain ist ein zusätzliches Verzeichnis (Speicherplatz) auf deinem Webspace. Sie ist ein Teil der Domain, wird von Google aber als eigenständige URL betrachtet (darum sollte man bei einer Subdomain immer überlegen, ob sie aus SEO-Gründen sinnvoll ist). Eine eigenständige URL ist zum Beispiel sinnvoll, wenn ein Shop von der Website ausgegliedert werden soll.
Eine Subdomain erkennst du daran, dass vor der Domain (vor dem 1. Punkt von links gelesen) eine weitere Bezeichnung steht (die du frei wählen kannst).
Beispiele:
shop.meinedomain.de
angebot.meinedomain.de
kurs.meinedomain.de.
FTP-Zugang anlegen
Warum FTP-Zugang?
Einen FTP-Zugang brauchst du, um deine WordPress-Dateien auf deinen Webspace bei allinkl hochzuladen. Wie das Hochladen geht, erkläre ich in Schritt 4. Den FTP-Zugang richtest du ebenso wie Datenbank und Subdomain bei deinem Hoster ein. Das ist ebenso einfach wie das Anlegen einer Datenbank.
Diese Schritte sind deine Grundlagen für die WordPress-Installation. Sei hier bitte gewissenhaft und notiere alle Zugangsdaten, Benutzernamen, Passwörter usw. gut lesbar. Siehe oben.
Mein Tipp:
Leg dir ein Dokument an, meinetwegen Word oder Excel oder eine Google-Tabelle (kann ich sehr empfehlen). Und tipp hier all deine Daten rein. Dann hast du sie immer griffbereit und kannst per Copy & Paste deine Daten während des Installationsprozesses eingeben. So gibts kein Geschrei, wenn wegen eines blöden Tippfehlers irgendwas nicht klappt. Oder wenn sich der Notizzettel in Luft aufgelöst hat…
Schritt 4
FTP-Programm einrichten
Du brauchst ein Programm, mit dem du dich auf dein Webspace einloggst, damit du deine Daten hochladen kannst.
Es gibt verschiedene FTP-Programme. Gute sind FileZilla und Cyberduck. Ich nutze FileZilla. Den gibts kostenlos für Windows und Mac.
Wenn du das Programm auf deinem Rechner installiert hast, öffnest du das Programm. Unter >Datei >Servermanager öffnet sich ein Fenster – der Servermanager eben. Hier klickst du links auf >Neuer Server. Du legst also einen Server an. Im Feld rechts tippst du die Daten ein, die du von deinem Hoster erhalten hast bzw. dein Passwort, dass du wahrscheinlich selber erstellt hast.
Schritt 5
WordPress herunterladen und Dateien auf Webspace laden
Nun ist WordPress an der Reihe. Hol dir die aktuellste Version direkt von wordpress.org (hier die deutsche Seite). Bitte nicht WordPress.com, das ist eine andere Geschichte. Ist jetzt nicht wichtig, erwähn ich nur der Vollständigkeit halber.
Lad dir also dein WordPress runter.
Endpacke die gezippte Datei.
WordPress installieren ist wirklich einfach und auch für Einsteiger kein Problem. Ganz ehrlich: Das größte Problem ist immer die eigene Einstellung. Das häufigste Hindernis, etwas anzugehen, was wir nicht gewohnt sind, ist die eigene Angst vor etwas Neuem.
Kopfkino eben.
Ich weiß, wovon ich spreche: Jahrelang habe ich mich mit Blockaden herumgequält. Bis es eines Tages bei mir „Pling“ machte. Von einer Minute zu anderen wurde mir klar, dass ich die Blockade über Jahre selber aufgebaut hab. Aber das ist ein anderes Thema, wenn du Lust hast mehr zu lesen: Darüber schreibe ich bestimmt ein Artikel.
Nun öffnest du dein FTP-Programm und stellst die Verbindung zu deinem Hoster her (hier: allinkl). Oben links kannst du den Server auswählen, gehst auf „Verbinden“, nun siehst du im Fenster unten rechts das Ordnerverzeichnis von deinem Webspace. Nun machst du folgendes:
du wählst auf der rechten Seite des Fensters den Ordner aus, der den Namen deiner angelegten Subdomain hat
auf der linken Seite vom FileZilla-Fenster wählst du dein WordPress-Ordner aus, klickst ihn an, damit du die Dateien darin siehst, wählst alle Dateien darin aus und klickst „hochladen“ an (im Kontextmenü, das sich mit der rechten Maustaste öffnet). Achte darauf, dass du alle Dateien auswählst.
Die Dateien werden hochgeladen, das dauert jetzt ein paar Minuten, je nach Schnelligkeit deiner Internetverbindung.
Schritt 6
WordPress installieren
Die WordPress-Dateien sind hochgeladen. Damit ist WordPress aber noch nicht fertig installiert. Nun muss die Verbindung zur Datenbank hergestellt werden.
WordPress ist berühmt für seine einfache Installation. Denn du wirst Schritt für Schritt durch den Prozess geleitet. Alles, was du jetzt tun musst: stur deine Zugangsdaten eintragen, die du bei allinkl erhalten bzw. gewählt hast. Und wenn du keinen Tippfehler machst, sollte dies ganz einfach klappen.
gib den Namen deiner Subdomain im Browser ein (also z.B. test.majameier.de)
Hinter dem .de gib ein Schrägstrich ein (Slash: /), anschließend „admin“. Falls du den wordpress-Ordner direkt hochgeladen hast, ohne ihn zu öffnen, muss du noch „wordpress“ eintippen. Also „test.majameier.de/wordpress/admin.
es öffnet sich das selbsterklärende Fenster, in denen du deine Daten eingibst. Jetzt wird dir auch klar, warum ich dir empfohlen habe, alles fein säuberlich in einem Dokument zu notieren 😉
War alles erfolgreich, gratuliert dir WordPress und du kannst dich mit einem selbstgewählten Passwort einloggen.
Schritt 7
Theme installieren
Damit WordPress für dich anwendbar ist, brauchst du noch ein Theme. Ein Theme ist quasi Werkzeugkasten und schicke Vitrine in einem. Beides macht deine WordPressinstallation erst zu dem, was du später siehst: zu einer schicken und funktionsfähigen Website mit allem Zipp und Zapp.
Mein Tipp: Such dir ein Premium-Theme.
Der Nachteil: Es gibt tausende Themes. Wer die Wahl hat, hat die Qual. Die meisten gibt es kostenlos. Investiere ein paar Euro und nimm ein Premiumtheme. Diese kostenpflichtigen Themes werden regelmäßig gewartet und erhalten ständig Updates. Das ist wichtig, damit deine Website immer auf dem neuesten technischen Stand ist. Das betrifft vor allem die Sicherheit deiner Website.
Außerdem gibt es Themes mit einem sogenannten PageBuilder. Diese Builder erleichtern dir den Bau deiner Website erheblich, weil du auf der Oberfläche deiner Website arbeiten kannst. Du siehts also live während der Eingabe, was sich auf deiner Website ändert.
Klare Empfehlung: Das Thema Divi
Ich nutze das bekannte Theme Divi von Elegante Themes, ein bekannter US-amerikanischer Themehersteller. Das Theme ist technisch ausgereift und hervorragend, arbeitet mit allen wichtigen Plugins (Erweiterungen) zusammen und macht deine Website damit enorm leistungsfähig.
Aber das beste: Der Bau deiner Website wird damit zum Kinderspiel.
Fertige Layoutvorlagen bietet das Theme ausserdem, du kannst also sofort loslegen.
Ein Wort zum „sofort loslegen“: Der Aufbau einer Website erfordert schon einige Vorüberlegungen. Es ist sinnvoll, schon um sich nicht zu verzetteln, sich vor dem Bau einer Website ein Konzept zu machen. Das spart jede Menge Zeit und Nerven.
Ich spreche aus Erfahrung.
Schau hier. Lies meine Anleitung, wie du ganz unkompliziert ein Konzept für deine Website erstellst.
Wenn du bis hierhin gelesen hast, bist du schon ein ganzes Stück weiter. Hau rein und vergiss nicht:
Es gibt nix Gutes, ausser man tut es.
Falls du noch mehr Hilfe brauchst: Ich biete ein Workshop an, in dem ich mit dir zusammen WordPress und das Theme installiere. Außerdem bauen wir darin das Grundgerüst deiner Startseite. Schau hier:
