Der erste Eindruck zählt: dein Porträt-Foto für die Website

Der erste Eindruck zählt: dein Porträt-Foto für die Website

Was du für ein perfektes Porträt-Foto auf deiner Website tun kannst.

Das Berater- und Coach-Business ist People-Business. Es zählt der Nasenfaktor. Menschen, die deine Website besuchen, sind auf der Suche nach jemandem, dem sie Vertrauen schenken und zu dem sie eine Beziehung aufbauen können. Dein Porträt-Foto spielt dabei eine entscheidende Rolle. Es ist ein wichtiger Baustein, um eine erste Verbindung herzustellen.

Wie wird ein Porträt-Foto gelesen?

Für den ersten Eindruck möchten die Besucher*innen deiner Website dein Gesicht erkennen. Worauf sie außerdem achten:

Professionalität
Wie wirkt das gesamte Erscheinungsbild?

Vertrauenswürdigkeit
Wie entspannt und sicher wirkst du auf den Fotos? Transportieren deine Fotos ein ausgeglichenes Selbstbewusstsein?

Persönlichkeit
Was erzählen die Fotos über deine Persönlichkeit: Deine Besucher*innen fragen sich, ob die Chemie zwischen dir und ihnen stimmen wird.

Kompetenz
Was sagen deine Fotos über deine Kompetenz und Erfahrung aus?

Was macht ein gutes Porträt-Foto aus?

Die wichtigsten und zugleich basalen Merkmale eines guten Porträt-Fotos sind:

Schärfe und Klarheit
Dein Porträt-Foto sollte scharf sein und dein Gesicht deutlich zeigen.

Gutes Licht
Dein Gesicht sollte gut ausgeleuchtet sein, sodass keine harten Schatten entstehen.

Passender Hintergrund
Der Hintergrund sollte seinem Namen gerecht werden und im Hintergrund bleiben – sich also nicht in den Vordergrund drängen. Er beeinflusst die Atmosphäre deiner Fotos und kann – geschickt eingesetzt – etwas von dir erzählen.

Ausdruck, Gestik, Mimik
Deine Mimik und deine Gesten sollten natürlich, geübt und authentisch wirken. Alles Gestellte wirkt falsch und kann den Aufbau eines Vertrauensverhältnisses stören.

Blickkontakt
Schaue in die Kamera, um deine Besucher*innen direkt anzusprechen und eine Verbindung herzustellen.

Kleidung
Deine Kleidung sollte zu dir und deinen Kunden passen, ebenso zum Stil und der Farbigkeit deiner Website.

Auflösung und Größe
Achte darauf, dass du die Fotos in hoher Auflösung bekommst, damit du sie je nach Verwendungszweck verkleinert oder ausschnittsweise verwenden kannst.

Bearbeitung
Die Fotos sollten professionell bearbeitet sein und dich in ein gutes Licht stellen, ohne dabei unnatürlich zu wirken.

Lust auf Experimente?

Hinsichtlich des Aufbaus und der Struktur deiner Website empfehle ich dir, bei den Standards zu bleiben. Auch bei den Texten ist Klarheit und Prägnanz wichtiger als Kunst. Womit kannst du deiner Website Persönlichkeit verleihen und eigene Akzente setzen? Nimm die Fotos. Sie sind dein Spielfeld. So kommst du auf neue Ideen:

Inspiration mithilfe anderer Fotos
Schau dir Websites von Kollegen oder von spezialisierten Porträt-Fotografen an und lass dich inspirieren.

Themen, Persönlichkeit und Interessen
Gibt es etwas, das dein Business symbolisiert oder sich wie ein roter Faden durch dein Business hindurchzieht? Ist dein Coaching frisch wie der junge Morgen oder eine Brise am Meer? Oder gibt es etwas, das typisch ist für deinen Charakter und deine Persönlichkeit? Finde Wege, deine Interessen oder Business-Themen in deine Fotos einfließen zu lassen, etwa mithilfe von Requisiten oder Hintergründen.

Relativ verbreitet sind Fotos, die Coaching- oder Schulungsszenen nachstellen. Das ist naheliegend. Doch wenn ich ehrlich sprechen darf: Meist sind die Szenen gestellt und so wirken sie auch.

Den Profi fragen
Auch mit deinem Fotografen oder deiner Fotografin kannst du Ideen spinnen und kreative Konzepte entwerfen.

Im Coach- und Berater-Business geben wir uns viel Mühe, einen Unterschied zu machen. Über die Leistung als Berater oder Coach ist das meist nur schwer möglich. Anders sieht es mit Porträt-Fotos aus: Mit Kreativität und Offenheit kannst du punkten.

