15 Webdesign-Tipps für KMU: Was wirklich zählt
Die meisten KMU-Websites haben nicht zu wenig Design — sie haben die falschen Prioritäten. Ein Handwerker braucht keine Parallax-Animationen. Eine Praxis braucht kein Bento-Grid. Was beide brauchen: eine Website, die schnell lädt, auf dem Smartphone funktioniert und Besucher zu Kunden macht.
Zusammenfassung: 15 Webdesign-Tipps fuer KMU in 6 Bereichen: Navigation (max. 7 Menuepunkte), Content (H1 mit Keyword), Performance (Lighthouse 90+), Mobile (Touch-Targets 44px), Conversion (CTA above the fold, Telefonnummer sichtbar) und Barrierefreiheit (WCAG 2.1 AA). Basierend auf ueber 50 KMU-Projekten seit 2019.
Inhaltsverzeichnis
- Navigation (Tipps 1-3)
- Content (Tipps 4-6)
- Performance (Tipps 7-9)
- Mobile (Tipps 10-11)
- Conversion (Tipps 12-14)
- Barrierefreiheit (Tipp 15)
- FAQ Diese 15 Tipps basieren auf über 50 Website-Projekten, die wir seit 2019 für KMU umgesetzt haben. Gruppiert nach den sechs Bereichen, die den grössten Unterschied machen.
Navigation (Tipps 1–3)
Tipp 1: Maximal 7 Hauptnavigationspunkte
Die Miller’sche Zahl (7 ± 2) gilt auch für Website-Navigation. Mehr als 7 Punkte überfordern Nutzer. Typische KMU-Struktur:
- Startseite
- Leistungen
- Über uns
- Referenzen
- Blog/Ratgeber
- Kontakt
Unterseiten gehören in Dropdown-Menüs, nicht in die Hauptnavigation.
Tipp 2: CTA-Button in der Navigation
Der wichtigste Call-to-Action gehört in die Hauptnavigation — als visuell hervorgehobener Button. Nicht als normaler Link.
Beispiele:
- Handwerker: “Angebot anfragen”
- Praxis: “Termin buchen”
- Agentur: “Projekt starten”
- SaaS: “Kostenlos testen”
Dieser Button sollte auf jeder Seite sichtbar sein, auch beim Scrollen (Sticky Navigation).
Tipp 3: Breadcrumbs auf Unterseiten
Breadcrumbs zeigen dem Nutzer, wo er sich befindet: Startseite > Leistungen > Webdesign. Sie verbessern:
- Navigation: Nutzer springt direkt zur Kategorie zurück
- SEO: Google zeigt Breadcrumbs in den Suchergebnissen
- Barrierefreiheit: Screenreader nutzen Breadcrumbs zur Orientierung
Auf der Startseite sind Breadcrumbs unnötig. Auf allen anderen Seiten Pflicht.
Content (Tipps 4–6)
Tipp 4: Ein Ziel pro Seite
Jede Seite braucht genau ein primäres Ziel. Nicht zwei, nicht drei. Eins.
| Seite | Primäres Ziel |
|---|---|
| Startseite | Zum Leistungsbereich weiterleiten |
| Leistungsseite | Kontaktanfrage auslösen |
| Über uns | Vertrauen aufbauen |
| Blog-Artikel | Newsletter-Anmeldung oder Kontakt |
| Kontakt | Formular absenden |
Wenn Sie nicht in einem Satz sagen können, was eine Seite bezweckt, hat sie keinen klaren Zweck.
Tipp 5: Above the Fold entscheidet
Der sichtbare Bereich ohne Scrollen (Above the Fold) hat 3 Sekunden, um den Nutzer zu überzeugen. Dort müssen stehen:
- Was Sie tun (Headline)
- Für wen (Subheadline)
- Was als Nächstes passiert (CTA-Button)
Kein Slider. Kein Video. Keine Animation. Eine klare Botschaft.
Schlecht: “Willkommen auf unserer Website” Gut: “Dachdecker in Hamburg. Dachsanierung in 5 Tagen. Kostenlos beraten lassen.”
Tipp 6: Texte für Scanner schreiben
80 % der Nutzer scannen Websites, statt sie zu lesen. Schreiben Sie entsprechend:
- Kurze Absätze (maximal 3–4 Zeilen)
- Aussagekräftige Zwischenüberschriften (H2, H3)
- Fettdruck für Schlüsselbegriffe
- Aufzählungen statt Fliesstexte
- Tabellen für Vergleiche und Daten
Jede Zwischenüberschrift sollte für sich verständlich sein. Wer nur die H2-Headings liest, muss den Kern des Artikels verstehen.
Performance (Tipps 7–9)
Tipp 7: Ladezeit unter 3 Sekunden
53 % der mobilen Nutzer verlassen eine Website, die länger als 3 Sekunden lädt. Für KMU-Websites ist das die wichtigste technische Kennzahl.
Quick Wins für schnellere Websites:
| Massnahme | Effekt | Aufwand |
|---|---|---|
| Bilder in WebP/AVIF konvertieren | -40 % Dateigrösse | Gering |
| Lazy Loading für Bilder | -60 % initiale Ladezeit | Gering |
| CSS/JS minifizieren | -20 % Dateigrösse | Gering |
| CDN verwenden | -50 % Latenz | Mittel |
| Hosting upgraden | -30 % TTFB | Mittel |
| Unused JavaScript entfernen | -30 % JS-Grösse | Hoch |
Tipp 8: Core Web Vitals optimieren
Google verwendet drei Core Web Vitals als Ranking-Signale:
| Metrik | Was sie misst | Zielwert |
|---|---|---|
| LCP (Largest Contentful Paint) | Ladezeit des grössten Elements | < 2.5 Sek. |
| INP (Interaction to Next Paint) | Reaktionszeit auf Klicks | < 200 ms |
| CLS (Cumulative Layout Shift) | Visuelle Stabilität | < 0.1 |
Prüfen Sie Ihre Werte in der Google Search Console oder auf PageSpeed Insights.
Tipp 9: Kein unnötiges JavaScript
Jede KMU-Website, die wir auditieren, hat zu viel JavaScript. Häufige Übeltäter:
- jQuery (63 KB) — 2026 komplett überflüssig, CSS und native JS können alles
- Slider-Libraries (50–150 KB) — für Inhalte, die niemand durchklickt
- Analytics-Overload — Google Analytics + Facebook Pixel + HotJar = 200+ KB
- Chat-Widgets (200–500 KB) — wenn sie niemand nutzt
Faustregel: Unter 100 KB JavaScript für eine KMU-Website. Alles darüber braucht eine Begründung.
Mobile (Tipps 10–11)
Tipp 10: Touch-Targets mindestens 48×48px
Auf Touchscreens brauchen Buttons, Links und interaktive Elemente eine Mindestgrösse von 48×48 Pixel. Das empfehlen Google, Apple und WCAG.
Häufige Verstösse:
- Textlinks im Footer (zu klein, zu eng beieinander)
- Social-Media-Icons (24px, ohne ausreichend Padding)
- Hamburger-Menu-Icon (zu kleiner Tap-Bereich)
- Tabellenzellen mit Links
Tipp 11: Click-to-Call auf Mobilgeräten
Für lokale KMU ist der Telefonanruf oft die wichtigste Conversion. Die Telefonnummer muss auf Mobilgeräten antippbar sein:
<a href="tel:+49123456789">0123 456789</a>Platzierung:
- Im Header (immer sichtbar)
- Im Hero-Bereich
- Im Footer
- Auf der Kontaktseite
Ein Floating-Button (“Jetzt anrufen”) am unteren Bildschirmrand funktioniert ebenfalls gut — aber nur auf Mobile anzeigen.
Conversion (Tipps 12–14)
Tipp 12: Kontaktformular auf maximal 5 Felder
Jedes zusätzliche Formularfeld reduziert die Conversion-Rate um 4–7 %. Für KMU reichen:
- Name
- Telefon (optional)
- Nachricht
- Datenschutz-Checkbox
Alles Weitere klären Sie im Erstgespräch. Kein “Firma”, kein “Betreff”, kein “Wie haben Sie uns gefunden”.
Tipp 13: Social Proof prominent platzieren
Vertrauenssignale gehören auf die Startseite, nicht versteckt auf eine Referenz-Seite:
- Google-Bewertungen mit Sternebewertung (Schema.org)
- Kundenstimmen mit Name und Foto (oder Initialen)
- Zahlen: “Seit 2019 | 50+ Projekte | 4.9 Sterne”
- Logos von Kunden oder Partnern
- Zertifizierungen und Gütesiegel
Reihenfolge nach Wirksamkeit: Google-Bewertungen > Kundenstimmen > Zahlen > Logos
Tipp 14: Mehrere Kontaktwege anbieten
Nicht jeder Nutzer möchte ein Formular ausfüllen. Bieten Sie an:
- Kontaktformular
- Telefon (Click-to-Call)
- E-Mail (Click-to-Mail)
- WhatsApp Business (für passende Branchen)
- Online-Terminbuchung (Calendly, Cal.com)
Je mehr Wege, desto höher die Gesamt-Conversion. Aber: Ein primärer Weg sollte visuell hervorgehoben sein.
Barrierefreiheit (Tipp 15)
Tipp 15: BFSG-konform gestalten
Seit Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz für B2C-Websites. Die Mindestanforderungen:
- Kontraste: 4.5:1 für Fliesstext, 3:1 für grosse Überschriften
- Tastaturbedienbarkeit: Alle Funktionen per Tab, Enter, Escape erreichbar
- Focus-Styles: Sichtbare Fokus-Indikatoren (nicht mit
outline: noneentfernen!) - Alt-Texte: Für jedes informative Bild
- Semantisches HTML:
<nav>,<main>,<article>,<button>statt<div>für alles - Formulare: Jedes Feld hat ein
<label>, Fehlermeldungen sind klar formuliert - Animationen: Respektieren
prefers-reduced-motion
Tipp: Testen Sie Ihre Website einmal komplett nur mit der Tastatur. Wenn Sie irgendwo steckenbleiben, haben Sie ein Problem.
Die 5 häufigsten Webdesign-Fehler bei KMU
- “Willkommen auf unserer Website”-Headline — Sagt nichts. Ersetzen durch: Was Sie tun + für wen + Nutzen.
- Slider auf der Startseite — Weniger als 1 % der Nutzer klicken auf Slide 2. Slider verlangsamen die Seite und verwässern die Botschaft.
- Zu viel Text, zu wenig Struktur — Textwände ohne Zwischenüberschriften, Bilder oder Aufzählungen liest niemand.
- Kein klarer CTA — Wenn der Nutzer nicht weiss, was er tun soll, tut er nichts.
- Stock-Fotos statt echte Bilder — Nutzer erkennen Stock-Fotos sofort. Echte Team- und Projektfotos erzeugen Vertrauen.
Meine Einschätzung als Agenturinhaber: Von allen 15 Tipps ist der CTA above the fold der mit dem groessten sofortigen Impact. Ich habe KMU-Websites gesehen, die ihre Anfragen verdoppelt haben, nur indem sie die Telefonnummer und einen Jetzt-anfragen-Button sichtbar in den Header gepackt haben. Kein Redesign, kein SEO — einfach den Kontaktweg sichtbar machen.
FAQ
Wie viele Seiten braucht eine KMU-Website?
5–12 Seiten reichen für die meisten KMU. Startseite, 2–4 Leistungsseiten, Über uns, Referenzen, Kontakt. Jede Seite braucht echten Content — leere Seiten schaden dem SEO.
Lohnt sich ein Blog für KMU?
Ja, wenn Sie regelmässig (mindestens 2 Artikel/Monat) publizieren. Ein Blog verbessert SEO, baut Vertrauen auf und generiert langfristig organischen Traffic. Ohne regelmässige Pflege bringt ein Blog nichts.
Soll ich WordPress oder einen Baukasten verwenden?
Kommt drauf an. Baukästen (Wix, Squarespace) sind für einfache Websites ohne technische Kenntnisse geeignet. WordPress bietet mehr Flexibilität, braucht aber Wartung. Moderne Frameworks (Astro, Next.js) liefern die beste Performance, erfordern aber Entwickler-Know-how.
→ Webdesign-Tools im Vergleich
Was kostet eine KMU-Website?
Als Festpreis-Projekt: 3.000–12.000 Euro. Als Website-Abo (WaaS): ab 69 Euro/Monat. Die Kosten hängen von Seitenanzahl, Funktionen und Design-Anspruch ab.
→ Was kostet eine professionelle Website 2026?
Verwandte Ratgeber
- Was ist gutes Webdesign?
- Responsives Webdesign: Grundlagen und Best Practices
- 12 Webdesign-Beispiele nach Branche
- Webdesign-Kosten 2026: Was beeinflusst den Preis?
Professionelle Website für Ihr KMU?
Sie möchten eine Website, die nicht nur gut aussieht, sondern Kunden bringt? Wir setzen alle 15 Tipps für Sie um — individuell für Ihre Branche.
Kostenloses Erstgespräch vereinbaren →
Website mieten ab 69 €/Monat →
Über den Autor: Moritz Lehmann ist Geschäftsführer von Adfera (M.Sc. Wirtschaftsinformatik) und hat seit 2019 über 50 Websites für KMU im DACH-Raum designed und entwickelt.
Quellen
- Google: „Web Vitals — Metriken für eine gute Nutzererfahrung” — web.dev/vitals
- Nielsen Norman Group: „How Users Read on the Web” — nngroup.com
- Smashing Magazine: „Web Design for Small Businesses” — smashingmagazine.com