Webentwicklung- und Websitemanagement - Eine komplette Übersicht

16.12.2021
von Meike Müller
Webentwicklung
Banner

Du fragst dich, wie eine Website aufgebaut werden muss, damit deine Besucher bleiben und zu Käufern konvertieren? Dann bist du hier genau richtig. Wir haben dir eine Übersicht aller Components erstellt, die dir im Websitemanagement dabei helfen, deine Website richtig aufzubauen und zu analysieren. Wenn du darüber hinaus Hilfe bei der Web-Entwicklung benötigst - kontaktiere uns gerne!

Lesezeit 9 min

 

Nachfolgend steht dir auch unser Poster zum Download bereit:

Icon Downloadbutton

Poster Website-Übersicht

Die verschiedenen Website-Elemente in der Übersicht

Eine Webseite besteht aus vielen verschiedenen Disziplinen, die alle zusammen dafür sorgen, dass die Besucher auf der Seite bleiben und mit der Seite interagieren. Beim Erstellen, Pflegen und Analysieren einer Website sind daher die folgenden Themengebiete zu beachten:

  1. Struktur und Aufbau
    1. Wie baut man eine Website auf?
    2. Was ist UX Design?
    3. Was ist UI Design?
  2. Search Engine Optimization
    1. Was brauche ich für SEO?
    2. Faktoren für die OnPage Optimierung
    3. Faktoren für die OffPage Optimierung
    4. SEO-Tools
  3. Content
    1. Zielgruppenspezifischen Content erstellen
    2. Content Management Systeme (CMS)
      1. Hosting
      2. Arten
      3. Modelle
      4. Tools
  4. Rechtliche Anforderungen und IT-Sicherheit
  5. Geschwindigkeit
    1. So optimierst du deine Performance
    2. Performance-Tools
  6. Tracking
    1. Deine Performance messen
    2. Tracking-Tools

Struktur und Aufbau einer Website

Als erstes Element unserer Übersicht, geben wir dir Tipps, wie du deiner Website Struktur geben kannst. Dies ist sehr wichtig, um deinen Usern ein optimales Erlebnis zu bieten.

Wie baut man eine Website auf?

Der grundlegende Aufbau besteht aus einem Header, einem Body und einem Footer. Außerdem sind Elemente wie Informationen zum Unternehmen, den Produktkategorien und Kontaktmöglichkeiten Pflichtbestandteile einer jeden Webseite.

Um den User auf der Seite zu halten, muss unbedingt ein roter Faden verfolgt werden. Dies kannst du gewährleisten, indem das Wording und der Aufbau jeder Unterseite konsistent ist. Damit der User sich gut orientieren kann, ist es wichtig, eine klare Navigation bereitzustellen, durch die der User wichtige Inhalte mit maximal zwei Klicks und weitere Inhalte mit maximal vier Klicks erreicht.

Die Intention jeder Website ist es, den User zu einer Handlung, also einer Conversion zu animieren. Eine Conversion kann zum Beispiel ein Kaufabschluss sein, eine Subscription für einen Newsletter oder das Absenden einer Bewerbung. Um für den User besser auffindbar zu sein, sollte die Struktur den gängigen SEO-Anforderungen entsprechen. Hierzu aber mehr im Bereich SEO.

Was ist UX-Design?

Das UX (User Experience) Design sorgt für eine ideale Customer Journey auf deiner Seite. Hierfür werden Zielgruppen analysiert und Nutzer Probleme herausgearbeitet, die es zu verstehen und zu lösen gilt.

Generell ist es wichtig, dem Ansatz “Mobile First” zu folgen, da die mobile Nutzung im Zuge der Digitalisierung stetig zunimmt. Ein weiteres Element, welches zu einer positiven Customer Journey beiträgt sind Breadcrumbs. Diese Navigationsleiste zeigt dem User an, welchem Pfad er auf der Webseite gefolgt ist und bietet daher Orientierung. Generell ist darauf zu achten, den User mit so wenig Ablenkung wie möglich (unnötige Links und Texte), durch den Funnel zu begleiten.

