Welche Schritte gehören zur Erstellung einer Internetseite?
Das Design und die Umsetzung einer Website lässt sich grob in 6 Phasen unterteilen:
Bestandsaufnahme: Gibt es bereits eine Internetseite? Welchen Nutzen bringt sie? Was kann/muss übernommen werden; was muss anders werden?
Inhalt und Nutzen: Welche Inhalte sollen präsentiert werden? Welche Fragen sollen beantwortet werden? Wie gliedern sich die Inhalte?
Design: Wie soll die neue Seite aussehen und sich bedienen lassen? (Responsive Design, Mobile First, Dark Mode, etc.)
Technik: Soll ein Content-Management-System (CMS) genutzt werden? Wenn ja, welches? Gibt es Schnittstellen oder andere technische Besonderheiten?
Umsetzung: Programmierung und Konfiguration der Website
Inbetriebnahme: Konfiguration des Webhostings, Einrichtung von Sicherungen, Einrichtung von Weiterleitungen
Im Folgenden gehe ich auf einige Details zu jeder Phase ein und stelle einige Punkte vor, die es jeweils zu beachten gilt.
Erkenntnisse aus der Bestandsseite gewinnen und erste inhaltliche Recherche
In vielen Fällen gibt es bereits eine alte Website, die aus verschiedenen Gründen überarbeitet und neu erstellt werden soll (veraltetes Design, schlechte Performance, technische Probleme). So unzufrieden die Betreibenden der Seite auch damit sein mögen, oft lassen sich noch wertvolle Erkenntnisse aus der alten Website gewinnen, die unbedingt in die Erstellung einer Neuen einfließen müssen.
Hierzu gehört vor allem, sich das Nutzerverhalten und die gut funktionierenden Seiten anzuschauen, die schon heute die Fragen der Suchenden beantworten. Oft sind gerade lange bestehende Seiten für gewisse Fragen weit oben in den Suchergebnissen vertreten. Das muss bei der Neuerstellung und der Erarbeitung neuer Inhalte beachtet werden, sodass auch nach dem Start der neuen Internetseite derselbe oder ein besserer Erfolg erreicht wird.
Im Gegenteil zu den gut funktionierenden Seiten und Suchanfragen kann auch geprüft werden, für welche wichtigen Suchbegriffe die alte Seite noch nicht gefunden wird. In diesen Bereichen besteht dann auf jeden Fall Handlungsbedarf.
Um inhaltlich gut aufgestellt zu sein, empfiehlt es sich, bereits frühzeitig und langfristig eine SEO-Betreuung in Anspruch zu nehmen, wodurch qualifizierte Aussagen über die Performance der Website getätigt und datenbasierte Optimierungen durchgeführt werden können.
Neben dieser inhaltlichen Dimension der alten Website sind auch die Erfahrungen der Redakteurinnen und Redakteure aufschlussreich. Meiner Erfahrung nach sind sie oft unzufrieden mit der Bedienung des eingesetzten (oder fehlenden) Content-Management-Systems (CMS). Bei der Neuentwicklung einer Website können wir an dieser Stelle ansetzen und beispielsweise mit dem CMS Kirby eine wesentlich benutzerfreundliche Seite erstellen.

