Zum Inhalt
← Rezepte
Alle Rezepte

Kanzlei & Beratung: Haltung und Klarheit

Kanzlei / Steuerberatung / Wirtschaftsprüfung / Unternehmensberatung

Eine ruhige Text-Serif für Überschriften, eine sachliche Grotesk für alles andere, ein tiefer Markenton (Nachtblau oder Aubergine) auf warmen Grautönen. Inhalte statt Bildwelten: Rechtsgebiete, Köpfe, Mandate, Insights. Bewegung bleibt kurz und funktional (125–330 ms), nichts zählt hoch, nichts schwebt.

Bauplan tokens.css Alle Techniken

Schrift

Haltung und Klarheit

Eine ruhige Text-Serif für Überschriften, eine sachliche Grotesk für alles andere, ein tiefer Markenton (Nachtblau oder Aubergine) auf warmen Grautönen.

Headline
Newsreader
Text
Schibsted Grotesk

Farbe

  • #F9F8F8
  • #EFEBEB
  • #1E1E50
  • #212529
  • #8E7C6D
  • #00BEE6
  • #7C6C5E

Bewegung

cubic-bezier(0.25, 1, 0.5, 1)
Dauer
125 (Farbe, Unterstreichung), 250 (Dropdown, Akkordeon), 330 (Mega-Menü, Drawer), 500 (Bild-Einblendung)

Aufbau der Seite

SignaturEchte Initialen mit initial-letter

HeroEditorial-/Magazin-Layout · Magazin-Cover als Hero

  1. Rechtsgebiete / Leistungen / Branchen (je Leistung eine Unterseite, Antwort zuerst)Akkordeon mit Höhenanimation auf auto · LeistungslisteLeistungsseite: Antwort zuerst · Praxis
  2. Köpfe / Team (filterbar nach Fachgebiet, Standort)Team-/Über-mich-Layout mit Porträt-Interaktion · RasterFacettenfilter mit Ergebnisliste · Filterleiste
  3. Ausgewählte Mandate / Recent workEditorial-/Magazin-Layout · Zeitung
  4. Insights / News / Studien (Long-Reads mit einer echten Initiale)Editorial-/Magazin-Layout · MagazinEchte Initialen mit initial-letter
  5. Zahlen & Fakten (Standorte, Berufsträger, Gründung)Zahlen-/Fakten-Sektion als Typo-Ereignis · Ruhige Tabelle
  6. Auszeichnungen / RankingsLogo-Wand / Social-Proof-Band · Auszeichnungen
  7. KarriereStellenliste mit Kurzbewerbung · Viele Stellen
  8. Erstgespräch / Kontakt (Formular, Rückruf, Mandantenportal-Link)Kontakt- und Anfrageformular als eigene SektionFehlerzusammenfassung im Formular · Kompakt über dem KnopfValidierung erst nach Interaktion
  9. Standorte / Anfahrt (Adresse als Text, Karte per 2-Klick, „Termin nach Vereinbarung · Telefon erreichbar“; Standortliste nur ab zwei Büros)Karte per 2-Klick (Anfahrt ohne vorab geladene Karte) · KartenbildÖffnungszeiten mit Live-Status · Termin

Nicht verwenden

