Websites
Ihr eigener Ort im Internet
Gestaltung der Erscheinung
Es ist wichtig, dass der erste Eindruck Ihrer Webseite bereits vermittelt, worum es geht. Eine Magazinseite sieht im Allgemeinen ganz anders aus als eine Künstlerseite oder die Präsenz eines Instituts.
Im Kommunikationsdesign steht immer der Mensch im Mittelpunkt. Und jemand, der Ihre Website besucht, will dort etwas finden, das ihn weiterbringt.
Ebenso wie bei gedruckten Publikationen spielen dafür neben dem Inhalt die »Aufmachung«, also Typografie, Bild-Text-Layout, visueller Rhythmus, Farben, Kontraste und solche Dinge eine wichtige Rolle. Bei Websites kommen noch die interaktiven Elemente hinzu wie Buttons, Menüs, Links, Kontaktformulare usw. Eingeführte Formen und Symbole, die ins Erscheinungsbild integriert werden, ermöglichen Orientierung und Navigation.
Wozu überhaupt eine Website?
Eine berechtigte Frage, da es viele Möglichkeiten gibt, online mitzumischen. Nicht zuletzt per Socialmedia.
Das Internet ist viel mehr als nur Webseiten. Es ist ein soziales Netzwerk – eben Kommunikation. Welchen Platz darin eine Unternehmenswebsite sinnvollerweise einnimmt, muss man sich strategisch überlegen.
Für die Unternehmer, Freiberufler, Künstler, die mein Klientel sind, ist die Website meistens der zentrale Knoten. Ein selbstbestimmtes Refugium*, das eine authentische Unternehmensdarstellung ermöglicht und in dem alle Aktivitäten zusammenlaufen können. Social Marketing, Corporate Publishing, Kundenkontakte uvm.
* Eine eigene Domain und Webspace bei einem Hosting-Anbieter
Welche Website-Typen gibt es?
Aus meiner Praxis heraus sehe ich folgende Arten von Unternehmens-Websites (und Mixturen daraus).
- Repräsentative Kontakt- und Buchungssites (z.B. Arzt-Praxen, Restaurants, Hotels oder auch Organisationen)
- Informative Websites (z.B. Wikipedia, Online-Lexika)
- One-Pager und Microsites (z.B. zu einzelnen Produkten, Aktionen, Events, Online-Kursen)
- Online-Shops (für alles Mögliche)
- Magazine und Zeitungen (Special Interest, Tageszeitungen etc.)
- Künstlersites (z.B. Einzelkünstler, Bands)
- und weitere wie Online-Tools (Whiteboards, Konferenzen, SaaS)
Theme »von der Stange«?
Themes sind ein aus verschiedenen Seitenvorlagen bestehendes Designsystem zur konsistenten Erstellung von Websites. Jede durchgestaltete Website ergibt letztlich ein Theme, das die Gestaltung bestimmt.
Es gibt sie zu Tausenden »von der Stange«. Mit so einem Theme lässt sich sehr schnell eine Website bauen, die attraktiv wirkt. Wenn Ihnen eins gefällt, kann man es »individualisieren«.
Aber Vorsicht! Es ist dabei mit Bedacht vorzugehen. Nur wirklich hochwertige, durchdachte und vom Hersteller gepflegte Themes sind empfehlenswert. Und was die Konzeption angeht, folgen solche Themes oft sehr gängigen Auffassungen. Dies ist nicht unbedingt im Sinne der Strategie und der Identity. Wenn doch, kann man es in Betracht ziehen, damit zu arbeiten.
Wenn man kein Theme »von der Stange« verwenden will, sind sie immerhin nützlich als Inspiration, um Gestaltungsfragen zu diskutieren.
Ich verwende selbst oft ein vielseitiges Theme mit einem flexiblen Schatzkasten voller nützlicher Webseiten-Elemente. Diese lassen sich jederzeit mit klassischem Code modifizieren.
Gestaltung der Benutzung: UX und UI
Eine zeitgemäße Website reagiert auf verschiedene Displaygrößen von Smartphone bis Desktop, berücksichtigt Datenschutz, ist benutzerfreundlich gestaltet, suchmaschinenfreundlich und datensicher programmiert.
Dazu kommen noch all die komfortablen Elemente und Details wie kleine Animationen, elegante Übergänge, Galerien, Videoplayer, Info-Cards, Kontaktformulare und vieles mehr.
All dies gehört in das Gestaltungsgebiet User Experience und User Interface. Das zugrundeliegende UI/UX-Konzept bestimmt dabei die interaktiven Zusammenhänge und deren Ausgestaltung.
UX | User Experience Design
Abläufe und Benutzerführung wollen so gestaltet sein, dass Website-Besucher ein möglichst positives, motivierendes Erlebnis damit haben. Dazu gehören auch speziellere Bereiche wie Accessibility (Zugänglichkeit/Barrierefreiheit).
Man kann die Benutzererfahrung mit Split-Tests optimieren, bei denen verschiedene Varianten einer Seite oder eines Elements an verschiedene Gruppen ausgeliefert und ausgewertet werden.
Oft hilft meine Gestaltungserfahrung, um ein gutes UX zu produzieren.
UI | User Interface Design
Dieser Bereich liegt nah am UX-Design, befasst sich aber eher mit der Wahrnehmung, Anordnung und Bezeichnung von interaktiven Elementen zur Navigation, öffnen von Reitern und Tabs u.ä. Allgemeiner gesagt geht es dabei um die Schnittstelle zwischen Mensch und Maschine.
Die Bedienung einer Website am Desktop-Computer ist anders als auf einem Tablet oder Smartphone. Das muss ebenso berücksichtigt werden wie die verschiedenen Größen der Displays.
Die fließende Eigenart einer Website erfordert oft viele kleine Anpassungen. Während derzeit meine meisten Arbeiten auf einem Spaltenraster basieren, entwickeln sich auch ständig neue Ansätze, um anders an dieses Gestaltungsthema heranzugehen. Ich verfolge dies mit Interesse.
Teamwork und Artdirection
Wenn es um komplexe Websites geht, übernehme ich in Teams die Rolle des Artdirectors oder Designers ohne technische Umsetzung.
Ebenso setze ich auf Coding-Experten, wenn es um spezielle Progammierungen geht wie beispielsweise eine spezielle Suchfunktion mit Datenbank-Anbindung.
Technisches – wen es interessiert
Es gibt viele technische Möglichkeiten, eine Website zu erstellen und zu veröffentlichen. Wichtig ist, dass die Seiten zuverlässig erreichbar, präsent, pflegeleicht und rechtssicher sind. Hier beschreibe ich kurz wie ich derzeit arbeite.
CMS und Pagebuilder
In Microsites integriere ich dafür ein kleines, schlankes Tool, mit dem sich einfache Aktualisierungen und Erweiterungen machen lassen.
Wenn es öfters Änderungen oder neue Artikel auf der Website geben soll, gestalte und entwickle ich Websites mit WordPress und Divi Theme Pagebuilder. Das ermöglicht die Bearbeitung und Erweiterung von Layouts durch akkreditierte Dritte.
Divi ist eine Kombination aus Theme und Pagebuilder. Ein Pagebuilder bietet viele individuell gestaltbare Module, die den Entwicklungsprozess einer Website beschleunigen und verschlanken.
Bootstrap
Spezielle Features wie interaktive Formulare, automatische Bildgrößen, Bildergalerien u.ä. müssen allerdings gesondert installiert werden oder mit externen Anbietern gelöst werden – eine Frage des Konzepts und der Zielsetzung.
SEO
Alle meine Websites sind suchmaschinen-freundlich angelegt. Die grundlegenden Meta-Informationen wie Seitenbeschreibungen, die semantische Hierarchie der Überschriften und die Berücksichtigung von Schlüsselbegriffen und einiges mehr gehören zum Standard.
Da SEO ein Prozess ist, an dem stetig gearbeitet werden kann, ist diese Arbeit ein eigenes Feld. In WordPress kann meine Kundschaft mit geeignetem PlugIn selbst Hand anlegen, Auswertungen begutachten und Optimierungen vornehmen.
DSGVO Datenschutz
Jede kommerzielle Website – und das sind alle, die in irgendeiner Weise verkaufsfördernd gedacht sind – braucht eine aktuelle Datenschutzerklärung und ein Impressum. Es gibt dafür Vorlagen und Generatoren, und man kann einen Anwalt damit beauftragen.
Die Projektphasen
Jedes Website-Projekt ist anders.
Die folgenden Projektphasen gibt es aber immer:
- Die Konzeptionsphase
- Die Entwurfsphase mit Revision(en)
- Die produktionsreife Ausführung
- Die Veröffentlichung
Der Zeitrahmen hängt von den Gegebenheiten, dem vorhandenen, zu beschaffenden und zu bearbeitenden Material (Texte und Medien [Bilder, Videos etc.]) und den Kapazitäten beider Seiten ab.
Remote arbeiten
Mit verschiedenen interaktiven Online-Tools lässt sich sehr gut auf Entfernung zusammenarbeiten. Gute Erfahrungen habe ich mit Zoom und Miro.
Inwischen sind diese auch für europäische Kunden datenschutzrechtlich unbedenklicher einsetzbar. Stichwort DSGVO bzw. GDPR.
Fragen zum Projektbeginn
Folgende und weitere Fragestellungen werden gemeinsam in Ruhe ausführlich geklärt, bevor der erste Entwurf folgt. Um hier nur einige zu nennen:
- Welche Ziele sollen mit der Website erreicht werden?
- Welches Klientel sprechen Sie an?
- Gibt es ein Corporate Design?
- Haben Sie Vorstellungen zur Konzeption und Struktur?
- Welche Funktionen soll die Website bieten?
- Gibt es bereits Inhalte wie Texte, Bilder, Grafiken?
- Wer schreibt die Texte?
- Wird die Website mehrsprachig?
- Wollen Sie Besuchern der Website einen Newsletter anbieten?
- Soll es Downloads geben? Welcher Art?
- Möchten Sie ein Analysetool einsetzen?
- Soll die Website einen Newsbereich (Blog) haben?
- Pflegen Sie die Website selbst (Updates, neue Artikel, neue Seiten)?
- Wird es Videos oder spezielle Einbindungen (z.B. 3D-Rundumblick u.ä.) auf der Website geben?
- uvm.
Konzeption, Entwürfe und Revisionen
In diesen Phasen wird oft am meisten diskutiert. In der Konzeption wird Grundsätzliches erörtert und besprochen. Schließlich wird auf dieser Basis dann weiter gegangen.
Die Entwürfe und Revisionen sind als nächstes Gegenstand von Betrachtungen und Diskussionen, Änderungen werden beschlossen und in jeder Revision optimiert.
Je nach Bedarf finden diese Kontakte folgendermaßen statt:
- Bei Ihnen
- Bei mir in Hamburg
- Per Videokonferenz
- Telefonisch
- Per Online-Board
- Per E‑Mail
Produktionsreife Ausführung
Finish der Gestaltung und Einrichtung des technischen Rückgrats stehen vor der Veröffentlichung an. Dies ist meist ein eher interner Vorgang, bei dem die technischen Details und Funktionalitäten wichtig sind.
In dieser Phase werden Module für Performance, Sicherheit und Rechtliches sowie weitere Dinge wie Newsletter, Seiten-Templates u.ä. integriert und eingerichtet.
Diese Phase wird abgeschlossen mit:
- Schlusskorrektur und
- Freigabe/Abnahme
Veröffentlichung und dann …
Jetzt geht’s online. Die Entwicklungsversion wird in die Produktionsumgebung migriert. Dort stehen noch diverse Tests und Konfigurationen an, die auch den Hostingserver betreffen wie z.B. die Aktivierung des SSL-Zertifikats oder Anlegen von E‑Mail-Adressen.
Nach der Freischaltung erhalten meine Auftraggeberinnen und Auftraggeber wichtige Informationen, z.B.:
- Einwahl- und Zugangsdaten
- wichtige Links
- telefonischen oder E‑Mail-Support
Gebucht werden kann auch weitere Unterstützung, z.B.:
- Einweisungen/Tutorials
- Schulungen (WordPress/Divi/Backend)
- Administration und Websitepflege