Welche Inhalte soll die Website haben und wie strukturieren wir sie?
Um eine neue Website zu erstellen, muss zunächst erarbeitet werden, welche Inhalte die neue Seite zeigen soll, welche Fragen sie beantworten soll und welchen Nutzen sie für Nutzerinnen und Nutzer bieten soll. Das kann einhergehen mit der Bestandsaufnahme der Alt-Seite oder erfolgt bei neuen Websites auf der grünen Wiese.
Wenn bekannt ist, welche alten Seiten gut funktionieren und wichtige Fragen der Suchenden bereits beantwortet werden, ist klar, dass diese Inhalte auch in der neuen Seite hochwertig präsentiert werden müssen.
Um inhaltliche Klarheit über die geplante Internetseite zu gewinnen, müssen Fragen geklärt werden wie:
Wonach sucht unsere Zielgruppe?
Für welche Fachbereiche/Themen/Nischen wollen wir gefunden werden?
In welchen Themen haben wir Experten-Status und können hochwertige, authentische und originelle Inhalte erstellen?
Wie sind unsere Inhalte organisiert? Zum Beispiel nach Produktgruppe, Zielgruppe oder Industriezweig
Welche Vorarbeit muss für die Bereitstellung der Inhalte geleistet werden (z.B. Bildmaterial beschaffen)
Daraus wird eine inhaltliche Struktur ausgearbeitet. Hier kristallisiert sich heraus, welche Seiten es geben soll/muss und auch, wie die Navigation auf der neuen Website aufgebaut sein soll. Diese inhaltliche Übersicht ist die Basis für die Ausarbeitung des visuellen Entwurfs durch den Webdesigner sowie für die Redaktion, um bereits entsprechende Inhalte auszuarbeiten.

Erstellung eines Webdesigns
Als nächstes folgt das tatsächliche Design der neuen Website, also wie sie optisch aussehen soll. Diese Arbeit findet bei mir in dem Design-Tool Figma statt, das die Erstellung anschaulicher und interaktiver Website-Prototypen erlaubt.
Bei der Erstellung des Designs arbeite ich auf Grundlage der vorangegangenen inhaltlichen Analyse und gestalte Komponenten und Seiten für die Darstellung aller benötigten Inhalte; also etwa einer Startseite, einer Leistungsseite oder einer Produktseite.
Natürlich kommen hier nun auch erstmalig die Markenbestandteile wie Farben, Logos und Schriften zum Einsatz. Diese werden so gewählt, dass sie zur Marke und Botschaft der Seite passen: Ein Onlineshop für Kinderspielzeug wird daher eine deutlich andere Designsprache haben als eine Website für eine Steuerberatung.
Selbstverständlich ist auch die Beachtung von Prinzipen wie Mobile-First und die Anpassung des Designs an mobile Geräte (Responsive Design), auf denen die Mehrzahl der Besuchenden (je nach Branche) die Seite anschauen wird. Darüberhinaus gestalte ich alle meine Seiten auch für den Dark-Mode, sodass die Seite auch zu später Stunde noch angenehm benutzt werden kann.
Bei der Erstellung des Designs stelle ich sicher, dass die verschiedenen Komponenten an mehreren Stellen der Website wiederverwendet werden können und das die Betreibenden der Seite später im Content-Management-System (CMS) einfach neue Seiten anlegen und frei zusammenstellen können.

Welches Content-Management-System kommt zum Einsatz?
Mit einem Content-Management-System (CMS) können die Inhalte einer Website in einer benutzerfreundlichen Bedienoberfläche bearbeitet werden, ohne dass Programmier- oder sonstige technische Kenntnisse notwendig sind. Das ist in jedem Projekt wichtig, denn in der Regel arbeiten Laien mit der Seite und schreiben die Inhalte.
Es gibt eine Vielzahl von Content-Management-Systemen auf dem Markt mit verschiedenen Leistungen, Konzepten, Möglichkeiten und Preisen. Es sollte einige Voraussetzungen erfüllen, um es als geeignetes System zu qualifizieren:
Einfache Bedienung & schnelles Zurechtfinden: Auch nach längerer Pause und für Laien
Übersichtliche Benutzeroberfläche: Nur das sehen, was gerade wichtig ist
Flexibilität in der inhaltlichen Struktur: Keine starren Vorgaben
Die Website lädt schnell und ist technisch auf dem neuesten Stand
Möglichst einfach zu betreiben, wartungsarm und mit Sicherungsmöglichkeiten
Möglichst kostengünstig
Meine klare CMS-Empfehlung ist Kirby. Ich setze es seit längerem für alle meine Projekt ein und bin davon überzeugt, dass es die aktuelle beste Lösung für mich als Programmierer und für die Inhaber einer Seite ist. Es bietet eine technisch hervorragende Basis für die Erstellung schneller und SEO-optimierter Websites und darüberhinaus eine aufgeräumte Benutzeroberfläche, die es einfach macht, neue Inhalte für den eigenen Webauftritt zu erstellen.
In diesen Artikeln erkläre ich im Detail, welche Vorteile des System bietet:
Wenn bereits eine alte Website existiert und dort ein bestimmtes CMS im Einsatz ist, können die Inhalte in der Regel auch gesichert und übertragen werden. Das lohnt sich vor allem bei großen Seiten, bei denen sonst der manuelle Übertragungsaufwand zu groß wäre.

