Web­sites

Ihr eige­ner Ort im Internet

Gestal­tung der Erscheinung

Es ist wich­tig, dass der erste Ein­druck Ihrer Web­seite bereits ver­mit­telt, worum es geht. Eine Maga­zin­seite sieht im All­ge­mei­nen ganz anders aus als eine Künst­ler­seite oder die Prä­senz eines Instituts.

Im Kom­mu­ni­ka­ti­ons­de­sign steht immer der Mensch im Mit­tel­punkt. Und jemand, der Ihre Web­site besucht, will dort etwas fin­den, das ihn weiterbringt.

Ebenso wie bei gedruck­ten Publi­ka­tio­nen spie­len dafür neben dem Inhalt die »Auf­ma­chung«, also Typo­gra­fie, Bild-​Text-​Layout, visu­el­ler Rhyth­mus, Far­ben, Kon­traste und sol­che Dinge eine wich­tige Rolle. Bei Web­sites kom­men noch die inter­ak­ti­ven Ele­mente hinzu wie But­tons, Menüs, Links, Kon­takt­for­mu­lare usw. Ein­ge­führte For­men und Sym­bole, die ins Erschei­nungs­bild inte­griert wer­den, ermög­li­chen Ori­en­tie­rung und Navigation.

Wozu über­haupt eine Website?

Eine berech­tigte Frage, da es viele Mög­lich­kei­ten gibt, online mit­zu­mi­schen. Nicht zuletzt per Socialmedia.

Das Inter­net ist viel mehr als nur Web­sei­ten. Es ist ein sozia­les Netz­werk – eben Kom­mu­ni­kat­ion. Wel­chen Platz darin eine Unter­neh­mens­web­site sinn­vol­ler­weise ein­nimmt, muss man sich stra­te­gisch überlegen.

Für die Unter­neh­mer, Frei­be­ruf­ler, Künst­ler, die mein Kli­en­tel sind, ist die Web­site meis­tens der zen­trale Kno­ten. Ein selbst­be­stimm­tes Refu­gium*, das eine authen­ti­sche Unter­neh­mens­dar­stel­lung ermög­licht und in dem alle Akti­vi­tä­ten zusam­men­lau­fen kön­nen. Social Mar­ke­ting, Cor­po­rate Publi­shing, Kun­den­kon­takte uvm.

* Eine eigene Domain und Web­space bei einem Hosting-Anbieter

Wel­che Website-​Typen gibt es?

Aus mei­ner Pra­xis her­aus sehe ich fol­gende Arten von Unternehmens-​Websites (und Mix­tu­ren daraus).

  • Reprä­sen­ta­tive Kontakt- und Buchungs­si­tes (z.B. Arzt-​Praxen, Restau­rants, Hotels oder auch Organisationen)
  • Infor­ma­tive Web­sites (z.B. Wiki­pe­dia, Online-Lexika)
  • One-​Pager und Micro­si­tes (z.B. zu ein­zel­nen Pro­duk­ten, Aktio­nen, Events, Online-Kursen)
  • Online-​Shops (für alles Mögliche)
  • Maga­zine und Zei­tun­gen (Spe­cial Inte­rest, Tages­zei­tun­gen etc.)
  • Künst­ler­si­tes (z.B. Ein­zel­künst­ler, Bands)
  • und wei­tere wie Online-​Tools (White­boards, Kon­fe­ren­zen, SaaS)
Theme »von der Stange«?

The­mes sind ein aus ver­schie­de­nen Sei­ten­vor­la­gen bestehen­des Design­sys­tem zur kon­sis­ten­ten Erstel­lung von Web­sites. Jede durch­ge­stal­tete Web­site ergibt letzt­lich ein Theme, das die Gestal­tung bestimmt.

Es gibt sie zu Tau­sen­den »von der Stange«. Mit so einem Theme lässt sich sehr schnell eine Web­site bauen, die attrak­tiv wirkt. Wenn Ihnen eins gefällt, kann man es »indi­vi­dua­li­sie­ren«.