Regeln
  • Hero ohne Stockfoto: ein Satz Positionierung in der Serif + aktuelle Insights/Studie als Einstieg (Noerr, Oppenhoff), alternativ ein echtes Teamfoto.
  • Navigation nach Mandantenfrage: Leistungen/Rechtsgebiete, Branchen, Köpfe, Insights, Karriere, Kontakt; Mega-Menü ab 3 Bereichen mit je 5+ Einträgen.
  • Serif ausschließlich für Überschriften und Zitate; alles Funktionale in der Grotesk mit 400/500.
  • Jede Person mit Foto im einheitlichen Licht, Funktion, Fachgebiet, Sprachen, direktem Kontakt (Telefon/E-Mail als Link).
  • Mandate und Insights mit Datum und Rubrik (Tabellenziffern), nicht als anonyme Kacheln.
  • Ein Markenton + warme Graus; der helle Akzent nur für Links, Fokus und aktive Filter.
  • Bei Steuerberatung zusätzlich: Mandantenportal/Upload-Link im Header, Fristen-Hinweise als Akkordeon.
  • Footer mit allen Standorten (Adresse, Telefon), Impressum mit Kammer- und Berufsrechtsangaben.
  • Erstgespräch als eigene Sektion vor dem Footer: kurzes Formular (Anliegen, Rechtsgebiet, Rückruf-Zeitfenster), Telefon, Mandantenportal-Link; Validierung erst nach Interaktion.
  • Initiale (initial-letter) höchstens einmal pro Insight-Artikel, nie in Teasern oder Listen.
  • Pflichtangaben und Recht (Leitfaden 8a): Impressum mit Kammer, gesetzlicher Berufsbezeichnung und Staat der Verleihung, berufsrechtlichen Regelungen und Berufshaftpflichtversicherung; Mandate nur mit Einwilligung der Mandanten (Verschwiegenheit); keine Erfolgsversprechen; Rankings mit Jahr und Quelle; Kontaktformular mit Hinweis, dass noch kein Mandat entsteht – vom Kunden prüfen lassen.
Bild und Ton
  • Licht: Porträts in einheitlichem, weichem Licht vor demselben Hintergrund.
  • Ausschnitt: Brustbild auf Augenhöhe; Räume der Kanzlei nur als ruhige Totale.
  • Personen: Ja: nur echte Partner:innen und Team, mit Funktion und Sprachen.
  • Formate: 4:5, 3:2
  • Nicht: Keine Skyline, kein Handschlag, keine Justitia, keine Paragraphen- oder Waagen-Symbole, keine Stock-Meetings.
  • Anrede: Sie
  • Sätze: Präzise und vollständig, Fachbegriff erklärt, keine Floskeln. Insights mit Datum und Rubrik.
  • Haltung: Souverän und sachlich, auf Augenhöhe mit der Mandantin.
  • Tonproben: Wir beraten Familienunternehmen bei Nachfolge und Verkauf., Neue Regeln zur Grundsteuer: was Eigentümer jetzt prüfen sollten.
  • Nicht schreiben: „Ihr kompetenter Partner in allen Rechtsfragen“, „maßgeschneiderte Lösungen“, „Wir kämpfen für Ihr Recht!“.
Hero, Raum und Form
  • Hero-Raster: 12 Spalten: Positionierungssatz in der Serif über Spalte 1 bis 7, aktuelle Insight als Cover über 8 bis 12 (editorial-magazin-layout, Variante cover).
  • Hero-Bild: Kein Stockfoto; Cover der aktuellen Insight 4:5 oder echtes Teamfoto 3:2.
  • Überschrift: clamp(2rem, 1.3rem + 2.6vw, 3.5rem), Newsreader 400, oben links.
  • Handlung: „Erstgespräch vereinbaren“ (Markenton, eckig) und Telefon als Textlink.
  • Zusatz: Rubrik und Datum der Insight in Tabellenziffern über dem Cover; bei Steuerberatung Mandantenportal im Kopf.
  • Sektionsabstand: clamp(72px, 9vw, 136px)
  • Dichte: mittel
  • Raum: Geordnet und ruhig: Insights und Köpfe in festen Rastern mit 32 px Abstand, Fließtext auf 65ch.
  • Spalten: 12
  • Maximale Breite: 1280px
  • Raster: Hero 7/5 (Satz links, Insight rechts). Köpfe als 4er-Raster mit einheitlichem Porträt 4:5, Insights als Liste mit Datum und Rubrik.
  • Radius klein: 0
  • Radius groß: 0
  • Schatten: keiner
  • Form: Keine Rundung, keine Schatten, kein Glas. Haupthandlung als Textlink mit Pfeil (pfeil-icon-button, Variante linie), Formularknöpfe eckig im Markenton.
Vorbilder