Wichtige Elemente um Leads (also relevante User, die eine Aktion vornehmen) und Conversions zu generieren sind Formulare, Newsletter-Anmeldungen, Chat(bots) und Download-Links. Bei Online-Shops sollte auch der Warenkorb optimiert werden, indem man zum Beispiel verschiedene Zahlungsmethoden anbietet.

Wir empfehlen dir, die geplanten Optimierungen im ersten Schritt als Screendesign auszuarbeiten und mit Hilfe von Tiefeninterviews, Eye-Tracking und Breitenbefragungen zu verfeinern. Im zweiten Schritt können die Optimierungen dann in Form von z.B. A/B Tests auf der Website getestet werden, um so die optimale User Experience zu garantieren.

 
Vorschau YouTube Video von UX Design

Was ist UI Design?

Das UI (User Interaction) Design knüpft an das UX Design an und konzentriert sich auf die visuelle Umsetzung der User Experience. In diesem Fachgebiet werden alle Elemente analysiert und optimiert, mit denen der User in der Applikation oder Webseite interagiert. Beispiele hierfür sind Icons, Buttons, Abstände, Bilde, Texte oder auch das Boxed Design.

Auch beim UI Design solltest du in den verschiedenen Phasen der Ausarbeitung Testings durchführen, um so nah wie möglich an den Bedürfnissen des Users zu bleiben.

Search Engine Optimization (SEO)

Um die Sichtbarkeit bei Suchanfragen über zum Beispiel Google zu erhöhen, empfehlen wir, die eigene Seite dahingehend zu optimieren. Dieses Fachgebiet nennt sich SEO (Search Engine Optimization) und verfolgt die langfristige Steigerung des Suchmaschinen-Rankings.
SEO kann in drei Teilgebiete gegliedert werden:  Interne Vorbereitungen, OnPage Optimierungen und Offpage Optimierungen.

Was brauche ich für SEO?

Im ersten Schritt solltest du festlegen, welche Themen deine Webseite abdeckt oder abdecken soll. Danach kann die Keyword Recherche mittels Tools wie z.B. Sistrix, Google Ads oder Xovi beginnen. Achte auf die Differenzierung zwischen informellen, transaktionellen und navigatorischen Keywords bei der Recherche. Zudem solltest du dir Gedanken über die Seitenstruktur deiner Webseite machen und festlegen, welche Themen auf welcher Seite behandelt werden sollten. Nachdem die Keyword Recherche erledigt ist, geht es nun darum den passenden Content zu kreieren.

Faktoren für die OnPage Optimierung

Alle SEO-Optimierungen die man auf der Webseite direkt vornehmen kann, nennen sich OnPage Faktoren. Diese Faktoren tragen dazu bei, dass der Google Crawler versteht, um was es inhaltlich geht und um einschätzen zu können, ob es für den Suchenden relevant ist.

Um dies zu gewährleisten, muss der Content dahingehend markiert werden. So sollten Überschriften nach H1 bis H6 strukturiert sein, Bildbeschreibungen mit Keywords bestückt-  und in der passenden Bildgröße hochgeladen werden. Auch die URLs sollten optimiert werden. Hier ist es wichtig, diese so kurz und aussagekräftig wie möglich zu halten. Zudem gibt es die Möglichkeit, die Title- Meta-, und Header Tags mit relevanten Keywords zu bestücken. Dies sind Informationen über deine Webseite, die in der Suchmaschinen Auflistung angezeigt werden.

 

Grafik Suchmaschine OnPage Optimierung

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Suchmaschinen wie Google bewerten die Relevanz für den User auch nach der Usability der Webseite. Damit der User dazu animiert wird, sich weiter durch die Seite zu klicken, sollte diese intern gut verlinkt sein. Auch externe Links zu Partnern, Kunden oder auch zu Youtube-Content sollten integriert werden.

 