Aber Vor­sicht! Es ist dabei mit Bedacht vor­zu­ge­hen. Nur wirk­lich hoch­wer­tige, durch­dachte und vom Her­stel­ler gepflegte The­mes sind emp­feh­lens­wert. Und was die Kon­zep­tion angeht, fol­gen sol­che The­mes oft sehr gän­gi­gen Auf­fas­sun­gen. Dies ist nicht unbe­dingt im Sinne der Stra­te­gie und der Iden­tity. Wenn doch, kann man es in Betracht zie­hen, damit zu arbeiten.

Wenn man kein Theme »von der Stange« ver­wen­den will, sind sie immer­hin nütz­lich als Inspi­ra­tion, um Gestal­tungs­fra­gen zu diskutieren.

Ich ver­wende selbst oft ein viel­sei­ti­ges Theme mit einem fle­xi­blen Schatz­kas­ten vol­ler nütz­li­cher Webseiten-​Elemente. Diese las­sen sich jeder­zeit mit klas­si­schem Code modifizieren.

Gestal­tung der Benut­zung: UX und UI

Eine zeit­ge­mäße Web­site reagiert auf ver­schie­dene Display­­größen von Smart­phone bis Desk­top, berück­sich­tigt Daten­schutz, ist benutzer­­freundlich gestal­tet, suchmaschinen­­freundlich und daten­si­cher programmiert.

Dazu kom­men noch all die komfor­tablen Ele­mente und Details wie kleine Ani­ma­tio­nen, ele­gante Über­gänge, Gale­rien, Video­player, Info-​Cards, Kon­takt­for­mu­lare und vie­les mehr.

All dies gehört in das Gestal­tungs­ge­biet User Expe­ri­ence und User Inter­face. Das zugrun­de­lie­gende UI/​UX-​Konzept bestimmt dabei die inter­ak­ti­ven Zusam­men­hänge und deren Ausgestaltung.

UX | User Expe­ri­ence Design

Abläufe und Benut­zer­füh­rung wol­len so gestal­tet sein, dass Website-​Besucher ein mög­lichst posi­ti­ves, moti­vie­ren­des Erleb­nis damit haben. Dazu gehö­ren auch spe­zi­el­lere Berei­che wie Acces­si­bi­lity (Zugänglichkeit/​Barrierefreiheit).

Man kann die Benut­zer­er­fah­rung mit Split-​Tests opti­mie­ren, bei denen ver­schie­dene Vari­an­ten einer Seite oder eines Ele­ments an ver­schie­dene Grup­pen aus­ge­lie­fert und aus­ge­wer­tet werden.

Oft hilft meine Gestal­tungs­er­fah­rung, um ein gutes UX zu produzieren.

UI | User Inter­face Design

Die­ser Bereich liegt nah am UX-​Design, befasst sich aber eher mit der Wahr­neh­mung, Anord­nung und Bezeich­nung von inter­ak­ti­ven Ele­men­ten zur Navi­ga­tion, öff­nen von Rei­tern und Tabs u.ä. All­ge­mei­ner gesagt geht es dabei um die Schnitt­stelle zwi­schen Mensch und Maschine.

Die Bedie­nung einer Web­site am Desktop-​Computer ist anders als auf einem Tablet oder Smart­phone. Das muss ebenso berück­sich­tigt wer­den wie die ver­schie­de­nen Grö­ßen der Displays.

Die flie­ßende Eigen­art einer Web­site erfor­dert oft viele kleine Anpas­sun­gen. Wäh­rend der­zeit meine meis­ten Arbei­ten auf einem Spal­ten­ras­ter basie­ren, ent­wi­ckeln sich auch stän­dig neue Ansätze, um anders an die­ses Gestal­tungs­thema her­an­zu­ge­hen. Ich ver­folge dies mit Interesse.

Team­work und Artdirection