Wie viele Porträt-Fotos sind nötig?

Mit einem guten Foto auf der Startseite und einem auf der Über-mich-Seite ist schon viel gewonnen.

Wenn du jedoch für unterschiedliche Zielgruppen arbeitest oder in verschiedenen Rollen – etwa als Coach oder Großgruppen-Moderator – können verschiedene Fotos von dir sinnvoll sein. Sie zeigen, wie du deine Rollen jeweils ausfüllst. Wenn du verschiedene Fotos verwendest, sollten sie dennoch einen einheitlichen Eindruck hinterlassen.

Foto im Freien oder im Studio?

Porträt-Foto im Freien

Im Freien fällt es oft leichter, eine lässige, entspannte Atmosphäre und ein ungezwungenes Erscheinungsbild herzustellen.

Zudem kannst du mit der gezielten Auswahl des Hintergrunds etwas von dir erzählen: Lässt du dich im Park, in einer Stadtlandschaft oder vor Industriegebäuden ablichten? Der Hintergrund transportiert eine Botschaft und kann deine Besucher*innen neugierig machen.

Ein Foto-Termin im Freien lässt sich allerdings nur schwer planen: Oft spielt das Wetter einen Streich. Davon kann ich ein Lied singen: Bei einer Gelegenheit war der Himmel bleigrau – die Fotos entsprechend düster. In einem anderen Fall schien die Sonne so stark, dass ich fast nichts sehen konnte.

Zudem gilt es, rechtliche Fragen zu beachten: Bei zufälligen Spaziergängern auf deinem Business-Foto können Persönlichkeitsrechte verletzt sein. Außerdem sind Bauwerke wie Museen oder Statuen oft urheberrechtlich geschützt. Auch bei Firmengebäuden musst du aufpassen. Sprich am besten mit deinem Fotografen oder deiner Fotografin.

Porträt-Foto im Studio

Mit einem Porträt-Foto im Studio hast du es viel leichter. Dank der Studio-Scheinwerfer und einem neutralen Hintergrund ist es einfach, professionell ausgeleuchtete und einheitliche Porträts zu fotografieren. Studio-Fotos lassen sich zudem einfacher bearbeiten und retuschieren.

Aber wer sagt, dass du dich für eine Variante entscheiden musst? Vielleicht verwendest du ein klassisches Business-Foto auf deiner Startseite und eines in deiner Wohnumgebung auf der Über-mich-Seite?

Ab wann sind Porträt-Fotos alt?

Dazu gibt es keine einheitliche Empfehlung. Die Fotos sollten dich und dein Business angemessen widerspiegeln. Einige Experten empfehlen, die Fotos alle 1 bis 2 Jahre auszutauschen. Mir scheint das viel zu sein.

Spätestens nach 4, 5 Jahren wird es allerdings auch aus meiner Sicht Zeit. Auch wenn man es nicht gerne hören mag: Innerhalb dieser Zeit verändert sich ein Mensch und sich krampfhaft an einem jüngeren Ich festzuhalten, wirkt auch nicht besonders souverän.

Porträt-Foto oder Video?

Wenn wir schon über Persönlichkeit, Vertrauen und Bildmaterial sprechen: Ist ein Video da nicht viel aussagekräftiger? Porträt-Fotos und Videos haben jeweils eigene Vor- und Nachteile.

Vorteile von Porträt-Fotos

  • Porträt-Fotos sind relativ leicht herzustellen.
  • Sie legen einen Fokus auf dein Gesicht und helfen den Besucher*innen, eine Verbindung zu dir herzustellen.
  • Es ist vergleichsweise einfach, einen professionellen Gesamteindruck zu vermitteln.

Nachteile von Porträt-Fotos

  • Fotos sind im Vergleich zu Videos weniger stark darin, deine Besucher*innen emotional anzusprechen.
  • Bewegungen und Gesten sind Ausdruck deiner Persönlichkeit. Doch auf einem Foto bleiben sie verborgen.
  • Fotos sind weniger abwechslungsreich als Videos.

Vorteile von Videos

  • Videos können stärker emotionalisieren als Porträts.
  • Dank deiner Gestik, Mimik und deiner Stimme zeichnen sie ein vollständigeres Bild von dir.
  • Bewegtbilder binden die Aufmerksamkeit stärker als statische Bilder.

Nachteile von Videos

  • Videos erfordern mehr Aufwand bei der Produktion und Nachbearbeitung.
  • Wegen des hohen Datenvolumens können sie dazu führen, dass deine Website langsamer lädt.
  • Wenn du vor der Kamera weniger geübt bist, kann die Produktion aufwendig sein – oder sogar einen negativen Eindruck hinterlassen.