Beim Login in dieser Wordpress-Seite findet sich niemand zurecht

Aufgeräumte Oberfläche einer Kirby-Website
(Link zum Projekt)
Technische Umsetzung und Programmierung der Website
Nach Abschluss des visuellen Webdesigns gehe ich als Programmierung in die technische Umsetzung der Seite. Dabei überführe ich das ausgearbeitete Design in hochwertigen und schnellen Code.
Wie genau diese Programmierung aussieht, hängt maßgeblich vom ausgewählten CMS und den sonstigen technischen Gegebenheiten der Website ab. Im Kern geht es aber immer darum, den entsprechenden HTML-, CSS- und Javascript-Code zu schreiben, der die im Design erarbeiteten Komponenten wirklich im Browser erscheinen und nutzbar werden lässt.
Im Falle des Kirby-CMS umfasst das insbesondere die Konfiguration der Benutzeroberfläche und inhaltlichen Strukturen des CMS mittels YML-Dateien sowie die Umsetzung der Komponenten in PHP und CSS.
Je nach Anforderung des Projektes kommen ggf. weitere Programmierarbeiten hinzu, wie etwas die Umsetzung von Formularen und Funnels sowie die Anbindung externer Tools (z.B. Zapier, Stripe, Paypal, E-Mail-Versand, ...).


Webhosting und Inbetriebnahme einer Website
Um eine Website im Internet zu veröffentlichen, werden eine Domain und ein Webhosting benötigt. Diese können bei diversen Anbietern günstig angemietet werden und sind bei vielen Unternehmen bereits vorhanden. Meiner Erfahrung nach haben viele Unternehmen seit Jahren alte Verträge mit Hosting-Anbietern und bezahlen oft deutlich zu viel. Es kann Sinn machen, die aktuelle Situation zu prüfen und ggf. einen Wechsel durchzuführen.
Die Domain ist der Name einer Website und die Adresse, unter der sie erreichbar ist, zum Beispiel volkmann-design-code.de für diese Website. Sie ist immer eindeutig und besteht aus dem Namensteil (volkmann-design-code) und der Domain-Endung, die in der Regel länderspezifisch ist (.de). Es gibt aber auch besondere Domain-Endungen für gewisse Städte, Branchen und ähnliches (z.B. .berlin, .agency, .cafe, ...).
Beim Webhosting handelt es sich um einen Service des Webhosting-Anbieters, über den die Daten der Website (HTML, CSS, ...) über einen Webserver beim Aufruf der verknüpften Domain bereitgestellt werden.
In diesen Themenbereich fallen oft auch verwandte Themen, die nicht direkt mit der Website zu tun haben, aber mit der Domain wie etwa E-Mail-Adressen (@domain-name.de) oder sogenannte DNS-Einträge (zum Beispiel benötigt für Office365, die Google Search Console und viele weitere Dienste).
Ich unterstütze dich gerne umfassend auch bei diesen technischen Themen der Website-Erstellung. Wenn du etwa den Eindruck hast, aktuell zu viel zu bezahlen, komm gerne für eine unverbindliche schnelle Prüfung auf mich zu.