Wenn es um kom­plexe Web­sites geht, über­nehme ich in Teams die Rolle des Art­di­rec­tors oder Desi­gners ohne tech­ni­sche Umsetzung.

Ebenso setze ich auf Coding-​Experten, wenn es um spe­zi­elle Progammie­rungen geht wie bei­spiels­weise eine spe­zi­elle Such­funktion mit Datenbank-Anbindung.

Tech­ni­sches – wen es interessiert

Es gibt viele tech­ni­sche Mög­lich­kei­ten, eine Web­site zu erstel­len und zu ver­öf­fent­li­chen. Wich­tig ist, dass die Sei­ten zuver­läs­sig erreich­bar, prä­sent, pfle­ge­leicht und rechts­si­cher sind. Hier beschreibe ich kurz wie ich der­zeit arbeite.

CMS und Pagebuilder

Nicht jede Web­site braucht ein so umfas­sen­des Redak­ti­ons­sys­tem (CMS) wie z.B. Word­Press. Aller­dings ist es oft gefor­dert, dass zumin­dest Teile einer Web­site kom­for­ta­bel von Kun­den­seite aktua­li­siert oder ergänzt wer­den kön­nen. Und das ohne die Inte­gri­tät des Designs zu gefährden.

In Micro­si­tes inte­griere ich dafür ein klei­nes, schlan­kes Tool, mit dem sich ein­fa­che Aktua­li­sie­run­gen und Erwei­te­run­gen machen lassen.

Wenn es öfters Ände­run­gen oder neue Arti­kel auf der Web­site geben soll, gestalte und ent­wickle ich Web­sites mit Word­Press und Divi Theme Page­builder. Das ermög­licht die Bear­bei­tung und Erwei­te­rung von Lay­outs durch akkre­di­tierte Dritte.

Divi ist eine Kom­bi­na­tion aus Theme und Page­buil­der. Ein Page­buil­der bie­tet viele indi­vi­du­ell gestalt­bare Module, die den Ent­wick­lungs­pro­zess einer Web­site beschleu­ni­gen und verschlanken.

Boot­strap
Wenn es um vor­wie­gend sta­ti­sche Web­sites geht, auf denen sich nicht viel ändert, ver­wende ich gern das Tool­kit Boot­strap, ein fle­xi­bles Sys­tem aus Sei­ten­ele­men­ten, Stil­de­fi­ni­tio­nen und Scrip­ten. Sowohl Gestal­tungs­spiel­raum als auch tech­ni­sche Aktua­li­tät sind damit gewährleistet.

Spe­zi­elle Fea­tures wie inter­ak­tive For­mu­lare, auto­ma­ti­sche Bild­grö­ßen, Bil­der­ga­le­rien u.ä. müs­sen aller­dings geson­dert instal­liert wer­den oder mit exter­nen Anbie­tern gelöst wer­den – eine Frage des Kon­zepts und der Zielsetzung.

SEO

SEO ist die Opti­mie­rung der Web­sei­ten im Hin­blick auf die Auf­find­bar­keit und das Ran­king in Internet-​Suchmaschinen wie u.a. Google oder Bing.

Alle meine Web­sites sind suchmaschinen-​freundlich ange­legt. Die grund­le­gen­den Meta-​Informationen wie Sei­ten­be­schrei­bun­gen, die seman­ti­sche Hier­ar­chie der Über­schrif­ten und die Berück­sich­ti­gung von Schlüs­sel­be­grif­fen und eini­ges mehr gehö­ren zum Standard.

Da SEO ein Pro­zess ist, an dem ste­tig gear­bei­tet wer­den kann, ist diese Arbeit ein eige­nes Feld. In Word­Press kann meine Kund­schaft mit geeig­ne­tem PlugIn selbst Hand anle­gen, Aus­wer­tun­gen begut­ach­ten und Opti­mie­run­gen vornehmen.

DSGVO Daten­schutz