Generell ist ein Video eine gute Ergänzung zu deinen Porträt-Fotos. Wenn du wenig geübt bist vor der Kamera, solltest du dir einen Profi als Beistand an deine Seite holen.

Was macht einen guten Fotografen aus?

Ein guter Fotograf sollte sein Handwerkszeug im Griff haben. Das ist banal. Manche Fotografen haben jedoch ein gutes Händchen und Sinn für das richtige Timing. Wie findet man so jemanden?

  • Sprich am besten mit Kollegen und Freunden und lass dir jemanden empfehlen. Oder recherchiere Fotografen im Netz.
  • Mach dir anschließend selbst ein Bild und sprich mit ihm oder ihr. Ein guter Fotograf interessiert sich dafür, was du kommunizieren möchtest. Er macht sich ein Bild von deiner Persönlichkeit und gewinnt so eine Idee, wie er dich vorteilhaft in Szene setzt.
  • Außerdem muss er wissen, wozu du deine Fotos benötigst: Geht es ausschließlich um die Website oder sollen die Fotos außerdem in den Social Media verwendet werden?

Tipp
Sprich im Vorfeld zusätzlich mit deinem Webdesigner. Welche Anforderungen gibt es aus seiner Sicht? Das Header-Foto direkt oben auf der Startseite hat so seine Eigenheiten. Lass dir die Anforderungen sowie die Höhe und Breite nennen.

Entspannt zum Termin

Vorbereitung durch den Fotografen oder die Fotografin

Damit du dich während des Shootings wohl und entspannt fühlst:

  • Sollte sich dein Fotograf oder deine Fotografin Zeit nehmen, um mit dir zu sprechen, sodass du dich ihm oder ihr anvertrauen kannst.
  • Der Profi sollte in der Lage sein, eine lockere Atmosphäre zu schaffen. Dazu kann er dir vielleicht Geschichten erzählen oder Musik einspielen.
  • Er oder sie sollte dir klare Anweisungen geben, wie du dich positionieren solltest – damit du weißt, was von dir erwartet wird.
  • Ein guter Fotograf gibt die zwischendurch Zeit, Luft zu holen und die Gesichtsmuskeln zu entspannen.

In mehr als 15 Jahren Selbstständigkeit habe ich bereits einige Shootings hinter mich gebracht. Dabei habe ich gelernt: Ein hohes Honorar ist keine Garantie für gute Fotos. Ein erfolgreiches Shooting hat etwas mit Vorbereitung, einer guten Stimmung und Timing zu tun.

Was du außerdem tun kannst

Wie bereitest du dich am besten auf dein Fotoshooting vor?

  • Viele Kunden machen ihren Foto-Termin im Anschluss an ihren Urlaub. Eine gute Idee finde ich: Man ist entspannt und hat ein frische bisschen Farbe im Gesicht.
  • Wenn du dir einen Foto-Profi ausgesucht hast, bleibt dir kaum mehr, als möglichst entspannt und ausgeschlafen zum Termin zu erscheinen. Nimm dir Zeit: Lass dich nicht unter Druck setzen, weil direkt nach dem Shooting der nächste Termin ansteht. Man würde es dir ansehen.
  • Sorge für eine positive Haltung: Höre deine Lieblingsmusik, mache einen Spaziergang oder tue etwas anderes, dass dich in eine positive Stimmung versetzt.

Kleidung

Beachte hinsichtlich deiner Kleidung:

  • Kleide dich für deine Fotos so, wie du bei deinen Kunden erscheinen würdest.
  • Wähle deine Kleidung so aus, dass du dich wohlfühlst: Ein guter Sitz und Farben, die dir stehen, sind wichtig.
  • Kleine Muster und Streifen sind schwierig, da sie einen Moiré-Effekt erzeugen können. Dabei können unerwünschte Wellenmuster entstehen.
  • Große Tücher wirken auf Fotos oft nicht gut. Auch für Schmuck gilt: Weniger ist mehr.
  • Stimme, wenn möglich, deine Kleidung auf die Farbigkeit deiner Website ab. Je weniger dein Fotograf nachbearbeiten muss, umso besser.
  • Denke darüber nach, ob du vor deinem Foto-Termin einen Friseurbesuch und einen Besuch bei einem Visagisten einlegst. Sprich im Vorgespräch mit deinem Fotografen: Oft arbeitet er mit Kooperationspartnern und kann dir eine Empfehlung aussprechen.

