Was muss eine Website leisten? Ein kleiner Projektleitfaden | Konzeption

Geschätzte Lesezeit: 4 Minuten

Eine Website ist nie fertig. Die Website ist kein fertiges Konstrukt, sondern ein dynamisches, lebendes Gebilde. Websites benötigen regelmäßige Aktualisierungen und Ergänzungen. Bereits bei der Konzeption einer neuen Website sollten Sie sich einen Fahrplan für die nähere Zukunft erarbeiten. Vieles gilt es zu beachten. Lesen Sie hier eine Reihe von Anforderungen an Webseiten in Punkto Inhalt, Struktur und SEO.

Inhaltliche Anforderungen an eine Website

  • Responsive Webseiten erstellen (Geräteübergreifende Nutzbarkeit)
  • Intuitive und konsistente Navigation
  • Relevante und einzigartige Informationen | Mehrwert für den User
  • Keywords zum User Intent finden und nutzen
  • Genügend Text (für die Suchmaschine) | „Content is king“
  • Aktualität der Informationen | Pflegen Sie Ihre Inhalte!
  • Hochwertiges Bildmaterial (Rechte beachten)
  • Produktseiten | Kategorieseiten | Inhaltsseiten / Artikel
  • Nutzung von strukturierten Daten (schema.org)
  • Informationsmaterial in Form von PDF-Dateien
  • Übersicht | Sitemap für den Besucher
  • Aktuelles | News
  • Pressematerial | gekürzte Pressemeldungen (Mit Link auf die Original-URL)
  • Kontaktformular | Support
  • Downloads z. B. Wallpaper oder ScreenSaver | Musik etc
  • Spiele | Gewinnspiele | Aktionen
  • Lageplan | Anfahrt (zum Beispiel Google Maps)
  • Impressum | Anbieterkennzeichnung
  • Hinweise zum Thema Datenschutz
  • Allgemeine Geschäftsbedingungen | AGB (z. B. bei Shops)
  • Hilfeseiten | Anleitungen
  • Zertifikate | Siegel | Preise (z. B. trustedShops und Co)
  • Favoriten | Ausgewählte Quellen im Netz
  • Buchempfehlungen
  • Bewertungen | Kundenmeinungen
  • Referenzen | Projekte
  • Videos | YouTube Video

Unser Weiterbildungs-Tipp | Gefördert mit Bildungsgutschein

Professionelles Webdesign


Dinge, die Sie nicht vergessen sollten…

Struktur einer Webseite

  • Arbeiten Sie unbedingt mit Überschriften
  • Verwenden Sie die Überschrift 1. Ordnung in der Regel nur 1 Mal
  • Gehen Sie in der Hierarchie mindestens bis zur Überschrift 3. Ordnung
  • Gliedern Sie Ihre Inhalte mittels Absätzen und Listen
  • Erstellen Sie einen Textumfang von mindestens 200 Wörtern pro Seite
  • Achten Sie aber immer auch auch die Content Qualität!
  • Arbeiten Sie mit Hervorhebungen
  • Achten Sie auf sinnvolle Dateinamen der HTML-Seiten
  • Vergeben Sie auch Keyword-basierte Dateinamen für Ihre Bilder
  • Belegen Sie alle Bilder mit sinnvollen Alternativtexten bzw. Titel
  • Optimieren Sie Ihre Bilder auf gute Ladezeiten
  • Erstellen Sie keine HTML-Seite über 150KB (reines HTML)
  • Produzieren Sie möglichst gültiges HTML
  • Die Navigation sollte in Form einer Liste vorliegen
  • Arbeiten Sie überwiegend mit div-Containern anstatt Tabellen
  • Mit HTML5 können Sie bereits viele semantische Elemente nutzen!
  • Für jede Seite einen aussagekräftigen und einzigartigen Seitentitel erstellen
  • Für jede HTML-Seite eine aussagekräftige, einzigartige Meta-Description erstellen
  • Für alle Seiten die Sprache festlegen (Meta-Language)
  • Für Startseite und/oder Lageplan die GEO-Metadaten erstellen
  • CSS für die Druckdarstellung
  • Stellen Sie eine robots.txt bereit
  • Erstellen Sie eine xml-Sitemap
  • Nutzen Sie die .htaccess Datei für die Zusammenführung mit und ohne www.
  • Legen Sie ein Google-Konto an
  • Nutzen Sie insbesondere die Google Search Console
  • Klären Sie mit dem Inhaber die Verwendung von Google Analytics
    oder anderer Tracking-Software (zum Beispiel Matomo)
  • Favicon für die Domain (ico-Datei)
  • Erstellen Sie eine eigene Fehlerseite (ErrorDocument 404)
  • Stellen Sie eine Sitemap für den Besucher bereit
    (HTML-Seite, Übersicht über alle Webseiten des Angebots)

CSS-Taktiken | Vorgaben

  • Wenn möglich, nur ausgelagertes CSS
  • Versuchen Sie, soweit möglich, eine Schriftvergrößerung zuzulassen
    (Arbeiten Sie bei Texten vorzugsweise mit der CSS-Einheit em)
  • Eine CSS-Datei für die alle Darstellungen (Media Query im Einsatz)
  • Organisieren Sie Ihr CSS in der Reihenfolge der verwendeten Elemente
  • Starten Sie vorneweg immer mit body (ggf. sogar mit html)
  • Legen Sie die Schriftart an oberster Hierarchie fest
  • Nutzen Sie die CSS-Vererbung
  • Legen Sie eine eigene Zeilenhöhe fest (Erhöht die Lesbarkeit).
  • Es muss nicht immer Verdana sein…
  • HTML und CSS arbeiten Hand in Hand
  • Stellen Sie die Weichen mit eindeutigen IDs
    (Darin können Sie dann wieder HTML-tags ansprechen)
  • Heben Sie CSS float-Befehle immer mit clear auf
  • Nutzen Sie eher relative Positionierungen anstatt absolute

Gestaltung | Design

  • User Centered Design
  • Beachten Sie die Grundregeln der Usability
  • Überzeugen Sie in erster Linie Ihre Besucher
  • Was erwartet Ihr Besucher?
  • Klären Sie frühzeitig das Design mehrerer Seiten
    (Nicht nur eine Seite betrachten!)
  • Was macht der direkte Wettbewerb?
  • Nutzen Sie Vorlagen bzw. freie Templates als Inspiration oder Basis
  • Nutzen Sie z. B. Adobe Kuler für die Farbwelt
  • Orientieren Sie an aktuellen Seiten
  • Weniger ist mehr (less is more)
  • Form follows function
  • Heller Hintergrund | Dunkler Text | Kontraste beachten
  • Darkmode Darstellung überprüfen
  • Lernen von Anderen – nicht kopieren !
  • Verwendung der gängigen Strukturen
    (Überschriften, Absätze, Listen, Divs)

Webdesign Gestaltungsgrundlagen

Klicken Sie auf den unteren Button, um den Inhalt von www.slideshare.net zu laden.

Inhalt laden

Bücher zum Thema bei Amazon.de