Jede kom­mer­zi­elle Web­site – und das sind alle, die in irgend­ei­ner Weise ver­kaufs­för­dernd gedacht sind – braucht eine aktu­elle Daten­schutz­er­klä­rung und ein Impres­sum. Es gibt dafür Vor­la­gen und Gene­ra­to­ren, und man kann einen Anwalt damit beauftragen.

Die Pro­jekt­pha­sen

Jedes Website-​Projekt ist anders.
Die fol­gen­den Projekt­phasen gibt es aber immer:

  • Die Kon­zep­ti­ons­phase
  • Die Entwurfs­phase mit Revision(en)
  • Die produktions­reife Ausführung
  • Die Veröffent­lichung

Der Zeit­rah­men hängt von den Gegeben­heiten, dem vor­han­de­nen, zu beschaf­fenden und zu bearbeiten­den Mate­rial (Texte und Medien [Bil­der, Videos etc.]) und den Kapa­zi­tä­ten bei­der Sei­ten ab.

Remote arbei­ten

Mit ver­schie­de­nen inter­ak­ti­ven Online-​Tools lässt sich sehr gut auf Ent­fer­nung zusam­men­ar­bei­ten. Gute Erfah­run­gen habe ich mit Zoom und Miro.

Inwi­schen sind diese auch für euro­päi­sche Kun­den daten­schutz­recht­lich unbe­denk­li­cher ein­setz­bar. Stich­wort DSGVO bzw. GDPR.

Fra­gen zum Projektbeginn

Fol­gende und wei­tere Fra­ge­stel­lun­gen wer­den gemein­sam in Ruhe aus­führ­lich geklärt, bevor der erste Ent­wurf folgt. Um hier nur einige zu nennen:

  • Wel­che Ziele sol­len mit der Web­site erreicht werden?
  • Wel­ches Kli­en­tel spre­chen Sie an?
  • Gibt es ein Cor­po­rate Design?
  • Haben Sie Vor­stel­lun­gen zur Kon­zep­tion und Struktur?
  • Wel­che Funk­tio­nen soll die Web­site bieten?
  • Gibt es bereits Inhalte wie Texte, Bil­der, Grafiken?
  • Wer schreibt die Texte?
  • Wird die Web­site mehrsprachig?
  • Wol­len Sie Besu­chern der Web­site einen News­let­ter anbieten?
  • Soll es Down­loads geben? Wel­cher Art?
  • Möch­ten Sie ein Ana­ly­se­tool einsetzen?
  • Soll die Web­site einen News­be­reich (Blog) haben?
  • Pfle­gen Sie die Web­site selbst (Updates, neue Arti­kel, neue Seiten)?
  • Wird es Videos oder spe­zi­elle Ein­bin­dun­gen (z.B. 3D-​Rundumblick u.ä.) auf der Web­site geben?
  • uvm.

Kon­zep­tion, Ent­würfe und Revisionen

In die­sen Pha­sen wird oft am meis­ten dis­ku­tiert. In der Kon­zep­tion wird Grund­sätz­li­ches erör­tert und bespro­chen. Schließ­lich wird auf die­ser Basis dann wei­ter gegangen.

Die Ent­würfe und Revi­sio­nen sind als nächs­tes Gegen­stand von Betrach­tun­gen und Dis­kus­sio­nen, Ände­run­gen wer­den beschlos­sen und in jeder Revi­sion optimiert.

Je nach Bedarf fin­den diese Kon­takte fol­gen­der­ma­ßen statt:

  • Bei Ihnen
  • Bei mir in Hamburg
  • Per Video­kon­fe­renz
  • Tele­fo­nisch
  • Per Online-​Board
  • Per E‑Mail
Pro­duk­ti­ons­reife Ausführung

Finish der Gestal­tung und Ein­rich­tung des tech­ni­schen Rück­grats ste­hen vor der Ver­öf­fent­li­chung an. Dies ist meist ein eher inter­ner Vor­gang, bei dem die tech­ni­schen Details und Funk­tio­na­li­tä­ten wich­tig sind.