Deine To-dos

  • Mach dir bewusst, wie du dich vorstellen möchtest: überlegt, temperamentvoll, seriös? Oder wie möchtest du dich präsentieren?
  • Stelle fest, wie viele Fotos du benötigst und in welcher Größe. Sprich ggf. mit deinem Webdesigner, ob es hinsichtlich des Header-Fotos etwas zu beachten gibt.
  • Suche dir einen Fotografen oder eine Fotografin, mit der du gut zurechtkommst. Du solltest Vertrauen zu ihm oder ihr haben und gerne Zeit mit ihr verbringen, sodass du auf deinen Fotos echt und locker wirkst.
  • Zwei gute Porträt-Fotos sind in Ordnung.
  • Wenn du etwas Besonderes machen möchtest, sprich mit deinem Fotografen: Spinnt gemeinsam kreative Ideen. Fotografen haben manchmal Zugang zu Wohnungen oder besondere, attraktive Räume. Auch das ist eine Möglichkeit, erhöht jedoch den Aufwand und schlägt sich im Honorar nieder.
Die Kunst der Navigation

Die Kunst der Navigation

Wie du deine Coach- und Berater-Website mithilfe der Navigation optimal strukturierst

Stell dir vor, du bist in einer fremden Stadt. Du hast einen Termin mit einem Kunden. Bis dahin bleibt dir nur noch wenig Zeit. Was du jetzt wirklich nicht gebrauchen kannst, ist dich zu verlaufen. Alles, was du möchtest, ist schnell und direkt an dein Ziel zu kommen.

Deinen Besuchern und Besucherinnen auf deiner Website ergeht es ebenso. Sie haben ein Thema im Kopf und wünschen sich eine Antwort, und zwar schnell – möglichst ohne in Unterverzeichnissen herumzusuchen oder Texte zu lesen, die ihnen nicht weiterhelfen.

Weshalb solltest du dich mit der Navigation beschäftigen?

Mit einer klug gestalteten Navigation hilfst du deinen Besucher*innen. Und das ist zugleich vorteilhaft für dich.

Was „klar“ und „übersichtlich“ bedeutet, hängt von der Perspektive deiner Besucher*innen ab. Welche Themen sind aus ihrer Sicht wichtig? Was müssen sie wissen? Indem du deine Inhalte entlang der Bedürfnisse deiner Besucher*innen anordnest, zeigst du ihnen, dass du um ihre Fragen weißt. Und dass es dir ein Anliegen ist, sie nutzerfreundlich, schnell und komfortabel zu beantworten. Die Vertrauenswürdigkeit deiner Website steigt und deine Besucher*innen halten sich gerne auf deiner Website auf. Die steigende Besuchsdauer ist wichtig, denn:

Sichtbarkeit
Eine hohe Besuchsdauer ist für Google ein Signal, dass deine Website wichtige Inhalte bereitstellt. Das Ranking deiner Website verbessert sich und damit deine Sichtbarkeit.

Conversion Rate
Du möchtest, dass deine Besucher*innen deinen Newsletter abonnieren oder Kontakt zu dir aufnehmen? Je wohler sie sich auf deiner Seite fühlen und je länger sie bleiben, desto höher ist die Wahrscheinlichkeit.

Was alles gehört zur Website-Navigation?

Die Navigation umfasst die Gesamtzahl aller Links, Menüs und anderer Elemente, die deinen Besucher*innen helfen, sich auf deiner Seite zu orientieren und die gewünschten Informationen zu finden.

Die Schatzkiste: 9 wichtige Navigations-Varianten

Auf Coach- und Berater-Websites triffst du in der Regel auf diese Navigations-Typen:

Horizontale Navigation

Die Navigation ist quer angeordnet und steht in der Regel am oberen Rand der Website.

Beispiel für eine horizontale Navigation
Beispiel: horizontales Menü

Vertikale Navigation

Wie der Name sagt, ist diese Navigation in Längsrichtung angeordnet und steht meist am linken Rand der Website.

Drop-down-Navigation

Ein Dropdown-Menü klappt auf, wenn die Benutzer*innen mit der Maus über das Hauptmenü fahren oder klicken.

Beispiel für ein Drop-down-Menü.
Beispiel: Drop-down-Menü

Suchfeld

In ein Suchfeld tippen deine Besucher*innen Suchbegriffe ein und können so nach bestimmten Inhalten auf deiner Website suchen.

Beispiel für ein Suchfeld.

Footer-Navigation

Die Footer-Navigation ist am unteren Rand deiner Website platziert.

Das Besondere hier: Der Footer wird in der Regel auf jeder Seite deiner Website eingeblendet. Deshalb stehen hier oft die Links zu den rechtlich notwendigen Seite wie Impressum oder Datenschutz, wie hier im Beispiel.