EXWE Webseite Ansicht Blog

 

 

Generell sollte die Website viele Interaktions-Elemente beinhalten, denn diese indizieren einen interessierten User. Neben diesen Elementen wird auch die Ladezeit von z.B. Google bewertet. 

Stelle sicher, dass du relevante Keywords in deinen Content integrierst und ihn regelmäßig updatest. Nichtsdestotrotz solltest du darauf achten, nicht zu viele Keywords zu verwenden, da Google dies als Keyword-Stuffing kategorisiert und daher negativ bewertet.

 

EXWE Webseite Ansicht Keywords

 

 

 

 

 

 

 

 

 

 

 

 

Faktoren für die Offpage Optimierung

Neben den Optimierungen auf der Website selbst, gibt es auch externe Faktoren, die zu einem guten Ranking beitragen. Hierzu zählen zum einen sogenannte Backlinks. Dies sind Links von relevanten externen Seiten (wie z.B. Blogs oder Newsseiten), die auf die eigene Webseite verlinken. Der Suchmaschinen Algorithmus bewertet eine hohe Anzahl an Backlinks positiv, da dies bedeutet, dass die Seite relevant für User ist. Nichtsdestotrotz müssen Backlinks regelmäßig auf ihre Funktionalität mit Tools wie Searchmetrics geprüft werden, da kaputte Links wiederum negativ bewertet werden.

Um Backlinks zu generieren können auch Gastbeiträge auf themenrelevanten Blogs- oder Postings in Diskussionsforen publiziert werden. Auch Eintragungen von Business-Informationen in lokale Listings wie Google my Business, Bingplaces oder Go Yellow helfen dabei, Autorität zu erlangen und damit im Suchmaschinen-Ranking aufzusteigen.

SEO-Tools

Im folgenden haben wir dir die gängigsten SEO-Tools aufgelistet:

 

Website Content

Ein weiterer, wichtiger Faktor für eine ideale Website ist die Erstellung von relevantem Content.

Zielgruppenspezifischen Content erstellen

Neben relevanten Keywords für SEO empfehlen wir dir, den Content auf deine verschiedenen Zielgruppen anzupassen. Hierfür können Customer Personas und die jeweiligen Customer Journeys durch Research ausgearbeitet werden, die als Grundlage für die Content Kreation dienen. Generell ist es wichtig, einen guten Mix aus Fotos,Texten, Grafiken und Videos zu verwenden. Welcher Content und welche Content Formate in welcher Phase des Sales-Funnels verwendet werden sollten, hängt von der jeweiligen Customer Persona ab. Denke auch daran, die Tonalität des Contents durchweg konsistent zu halten. Darüber hinaus kannst du deine Authentizität bei den Usern steigern, indem du  Foto- und Video-Content personalisierst und weitestgehend auf Stockfotos verzichtest. Zuletzt solltest du dir überlegen, deine Inhalte in verschiedenen Sprachen anzubieten, um auch internationale Zielgruppen anzusprechen.

 
Vorschau YouTube Video von einer Customer Journey Map

Content Management Systeme (CMS)

Um die kreierten Inhalte ohne großes Zutun von Agenturen oder IT-Dienstleistern updaten zu können, empfehlen wir dir ein Content Management System (CMS) an das Frontend anzubinden. Anwendung finden Content Management Systeme im Web-Content-Management, beim Blogging oder Newsportalen sowie Social Publishing und Community Management. Je nach Bedarf deines Unternehmens, hast du die Wahl zwischen verschiedenen Hostings, CMS Arten und Modellen und dementsprechend auch verschiedene Tools.

CMS Hosting

CMS Arten