In die­ser Phase wer­den Module für Per­for­mance, Sicher­heit und Recht­li­ches sowie wei­tere Dinge wie News­let­ter, Seiten-​Templates u.ä. inte­griert und eingerichtet.

Diese Phase wird abge­schlos­sen mit:

  • Schluss­kor­rek­tur und
  • Freigabe/​Abnahme
Ver­öf­fent­li­chung und dann …

Jetzt geht’s online. Die Ent­wick­lungs­ver­sion wird in die Pro­duk­ti­ons­um­ge­bung migriert. Dort ste­hen noch diverse Tests und Kon­fi­gu­ra­tio­nen an, die auch den Hos­ting­ser­ver betref­fen wie z.B. die Akti­vie­rung des SSL-​Zertifikats oder Anle­gen von E‑Mail-​Adressen.

Nach der Frei­schal­tung erhal­ten meine Auf­trag­ge­be­rin­nen und Auf­trag­ge­ber wich­tige Infor­ma­tio­nen, z.B.:

  • Einwahl- und Zugangsdaten
  • wich­tige Links
  • tele­fo­ni­schen oder E‑Mail-​Support

Gebucht wer­den kann auch wei­tere Unter­stüt­zung, z.B.:

  • Einweisungen/​Tutorials
  • Schu­lun­gen (WordPress/​Divi/​Backend)
  • Admi­nis­tra­tion und Websitepflege

Projekt starten

Am besten senden Sie mir eine Anfrage mit dem nebenstehenden Formular. Ich schlage dann einen Gesprächstermin vor.

Ich lese jede E-Mail. Wenn Sie nichts von mir hören, ist die E-Mail aus irgend einem Grund nicht angekommen. Spätestens dann rufen Sie bitte einfach an.

Datenschutzhinweis: Ihre Angaben werden verschlüsselt übertragen und vertraulich behandelt. Die Daten dienen nur der Kontaktaufnahme zur Beantwortung Ihrer Anfrage.
Datenschutzerklärung.

Anfrage

10 + 13 =

Mit dem Absenden des Formulars stimmen Sie der Verarbeitung Ihrer Daten zu.

Mit Absenden des Formulars stimmst du der Verarbeitung der Daten zur Bearbeitung der Anfrage zu. Datenschutzerklärung.

Ich möchte mich ganz herzlich für die achtsame und inspirierte Zusammenarbeit mit Dir bedanken.

Ich habe von Anfang an gespürt, dass ich bei Dir im gemeinsamen Gestalten meiner Webseite in guten Händen bin, die einerseits kreative Anregung geben und andererseits niemals in meine gewünschten Inhalte dergestalt eingreifen würden, dass sich mein gewünschtes Ergebnis verfälscht anfühlte.

Ein Kommunikationsdesigner bist Du wahrhaft! Du findest sowohl optischen Ausdruck für die Vermittlung der gewünschten Inhalte als auch gegebenenfalls dezente sprachliche Anregung zur Klärung des auf der Webseite gezeigten Angebotes.

Ich habe mich rundum wahrgenommen gefühlt und bin mehr als zufrieden mit dem Ergebnis der gemeinsamen Arbeit.

In Deinem Preisangebot bist Du verbindlich und transparent, ebenso schätzte ich die Möglichkeit des zeitnahen Austauschs während des Gestaltungsprozesses, welcher jederzeit verlässlich war. Bemerkenswert, da wir über große räumliche Distanz gearbeitet haben. So war es jederzeit möglich, die gemeinsamen Inhalte anschaulich zu besprechen.

Auch Deine Beratung hinsichtlich WordPress, Divi Theme/Pagebuilder, Datenschutz und Sicherheit waren hilfreich und ich wurde von Dir schnell in die Lage versetzt, auch eigenständig Beiträge in meine Webseite einzupflegen oder Inhalte zeitnah zu korrigieren.

Herzensdank und meine wärmste Empfehlung!

Stefanie Schumacher

stefanieschumacher.de