Den Footer kannst du zusätzlich nutzen, um weiterführende Inhalte anzubieten. Denn die Besucher*innen, die deine Seite bis zum Fuß lesen, sind engagierter als andere.

Im Beispiel siehst du eine Verlinkung innerhalb der sogenannten „Widgets“.

Beispiel für eine Footer-Navigation innerhalb der Widgets.
Beispiel: Links im Footer

Interne Links

Links, die in einen Fließtext eingebettet sind, erlauben es deinen Besucher*innen, inhaltlich passende, weiterführende Seiten anzusteuern (3).

Beispiel für eine interne Verlinkung.
Beispiel: interne Links

Tag Cloud

Eine Tag-Cloud oder Schlagwortwolke siehst du häufig auf Blogs oder in Magazinen. Die Wolken zeigen den Besucher*innen, zu welchen Inhalten der Blog oder das Magazin Inhalte zur Verfügung stellt (3).

Beispiel für eine Tag Cloud.
Beispiel: Tag Cloud

Navigation auf einer Seite

Du hast eine umfangreiche Seite oder einen ausführlichen Artikel angelegt? Deine Besucher*innen müssen lange scrollen, bis sie an das Ende kommen? Mit sogenannten „Sprungmarken“ ermöglichst du es deinen Besucher*innen, auf der Seite zu springen und sich das herauszupicken, was sie interessiert (3). Das Inhaltsverzeichnis am Beginn eines Artikels ist ein verbreitetes Beispiel.

Beispiel für eine Navigation auf einer Seite, umgesetzt mit einem Inhaltsverzeichnis.

Hamburger Menü

Das Hamburger Menü spielt auf einen Burger an und meint das einfache, dreizeilige Symbol, du hauptsächlich in der mobilen Navigation findest. Es wird häufig dann eingesetzt, wenn der Platz begrenzt ist und das Design nicht beeinträchtigt werden soll (4).

Beispiel für ein Hamburger Menü.
Beispiel: Hamburger Menü

Die Navigations-Varianten können einzeln oder im Verbund eingesetzt werden. Es gibt noch mehr Varianten, als ich sie hier in einem Übersichtsartikel vorstellen möchte. Die Navigation ist nicht nur ein wichtiges, strukturgebendes Element. Sie kann zugleich ein Mittel der Gestaltung sein.

Die Firma „Dream Production“ stellt in einem Artikel schicke Navigations-Varianten vor:
Es hat sich viel getan, seit vor mehr als 25 Jahren die erste Webseite das Licht der Welt erblickte.

Wie gehst du am besten vor?

1. Beginne mit der Seitenstruktur

Wie möchtest du die Inhalte deiner (künftigen) Website anordnen? Beginne damit, die Inhalte zu strukturieren. Auf einer Coach- oder Berater-Website bieten sich mehrere Möglichkeiten an:

  • Ordnung nach Formaten wie Coaching, Training, Beratung, Mediation oder Moderation.
  • Nach Aufgabenfeldern oder Kunden-Problemen wie „Neu in der Führungsrolle“ oder „Konflikte im Team“.
  • Nach Kundengruppen wie Firmenkunden und Selbstzahler.

Tipps für die Anordnung deiner Inhalte

Die Anordnung nach den Formaten wie Training, Beratung, Coaching ist weitverbreitet. Ich sehe allerdings vier Probleme:

Es entstehen viele Seiten.
Je nach Erfahrung und Dauer der Selbstständigkeit kann die Liste der Seite sehr umfangreich sein: Training, Beratung, Coaching, Mediation, Moderation, Großgruppenformate und anderes mehr.

Auf allen Seiten steht fast derselbe Text.
Das habe ich schon X-fach erlebt: Berater und Coachs bieten Führungskräfteentwicklung, Kommunikation, Teamentwicklung und Konfliktmanagement an – und das in unterschiedlichen Formaten wie Beratung, Coaching oder Training.

Du ahnst, worauf das hinausläuft. Wenn du deine Website nach Formaten anordnest, bleiben dir für die Angebotsseiten zwei Möglichkeiten: Du schreibst darüber, welche Aufgaben und Probleme zu löst – dann schreibst du drei- oder viermal dasselbe. Oder du erklärst die Formate Coaching, Training und Beratung. Abhängig von den Zielkunden ist das jedoch ausgesprochen uninteressant.

Kunden müssen die Diagnose selbst stellen.
Kunden buchen dich, weil sie Probleme sehen oder sich Verbesserungen wünschen. Ob Training, Beratung oder Coaching das Richtige für sie ist, wissen sie oft nicht. Die Anordnung der Inhalte nach Formaten hilft oft nicht.