CMS Modelle

 

  • Hier haben wir dir die gängigsten CMS Systeme aufgelistet:

    Rechtliche Anforderungen und IT-Sicherheit

    Seit 2018 gilt die aktualisierte Datenschutzverordnung DSGVO, die auch Auswirkungen auf deine Website hat. So schreibt es der Gesetzgeber vor, eine Datenschutzerklärung sowie ein Impressum zu integrieren. Darüber hinaus ist jeder Webseitenbetreiber dazu verpflichtet, Cookie-Banner zu integrieren. Diese müssen zu Beginn des Aufenthalts aufpoppen und dem User die Möglichkeit bieten, über die Verwendung der eigenen Daten zu bestimmen.

    Neben den rechtlichen Aspekten auf der Webseite, gibt es ebenfalls Bestimmungen, die im Background beachtet werden sollten. So müssen Datenlöschungs-Prozesse entwickelt- und implementiert werden. Außerdem ist es wichtig, die Speicherung und Verarbeitung von persönlichen Daten zu dokumentieren, da jeder User ein Recht auf Einsicht hat.

    Auch IT-Sicherheit spielt eine wichtige Rolle, um deine Website und Daten vor möglichen Hacker-Angriffen zu schützen. Hinterlege also ein SSL Zertifikat, um eine HTTPS-Verbindung zu ermöglichen. Neben den Verschlüsselungen empfehlen wir dir ebenfalls, aktuelle Soft- und Hardware einzusetzen, da diese die aktuellen Sicherheitsstandards erfüllen.

     
    Vorschau YouTube Video über Datenschutz auf der Webseite

    Website Geschwindigkeit

    Um zu gewährleisten, dass die User auf der Website bleiben, ist eine schnelle Ladezeit von großer Bedeutung. Hier empfehlen wir dir die folgenden Punkte um die Geschwindigkeit zu steigern.

    So optimierst du deine Performance

    Um zu gewährleisten, dass die User auf der Website bleiben, ist eine schnelle Ladezeit von großer Bedeutung. Hier empfehlen wir dir die folgenden Punkte zu beachten:

    Als erstes empfehlen wir dir deinen Webserver auf das HTTP/2-Protokoll umzustellen. Dies ist eine einfach und sehr effektive Methode um die Ladezeit deiner Website zu optimieren. Genauso wie beim UX-Design, gilt es auch im Performance Bereich den “Mobile-First”- Gedanken zu beachten. Hintergrund ist die starke Zunahme des Website Zugriffs über mobile Endgeräte.

    Es ist ebenfalls wichtig, die einzelnen Elemente in der richtigen Reihenfolge laden zu lassen. So sollten alle Elemente im “Above the Fold” (auf den ersten Blick ersichtliche Inhalte, ohne scrollen zu müssen) zuerst geladen werden. Skripte hingegen sollten zusammengefügt und am Schluss geladen werden.

    EXWE Webseite Above the Fold

     

    Doch nicht allein die “Above the Fold” Elemente selbst sind von Bedeutung, sondern auch die Optimierung des FCP (First Contentful Paint). Dieser wird definiert als der Zeitraum zwischen dem die URLs das erste mal geladen werden und der Zeit, bis die “Above the Fold” Elemente gerendert sind. 

    Generell empfehlen wir dir auch auf die Größe von z.B. Bildern, Texten und Skripten zu achten, um eine schnelle Ladezeit zu garantieren. Auch ist es möglich, Website Daten auf ein CDN (Content Delivery Network) auszulagern. Hierbei werden Inhalte auf externen Servern gespeichert und somit die eigene Ladezeit verkürzt. Videoinhalte können aber auch zum Beispiel auf Social Media Plattformen wie Youtube oder Vimeo integriert und auf der eigenen Website integriert werden.

    Damit wiederkehrende Elemente nicht nochmals geladen werden müssen, empfehlen wir dir als letzten Punkt auch das Caching optimal einzustellen.

    Performance-Tools

    Im folgenden findest du die gängigen Website-Performance Tools.

     

    Website-Tracking

    Um herauszufinden, wie gut eine Seite für die User funktioniert, ist es wichtig, diese regelmäßig zu messen (Tracking), zu analysieren, Schlüsse zu ziehen und daraufhin zu optimieren.

    Deine Website-Performance messen

    Um dir das Tracking zu erleichtern, empfehlen wir dir ein Dashboard anzulegen, über welches du in regelmäßigen Abständen auf einen Blick analysieren kannst, wie deine Webseite performt. 


    Wir haben dir im folgenden, die wichtigsten Metriken aufgelistet:

    Geschwindigkeit

    Die Ladezeit der Website sollte regelmäßig getrackt werden und wenn nötig Maßnahmen ergriffen werden, um diese zu optimieren.

    User

    Um den Traffic deiner Seite im Blick zu haben, solltest regelmäßig den Besucherfluss deiner Website tracken. Im Idealfall sollte diese Zahl durch relevante Promotionmaßnahmen stetig steigen, denn mehr Traffic bedeutet bestenfalls auch mehr Leads und Conversions.

    Verweildauer

    Eine weitere Kennzahl, die getrackt werden sollte ist die durchschnittliche Zeit (Time Spent on Website), die ein User auf der kompletten Seite oder auf den jeweiligen Unterseiten verweilt. Diese Metrik kann ein Indiz dafür sein, wie interessant die Seite für den User ist. Eine sehr kurze Verweildauer deutet darauf hin, dass der Inhalt entweder nicht relevant oder unattraktiv ist. Eine überdurchschnittliche Verweildauer wiederum kann darauf hindeuten, dass der User sich nicht zurecht findet.

    Pageviews und Single Pageviews

    Die totale Anzahl der betrachteten Seiten wird auch als Pageviews betitelt. Hier werden auch mehrfache Seitenaufrufe mit aufgezählt. Bei Single Pageviews hingegen wird jede betrachtete Seite lediglich einmal gezählt. 

    Conversion und Conversionrate

    Als Conversion werden erwünschte Handlungen bezeichnet, die ein User auf der Website ausführt. Micro Conversions sind kleine Aktionen, die eine Conversion die der User ausführt und auf eine Conversion hindeuten. Ein Beispiel hierfür wäre ein User, der sich von einer Kategorieseite zu einer Produktseite bewegt. Die Conversion würde dann stattfinden, wenn dieser User im Anschluss das entsprechende Produkt kaufen würde.

    Die Conversion Rate berechnet die Anzahl der User im Verhältnis zu den durchgeführten Conversions (z.B. Käufen). Wir empfehlen dir, die verschiedenen (Micro) Conversions entlang deines Website-Funnels abzubilden um festzustellen, an welcher Stelle die meisten User abspringen.

    Dies könnte wie folgt aussehen:

    Grafik Die Conversion Rate

     

     

     

     

     

     

     

     

     

     

     

     

     

     

     

  • In unserem Beispiel siehst du, wie sich die Conversionrate in den jeweiligen Sales-Funnel Phasen verhält. Für die Berechnung wurden die Pageviews der unteren Funnel-Phase durch die Pageviews der oberen Funnel-Phase geteilt und mit 100 multipliziert. Hierdurch siehst du, wie viel % der User jeweils von der einen in die nächste Funnel-Phase konvertiert sind.

    Auf diese Weise ist es möglich, verschiedene Produktkategorien miteinander zu vergleichen und dementsprechend spezifische Optimierungen vorgenommen werden.

    Bounce Rate

    Um herauszufinden, wie qualitativ wertvoll eine Website für den User ist, wird die Bounce Rate oder auch Absprungrate betrachtet. Genau genommen geht es um die User die eine Einstiegsseite betreten und sie dann nach wenigen Sekunden wieder verlassen. Ein niedriger Wert spricht daher für eine qualitativ hochwertige Website.

    Filter

    Wenn du eine Filterfunktion auf deiner Website integriert hast, hilft es auch, die Nutzung der Filter regelmäßig zu monitoren. Hierdurch erhält man einen Überblick darüber, welche Kategorien / Bereiche großes Interesse aufweisen oder ob die Filter überhaupt verwendet werden.

    Device Usage

    Um herauszufinden, über welche Endgeräte (Mobil, Tablet, Desktop) der User auf deine Website zugreift, kannst du die Device Usage analysieren. Dies hilft dir dabei Prioritäten im Webdesign zu setzen. Generell ist zu beobachten, dass der Gebrauch von mobilen Endgeräten stetig wächst. Allerdings ist es interessant zu analysieren, mit welchem Endgerät tatsächlich konvertiert wird. Oftmals beobachten wir als IT-Agentur einen Bruch, bei dem sich die User zwar über ein mobiles Endgerät informieren, den Kauf / die Conversion dann aber am Desktop tätigen.

    Sources

    Um herauszufinden, welche Promotion Maßnahmen zu Micro Conversions und finalen Conversions (Sales, Downloads) geführt haben, können die sogenannten Sources analysiert werden. Diese Informationen können dann verwendet werden, um Promotionmaßnahmen anzupassen. Wir empfehlen allerdings, den Einfluss von Kampagnen auf Plattformen, die nicht zu direkten Conversions führen, nicht zu unterschätzen. Gerade Awarnesskampagnen auf Social Media helfen den allgemeinen Traffic zu erhöhen. Die Zielgruppe kann zum Beispiel zu einem späteren Zeitpunkt direkt auf die Website gelangen. Diese Einflüsse können generell nicht zu 100% getrackt werden.

    Error Rate

    Die Error Rate ist die durchschnittliche Anzahl an Problemen, die auf deiner Website aufgezeichnet werden im Vergleich zur totalen Anzahl an Problemmeldungen. Diese Rate sollte regelmäßig beobachtet werden, um Probleme frühzeitig festzustellen und beheben zu können.

    Tracking-Tools

    Im folgenden findest du die meistverwendeten Tracking-Tools:

     

    Lade dir jetzt das gratis Poster zum Thema Website-Übersicht herunter!

     

    Hast du noch weitere Fragen zum Thema Website und Web-Entwicklung oder benötigst du Hilfe mit deinem Onlineshop? Dann kontaktiere uns gerne! Als Software-Agentur können wir auf jahrelange Erfahrung im Bereich Webentwicklung, Softwareentwicklung und E-Commerce zurückgreifen. Wir unterstützen dich und dein Unternehmen gerne - Wir freuen uns auf dich!