Die Wirklichkeit ist ohnehin eine andere.
Nach meiner Beobachtung werden Kunden für eine Aufgabe in die Unternehmen gerufen. Dort packen sie ihren Werkzeugkoffer aus und stellen für ihre Kunden ein Set zusammen, das Elemente aus allen Formaten enthält.

Tools die deine Planung unterstützen

Aus diesen Gründen bin ich kein Fan der Struktur nach Formaten. Doch es kommt auf den Einzelfall an. Am besten probierst du aus, was für dich am besten funktioniert. Bei deiner Planung hilft dir ein schlichtes Whiteboard. Doch wie überall gibt es auch hier Tools:

Miro
Miro ist bei Coachs und Beratern ohnehin recht verbreitet.

Gloo Maps
Empfinde ich als übersichtlicher, ist jedoch ein weiteres Tool.

2. Begrenze die Zahl der Optionen im Hauptmenü

Das Kurzzeitgedächtnis stößt schnell an seine Grenzen. Nach dem amerikanischen Psychologen George Armitage Miller kann das Gehirn nur etwa sechs bis sieben Einheiten gleichzeitig erfassen. Sieben Einheiten sind deshalb als „Millersche Zahl“ bekannt.

Von der kurzen Aufmerksamkeitsspanne der Besucher*innen in Netz hast du bestimmt schon gehört. Deshalb solltest du es ihnen nicht zu schwer machen und die Zahl der Optionen begrenzen (1). Sechs Optionen gelten als empfehlenswerte Obergrenze, mehr als acht sollten es nicht sein.

3. Beachte die Drei-Klick-Regel

Mit jedem Klick verlierst du Besucher. Deshalb sollten deine Besucher*innen mit spätestens drei Klicks an ihrem Ziel sein (1). Zwei Klicks sind noch besser. Für deine Struktur bedeutet das, dass du mit höchstens drei Hierarchieebenen auskommen solltest.

4. Vertraue auf etablierte Standards

Bedenke noch einmal das Eingangsbeispiel mit einem Besuch in einer fremden Stadt. Kreative Verkehrsleitpläne machen Besucher*innen das Leben schwer (2). Auch in Hinblick auf Navigation tust du dir mit Abweichungen vom Standard keinen Gefallen. Klar, vertraut und einfach heißt hier die Devise.

5. Verwende die Sprache deiner Besucher*innen

Verwende in deiner Navigation verständliche und möglichst kurze Begriffe (2).

6. Arbeite mit einheitlichen Kategorien

Bleibe bei der Namensgebung in einer Kategorie. Das bedeutet: Wenn du die Struktur deiner Website entlang der Aufgaben bei deinen Kunden aufbaust, ist es irritierend, wenn du plötzlich auf Formate wechselst.

Design-Profis interessieren sich außerdem für Dinge wie eine lesefreundliche Beschriftung oder die Anpassung an die mobile Ansicht (Responsive Design). Doch ich gehe davon aus, dass du entweder mit einem solchen Profi zusammenarbeitest oder auf ein fertiges Design zurückgreifst. Deine wichtigste Aufgabe ist es, eine sinnvolle Struktur herzustellen.

Beispiele, Probleme und Lösungen

Dies sind Original-Beispiele, die ich aus dem Netz gefischt habe. Du siehst sie hier in vereinheitlichter Darstellung, damit sie nicht zurückverfolgt werden können:

Unverständlich

Websites für Coachs und Berater: unverständliche Navigation

In dieser Navigation mischen sich Aufgaben und Leistungen (Kommunikation, XYZ-Management) mit einer Maßnahme (Fortbildung). Zudem ist „Kommunikation“ ein schwieriger Begriff, denn Kommunikation ist alles – von der nonverbalen Kommunikation bis zum Konflikt. Unterschiedliche Berufsgruppen verstehen Unterschiedliches darunter. Man müsste den Begriff zumindest einordnen. Die Navigation bleibt insgesamt unverständlich.

Umfangreich

Websites für Coachs und Berater: umfangreiche Navigation

Zehn Optionen sind zu viel, um sie zu überblicken. Zudem mischen sich auch hier unterschiedliche Kategorien. Die Navigation ist zu umfangreich und zugleich unverständlich.

Einfach und übersichtlich

Websites für Coachs und Berater: einfache Navigation

Glücklich ist, wer seine Leistungen derart knapp und klar auf den Punkt zu bringen versteht. Toll!

Musterhaft

Websites für Coachs und Berater: musterhafte Navigation

Diese Navigation entspricht dem Standard, und das ist auch gut so. Einfach, verständlich, vertraut – so kann man das machen. Wenn ich ein kleines bisschen herumnörgeln darf: Das Impressum und den Datenschutz würde ich in den Footer stellen.