Was ist dein Projekt? Wenn du uns darüber erzählen möchtest, rufen wir dich zurück!

 
Meike
Meike
vom 16.12.2021

Hallo, mein Name ist Meike. Ich betreue das EXWE Backoffice und bin für unsere Social-Media Kanäle zuständig. All unsere Artikel sollen dir das Leben erleichtern und eine Entscheidungshilfe sein. Trotzdem kann es mal vorkommen, dass etwas unklar bleibt, daher: Wenn du Fragen zu diesem Artikel hast erreichst du mich ganz einfach unter +49 231 93149827

Du möchtest immer am Zenit der Technik bleiben? Keine News und Blogbeiträge mehr verpassen.
Zu diesem Thema haben wir außerdem noch folgende interessante Beiträge aus unserem Tech-Blog für dich
Die besten Programmiersprachen für die Webentwicklung

Die besten Programmiersprachen für die Webentwicklung? Wir stellen dir PHP, Ruby und weitere vor und zeigen dir, für welche Anwendungen sie am besten geeignet sind.

Was ist Frontend- & Backend-Programmierung?

Programmierung und Webentwicklung besteht aus Frontend, Middleware und Backend Entwicklung. Im unserem Blogartikel findest du einen Überblick.

Webentwicklung: Muss es immer Scrum sein?

Projektplanung in der agilen Softwareentwicklung - Muss bei der Web-Entwicklung immer Scrum verwendet werden? Wir machen den Vergleich und zeigen alternative Modelle auf.