Irritierend

Navigation für Websites von Coachs und Berater: Irritierendes Beispiel

Die Profil- oder Über-mich-Seite steht an der zweiten Stelle. Ungewöhnlich. Wirklich irritierende finde ich „Beratungsprozess“ und „Gefördertes Coaching“. Vermutlich sind „Coaching“ und „Fördermittel“ gemeint, sicher bin ich mir nicht.

Mustervorlage

Du suchst einen Ausgangspunkt, an dem entlang du deine Navigation aufbauen kannst? Gerne: Hier ist eine Mustervorlage.

Mustervorlage für die Navigation auf einer Website für Coachs und Berater.

Quellen

Quellen, die in diesem Blog-Beitrag verwendet wurden.

(1) Eology, Die richtige Website Navigation – so führst Du Deine Nutzer ans Ziel!
(2) Kinsta, Wie man die Navigation auf Webseiten verbessert
(3) SEOKratie, Tipps, Tricks & Beispiele für eine erstklassige Online-Shop-Navigation
(4) WIX Blog, 10 Website Navigation Tips for a Smooth User Experience

Webdesign für Coaches: Warum die Schriftart so wichtig ist

Webdesign für Coaches: Warum die Schriftart so wichtig ist

Tipps für die Auswahl der perfekten Schriftart, um deine Coaching-Webseite professionell und ansprechend zu gestalten.

Die Schriftart ist ein oft unterschätztes Gestaltungsmittel deiner Website. Ist die Schriftart gut ausgewählt und professionell eingesetzt, lädt sie zum Bleiben ein. Die Texte lassen sich leicht und angenehm lesen. Das Schriftbild wirkt insgesamt harmonisch. Deine Besucher und Besucherinnen haben Lust auf deiner Website zu stöbern und sich mit deinen Inhalten zu beschäftigen.

Schlecht ausgewählte oder unpassend eingesetzte Schriftarten hingegen machen das Lesen schwer. Eine gute Schrift fällt nicht weiter auf. Eine schlechte umso mehr.

Das musst du wissen

Die Schriftart ist Teil deiner Brand

Wie möchtest du dich deinem Publikum vorstellen: modern, feminin, elegant, innovativ, vertrauenswürdig, verspielt – oder was ist dein Stil? Durch die Auswahl deiner Schriftart kannst du die gewünschte Wirkung erzielen.

Wenn du magst, schau dich bei CANVA um: Dort findest du mehr über Schriftarten (Fonts) und ihre Botschaften: 18 professionelle Fonts für deine Website

Die weiße Fläche ist ebenso wichtig wie die Schrift

Die schönste Schriftart nützt dir nichts, wenn sie ungeschickt eingesetzt wird. Zu kleine Buchstaben, lange Zeilen oder enge Abstände zwischen den Zeilen erschweren es deinen Lesern und Leserinnen, den Inhalt deines Textes zu erfassen. Eine gut lesbare Schrift braucht Luft zum Atmen – genug, aber nicht zu viel. Hier ein paar Tipps zur Orientierung:

Schriftgröße

Die empfohlene Schriftgröße für Fließtexte liegt bei 16 bis 18 Pixel. Der Fließtext legt die 100-Prozent-Marke fest. Alles andere wie die Überschriften orientieren sich daran.

Überschriften sind ein Mittel, Texte zu strukturieren und eine Hierarchie herzustellen. Sie sollten sichtbar größer sein als der Fließtext, damit sich deine Leser und Leserinnen orientieren können. Versuche es einmal mit diesen Maßen.:

  • H1-Überschrift zwischen 180 und 200 Prozent.
  • H2-Überschrift zwischen 130 und 150 Prozent.
  • H3-Überschrift in etwa so groß wie der Fließtext.

Je größer der Unterschied zwischen Überschrift und Fließtext, desto dramatischer die Wirkung.

Zeilenhöhe

Die Zeilenhöhe definiert den weißen Raum zwischen den Zeilen. Dieser Raum ist wichtig für die Lesbarkeit: Stehen die Zeilen zu eng zusammen, wird das Lesen mühsam. Ist der Abstand zu groß, wirkt das Textbild unharmonisch.

Die Zeilenhöhe beträgt im Schnitt das 1,5-fache der zugehörigen Schrift. Ist der Fließtext 16 Pixel hoch, beträgt die Zeilenhöhe 24 Pixel.

Zeilenlänge

Die ideale Zeilenlänge liegt zwischen 75 und 80 Zeichen pro Zeile. Deine Leser und Leserinnen sollten in der Lage sein, am Ende einer Zeile gleich den Anfang der nächsten Zeile zu erfassen.

Die gekonnte Verwendung von Schriften ist keine exakte Wissenschaft. Das Gesamtbild entscheidet. Zudem hängen die richtige Schriftgröße und der Zeilenabstand von der Schriftart ab. Manche Schriftarten wirken größer, andere kleiner.

Der Golden Ratio Typography Calculator kann dir weiterhelfen. Er rechnet Abstände, Zeilenlauflängen und Schriftgrößen in Abhängigkeit der ausgewählten Schriftart aus.

Die perfekte Schriftart für deine Website: Best Practices

Serifen-Schrift vs. serifenlose Schrift

Serifen sind die kleinen An- und Abstrichen am Anfang oder am Ende eines Buchstabens. Serifen-Schriften eignen sich für Bücher, Zeitschriften und andere Print-Erzeugnisse. Für das Internet haben sich Schriftarten ohne Serifen bewährt.

Beispiel: Serifenschrift
Serifen-Schrift
Beispiel: serfenlose Schrift
Serifenlose Schrift

Websichere Schriftarten

Websichere Schriften sind solche, die ab Werk auf Desktop-Rechnern, Tablets oder Smartphones installiert sind. Sie gelten als sicher, weil sie auf fast allen Geräten der Welt geladen und korrekt angezeigt werden können – unabhängig von Ort und vom Device.

Zu den verbreitetsten „sicheren“ Schriftarten zählen:

  • Arial
  • Verdana
  • Helvetica
  • Tacoma
  • Trebuchet MS
  • Times New Roman
  • Georgia
  • Garamond
  • Courier New
  • Brush Script MT

Die Gestaltungsmöglichkeiten sind allerdings eingeschränkt. Solltest du dich für eine exklusive Schriftart entscheiden, kann es sein, dass diese auf dem Endgerät deines Besuchers nicht installiert ist. Ruft dein Besucher deine Website auf, muss sein Gerät sowohl Inhalt als auch die Schrift herunterladen.

Je mehr Daten, desto langsamer wird die Seitenladegeschwindigkeit. In der Regel lässt sich der Nachteil verschmerzen, doch wenn dein Besucher ein altes System verwendet oder die Leitung langsam ist, kann dies zu einem Störfaktor werden.

Viele Web-Profis empfehlen deshalb, eine „schöne“ Schriftart und eine Standard-Schriftart als Fallback zu verwenden.

Google-Schriften und die DSGVO

Google bietet unzählige Schriften an, eine wahre Fundgrube! Diese sogenannten Web-Fonts liegen im Netz auf einem Google-Server. Du kannst sie auf deiner Website verwenden, ohne sie fest zu installieren. Die Schriften bleiben im Netz.

Ruft ein Besucher deine Website auf, geht zugleich ein Signal an den Google-Server. Die Schrift wird geliefert, zusammen mit den Inhalten deiner Website. Der Browser setzt beides zusammen.

Mit diesem Prozess verlangsamt sich die Ladegeschwindigkeit deiner Website und außerdem ist Google im Spiel. Damit entsteht ein Konflikt mit der DSGVO, der Datenschutzgrundverordnung.

Ein Ausweg besteht darin, die verwendeten Google-Schriftarten herunterzuladen und fest in deinem System zu installieren. Wenn dein Besucher deine Seite lädt, ist Google nicht mehr involviert.

Du weißt, ich bin keine Rechtsanwältin. Wende dich für verbindliche Informationen bitte an Experten, wie eRecht24.

Vorsicht, Fehler!

Verwende nie mehr als drei Schrifttypen pro Website

Auch wenn die Möglichkeiten vielfältig und fantastisch sind: Weniger ist mehr. Viele Websites kommen mit zwei Schriftarten aus.

Zeilenumbrüche

Unpassende Zeilenumbrüche können das Gesamtbild sehr beeinträchtigen. Ich hatte Probleme, bis der Techniker meines Vertrauens folgenden Code ins CSS schrieb:

body {
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto;
}

Seither werden automatische Silbentrennungen erzeugt. Zumindest ich sehe das so und auf den meisten Geräten sollte es ebenso sein. Es gibt jedoch keine absolute Sicherheit. Wenn du mehr über Zeilenumbrüche lesen möchtest, schaue hier nach: Silbentrennung im Browser mit CSS, HTML oder JavaScript

Ich finde: Die Auswahl deiner Schriftart ist ein spannendes Thema und Mittel der Gestaltung. Wenn du tiefer einsteigen möchtest, lies bei CANVA weiter: Your ultimate guide to understanding typography