Webdesign Agenturen Schweiz Vergleich 2026
Das sind die besten 61 Anbieter.

Markus Seyfferth Michael Dobler
Markus Seyfferth
& Michael Dobler
8 Min. Lesezeit
4,7 (128) Bewerten
Alle Angaben verifiziert Monatlich aktualisiert Von Fachredakteuren kuratiert Fokus DACH-Markt
Hellblaue Papierblume mit mehreren Blütenblättern, Schnur und Anhänger mit Text "Markenfarbe gefunden"

Der erste Eindruck einer Website entsteht in Sekunden. Farben, Schriften, Bilder und eine klare Nutzerführung entscheiden, ob Besucher bleiben und Kontakt aufnehmen. Wir haben 61 Webdesign-Agenturen und Design-Studios mit Sitz oder Standort in der Schweiz geprüft. Die Auswahl reicht von kleinen Studios mit eigener Handschrift über Branding- und UX-Agenturen bis zu regionalen Partnern für KMU. Anbieterneutral zeigen wir, wie Sie Portfolios lesen, den Gestaltungsprozess bewerten und typische Fehler bei Nutzungsrechten oder Barrierefreiheit vermeiden.


Webdesign Agenturen Schweiz: Empfohlene Anbieter

TEIL

Kreativagentur in Zürich Seit 2005 am Markt Branding und Webdesign

TEIL ist eine Kreativagentur in Zürich mit den Schwerpunkten Branding, Webdesign und Kampagnen. Das Angebot umfasst digitale Strategie, UX/UI-Design, Websites und Plattformen sowie Content-Struktur und Suchmaschinenoptimierung.

TEIL Screenshot teil.ch

TEIL ist eine Marke der Teil.ch GmbH mit Sitz an der Aemtlerstrasse in Zürich und seit 2005 am Markt. Die Geschäftsleitung besteht aus Alain und Martin Zeiter.

Die Kreativagentur verbindet Strategie, Design und Technologie. Zum Bereich digitale Erlebnisse gehören digitale Strategie und Konzeption, UX/UI-Design und Webdesign, Websites und Plattformen sowie Content-Struktur und Suchmaschinenoptimierung bis zum Betrieb. Zu den Branchen zählen unter anderem Gesundheitswesen, Treuhand und Versicherungen sowie Sport und Events.

Der Weg zum Projekt führt über die Projektanfrage und ein Erstgespräch. Die Agentur ist auch telefonisch erreichbar.

Das spricht für TEIL
UX/UI und Webdesign
Gestaltung digitaler Erlebnisse.
Digitale Strategie
Konzeption vor der Umsetzung.
Plattformen
Websites und Plattformen aus einer Agentur.
Content und SEO
Content-Struktur und Suchmaschinenoptimierung.
Branding
Markenauftritt und Kampagnen.
Erstgespräch
Einstieg über Projektanfrage und Gespräch.

Sind Sie selbst Anbieter? Jetzt empfohlener Anbieter werden

Diesen Vergleich teilen

Was macht eine Webdesign-Agentur?

Hellblaue Papierblume mit mehreren Blütenblättern, Schnur und Anhänger mit Text "Markenfarbe gefunden"
Farben, Schriften und Nutzerführung: Eine Webdesign-Agentur übersetzt Ihre Marke ins Web.

Eine Webdesign-Agentur übersetzt Ihre Marke in eine gut bedienbare Website. Im Zentrum stehen Nutzerführung, Layout, Typografie, Bildsprache und ein Designsystem, das im CMS weiterlebt.

Webdesign ist mehr als Dekoration. Die Agentur klärt zuerst, wer Ihre Website besucht und welche Aufgabe diese Menschen erledigen wollen. Aus diesen Erkenntnissen entstehen Wireframes, ein klickbarer Prototyp und schliesslich das Screendesign für Smartphone, Tablet und Desktop.

Worin liegt der Unterschied zur klassischen Webagentur? Eine Webagentur betreut häufig das ganze Paket bis zu Hosting und Wartung. Webdesign-Agenturen und Design-Studios setzen den Schwerpunkt auf Gestaltung, UX/UI und Corporate Design. Für die technische Umsetzung nutzen diese Agenturen oft WordPress, Webflow, Craft, Kirby oder TYPO3, teils mit Partnern.

Ein Freelancer kann für ein kleines Redesign genügen. Ein Baukasten liefert schnelle Ergebnisse, bleibt aber an Vorlagen gebunden. Sobald Marke, Mehrsprachigkeit und Barrierefreiheit zusammenkommen, spielt ein spezialisiertes Team seine Stärken aus.

Treffen vier oder mehr der sechs Punkte zu, spricht viel für eine Webdesign-Agentur. Für einen einfachen Onepager mit fertigem Corporate Design reicht oft eine sorgfältige Template-Anpassung.

Der 6-Punkte-Test: Brauchen Sie eine Webdesign-Agentur?
  • Austauschbarer Auftritt: Ihre Website sieht aus wie viele andere und zeigt nicht, wofür Ihre Marke steht.
  • Neues Corporate Design: Logo, Farben oder Schriften haben sich geändert und brauchen eine Übersetzung ins Web.
  • Schwache Mobilansicht: Auf dem Smartphone wirken Texte gedrängt, Schaltflächen zu klein und Menüs umständlich.
  • Wenige Anfragen: Besucher kommen zwar, finden aber nicht zum Kontaktformular oder zur Buchung.
  • Wachsende Website: Neue Seiten entstehen laufend und brauchen einheitliche Bausteine statt Einzellösungen.
  • Zugänglichkeit gefragt: Kontraste, Schriftgrössen und Tastaturbedienung sollen den WCAG entsprechen.

Treffen vier oder mehr Punkte zu, lohnt sich eine spezialisierte Webdesign-Agentur oder ein Design-Studio. Bei einem einfachen Onepager mit fertigem Corporate Design reicht oft ein gutes Template mit sorgfältiger Anpassung.

6 Probleme, die schwaches Webdesign verursacht

Hellblaues Kofferanhänger mit braunem Lederriemen und Metallschnalle mit braunem Etikett
Veraltete Gestaltung und eine schwache Mobilansicht schrecken Besucher ab, bevor sie Ihr Angebot kennen.

Schwaches Webdesign kostet Vertrauen und Anfragen. Typisch sind ein veraltetes Erscheinungsbild, eine unbrauchbare Mobilansicht, eine zerrissene Marke, versteckte Kontaktwege, fehlende Barrierefreiheit und ein austauschbares Template.

Besucher beurteilen eine Website zuerst nach dem Aussehen und erst danach nach dem Inhalt. Wirkt der Auftritt veraltet oder unruhig, überträgt sich dieser Eindruck auf Ihr Angebot. Auf dem Smartphone verschärft sich das Problem, weil jeder Fehltipp Geduld kostet.

Barrierefreiheit gehört zu gutem Design und ist kein Zusatz. Ausreichende Kontraste, lesbare Schriftgrössen und sichtbare Fokuszustände helfen Menschen mit Seh- oder motorischen Einschränkungen. Von klarer Gestaltung profitieren zudem alle anderen Besucher, etwa bei Sonnenlicht auf dem Handy. Die WCAG des W3C liefern die Messlatte.

Veraltetes Erscheinungsbild

Bildsprache, Schriften und Layout stammen aus einer anderen Zeit. Besucher zweifeln an der Aktualität Ihres Angebots.

Mobil kaum bedienbar

Winzige Links, verrutschte Spalten und lange Ladezeiten vertreiben Besucher auf dem Smartphone.

Marke wirkt zerrissen

Website, Prospekt und Social Media nutzen unterschiedliche Farben und Schriften. Die Wiedererkennung leidet.

Kein Weg zur Anfrage

Handlungsaufforderungen gehen im Layout unter. Interessierte springen ab, bevor sie Kontakt aufnehmen.

Menschen ausgeschlossen

Schwache Kontraste, fehlende Alternativtexte und kleine Schriften sperren Menschen mit Einschränkungen aus.

Austauschbares Template

Ein Standard-Theme ohne Anpassung sieht aus wie bei der Konkurrenz und erzählt nichts über Ihr Unternehmen.

Design-Studio, UX-Agentur oder Full-Service: die Arten von Webdesign-Agenturen

Hellblauer Stern mit Pinsel-Symbol und Etikett "Handschrift" auf weißem Hintergrund
Vom kleinen Design-Studio bis zur Full-Service-Agentur: Jede Form setzt eigene Schwerpunkte.

Sechs Typen prägen den Markt: Design-Studios, Branding- und Webagenturen, UX/UI-Agenturen, Webflow- und No-Code-Studios, regionale Webdesign-Agenturen für KMU und Full-Service-Webagenturen. Die Unterschiede liegen in Handschrift, Prozess und technischer Tiefe.

Design-Studios arbeiten oft mit wenigen Köpfen und einer starken visuellen Sprache. Branding- und Webagenturen entwickeln Logo, Corporate Design und Website gemeinsam, was bei einem kompletten Markenauftritt Brüche vermeidet. UX/UI-Agenturen legen den Fokus auf Forschung, Prototypen und Tests.

Webflow-Studios gestalten visuell und schalten Änderungen ohne lange Entwicklungszyklen auf. Regionale Agenturen in Zürich, Bern, Basel, Luzern oder Lausanne begleiten KMU persönlich. Full-Service-Agenturen liefern Design zusammen mit Technik und Betrieb. Die Gegenüberstellung zeigt, wann sich eine Agentur gegenüber einem Baukasten lohnt.

Design-Studio

Kleine Teams mit starker Handschrift für Gestaltung, Typografie und digitale Markenauftritte.

Branding- und Webagentur

Entwickelt Corporate Design und Website in einem Zug, vom Logo bis zum Designsystem.

UX/UI-Agentur

Nutzerforschung, Prototypen und Tests stehen im Zentrum, oft für Portale und komplexe Websites.

Webflow- und No-Code-Studio

Visuelle Umsetzung ohne klassische Programmierung, schnelle Iterationen und einfache Pflege.

Regionale Webdesign-Agentur

Betreut KMU in der Region persönlich, meist mit WordPress oder einem anderen verbreiteten CMS.

Full-Service-Webagentur

Gestaltung, Entwicklung, Hosting und Wartung unter einem Dach, Design als ein Baustein unter vielen.

Webdesign-Agentur
Individuelle Gestaltung auf Basis Ihrer Marke und Ziele
  • Eigenes Layout statt Vorlage
  • UX-Konzept und Prototyp vor der Umsetzung
  • Designsystem für spätere Erweiterungen
  • Höherer Aufwand und längere Projektdauer
Website-Baukasten
Vorlagen im Abo, Gestaltung in Eigenregie
  • Schneller Start ohne Fachwissen
  • Geringe Anfangskosten
  • Wiedererkennbare Vorlagen, wenig Spielraum
  • Bindung an die Plattform des Anbieters

Whitepaper
Webdesign Agenturen Schweiz
2026
Ratgeber für Entscheider
Kostenloser Download

Whitepaper:
Webdesign Agenturen Schweiz 2026

Der Leitfaden für Marketing und Geschäftsleitung: Designbriefing, Portfolio-Check und Agenturwahl. Ausserdem Abnahme von Prototyp und Designsystem, Barrierefreiheit nach WCAG, Nutzungsrechte an Schriften und Bildern sowie Kostentreiber in der Schweiz, mit Checkliste für die Übergabe.

Webdesign Schweiz Webdesign-Agentur UX/UI Designsystem Barrierefreiheit
PDF · 24 Seiten · Kostenlos · Versand per E-Mail
Präsentiert von

Nach Ihrer Bestätigung per E-Mail gelangen Sie direkt zum Download. Datenschutzerklärung

So wählen Sie die passende Webdesign-Agentur aus

Blaue Schablone mit Lineal und ausgestanzten Formen, daneben Notiz "Passt genau" mit Häkchen
Portfolio, Prozess und Pflegbarkeit im CMS zeigen, ob eine Webdesign-Agentur zu Ihrem Projekt passt.

Beginnen Sie mit Portfolio und Gestaltungsprozess, prüfen Sie danach CMS-Kompetenz und Pflegbarkeit. Ebenso zählen Barrierefreiheit, mobile Performance, Datenschutz, Mehrsprachigkeit und klar geregelte Nutzungsrechte.

Ein schönes Portfolio sagt noch wenig über den Weg dorthin. Fragen Sie im Erstgespräch, wie die Agentur Zielgruppen erforscht, wie viele Entwürfe sie liefert und wer Feedback einholt. Agenturen mit klarem Prozess zeigen Wireframes und Prototypen aus früheren Projekten.

Achten Sie auf das, was nach dem Start passiert. Ihr Team muss neue Seiten im CMS anlegen können, ohne das Design zu zerstören. Vereinbaren Sie die Herausgabe der Designdateien und klären Sie Lizenzen für Schriften sowie Bilder. Acht Kriterien helfen beim Vergleich der Offerten.

Portfolio und Handschrift
Passt der Stil zu Ihrer Marke?

Jede Agentur hat eine erkennbare Gestaltungslinie. Prüfen Sie, ob die Arbeiten vielseitig sind oder alle gleich aussehen. Fragen Sie nach Ergebnissen hinter den schönen Bildern, etwa mehr Anfragen oder kürzere Wege.

Arbeiten aus verschiedenen BranchenLive-Websites statt nur MockupsNachweisbare ErgebnisseStil passt zu Ihrer Zielgruppe
Praxistipp: Öffnen Sie drei Referenzen auf dem Smartphone und testen Sie Menü, Formular und Ladezeit selbst.
UX-Prozess und Prototyp
Gestaltet die Agentur auf Basis von Erkenntnissen?

Gutes Webdesign beginnt mit Fragen zu Zielgruppen und Aufgaben, nicht mit Farben. Achten Sie auf Workshops, Wireframes, einen klickbaren Prototyp und Tests mit echten Nutzern.

Zielgruppen- und AufgabenanalyseWireframes vor dem ScreendesignKlickbarer Prototyp, etwa in FigmaTests mit Nutzern eingeplant
Praxistipp: Bitten Sie um ein anonymisiertes Beispiel aus einem früheren Prototyp samt Testergebnissen.
CMS und Pflegbarkeit
Können Sie das Design selbst weiterführen?

Das schönste Layout nützt wenig, wenn Ihr Team neue Seiten nicht sauber anlegen kann. Fragen Sie, wie das Design als Bausteine in WordPress, Webflow, Craft, Kirby oder TYPO3 landet.

Begründete CMS-WahlGestaltete InhaltsbausteineSchulung für Ihr RedaktionsteamDokumentation der Komponenten
Praxistipp: Lassen Sie sich im Testsystem zeigen, wie Sie selbst eine neue Seite aus den Bausteinen zusammensetzen.
Barrierefreiheit nach WCAG
Denkt die Agentur Zugänglichkeit mit?

Kontraste, Schriftgrössen, Fokuszustände und Alternativtexte gehören in den Entwurf. Gute Agenturen prüfen ihre Gestaltung gegen die WCAG 2.1 oder 2.2 und kennen den Standard eCH-0059.

Kontraste im Entwurf geprüftTastaturbedienung berücksichtigtZielstufe AA vereinbartPrüfung vor dem Go-live
Praxistipp: Schreiben Sie die gewünschte WCAG-Stufe ausdrücklich ins Briefing und in die Offerte.
Mobile und Performance
Wie schnell und handlich ist das Ergebnis?

Grosse Bilder, Animationen und viele Schriftschnitte bremsen die Seite. Eine erfahrene Agentur gestaltet für das Smartphone zuerst und hält Ladezeit sowie Core Web Vitals im Blick.

Mobile-First-EntwürfeOptimierte BildformateWenige SchriftschnitteLadezeit als Abnahmekriterium
Praxistipp: Vereinbaren Sie messbare Zielwerte für Ladezeit und Core Web Vitals in der Abnahme.
Datenschutz nach revDSG
Kommen eingebundene Dienste sauber daher?

Eingebettete Schriften, Videos, Karten und Analysewerkzeuge übertragen oft Daten an Dritte. Die Agentur sollte lokale Einbindung bevorzugen und Ihre Datenschutzerklärung mit den nötigen Angaben versorgen.

Schriften lokal eingebundenDrittdienste aufgelistetEinwilligung bei Bedarf gestaltetHinweise des EDÖB berücksichtigt
Praxistipp: Verlangen Sie eine Liste aller externen Dienste, die das Design lädt.
Mehrsprachigkeit
Hält das Layout drei Landessprachen aus?

Französische und italienische Texte laufen oft länger als deutsche. Schaltflächen, Menüs und Überschriften müssen diese Längen aufnehmen, ohne das Gestaltungsraster zu sprengen.

Entwürfe mit echten Übersetzungen getestetFlexible KomponentenSprachwechsel gut sichtbarBildtexte je Sprache gepflegt
Praxistipp: Lassen Sie die Startseite im Prototyp mit der längsten Sprachversion befüllen.
Offerte und Nutzungsrechte
Was gehört Ihnen nach dem Projekt?

Die Offerte sollte Anzahl Entwürfe, Korrekturschlaufen und Leistungen klar nennen. Ebenso wichtig sind Rechte an Gestaltung, Designdateien, Schriften und Bildern.

Korrekturschlaufen begrenzt und benanntHerausgabe der DesigndateienLizenzen für Schriften und BilderNutzungsrechte schriftlich geregelt
Praxistipp: Klären Sie, ob Sie die Figma-Dateien nach Projektende erhalten und frei weiterverwenden dürfen.
5 Fragen, 2 Minuten

Welches Webdesign-Studio passt zu Ihrer Marke?

Fünf kurze Fragen zu Marke, Gestaltung und Pflege. Ihre persönliche Übersicht kommt per E-Mail. Unser Vergleich: Wir gleichen Ihre Antworten mit allen 61 recherchierten Anbietern ab, nicht nur mit den empfohlenen Anbietern.

Frage 1 von 5
Was soll das neue Webdesign leisten?
Der Schwerpunkt entscheidet, ob ein Design-Studio, eine UX-Agentur oder eine Full-Service-Agentur besser passt.
Neuer Markenauftritt
Die Website soll Corporate Design und Haltung sichtbar machen.
Mehr Anfragen
Klare Nutzerführung soll Besucher zu Kontakt oder Kauf bringen.
Frischer Look
Das bestehende Erscheinungsbild wirkt veraltet und braucht ein Redesign.
Bessere Bedienbarkeit
Navigation, Formulare und Mobilansicht sollen einfacher werden.
Frage 2 von 5
Wie weit ist Ihr Corporate Design?
Ohne Logo, Farben und Schriften beginnt das Projekt mit einer Branding-Phase.
Komplett vorhanden
Logo, Farben, Schriften und Bildsprache sind definiert.
Teilweise vorhanden
Ein Logo existiert, Regeln für das Web fehlen noch.
Neu zu entwickeln
Marke und Website entstehen gemeinsam.
Unsicher
Sie möchten den Stand mit der Agentur prüfen.
Frage 3 von 5
Wer pflegt die Inhalte später?
Das Redaktionsteam bestimmt, wie flexibel Designsystem und CMS sein müssen.
Unser Marketing
Mehrere Personen bearbeiten regelmässig Seiten und Beiträge.
Eine Person nebenbei
Gelegentliche Anpassungen ohne Fachkenntnisse.
Die Agentur
Änderungen laufen über ein Kontingent oder Abo.
Noch offen
Sie wollen die Varianten erst vergleichen.
Frage 4 von 5
Welche Plattform bevorzugen Sie?
Gute Agenturen begründen die Wahl des CMS und richten sich nicht nur nach eigenen Vorlieben.
WordPress
Weit verbreitet, viele Fachleute für die Betreuung.
Webflow
Visuelle Umsetzung mit gehostetem System.
Craft, Kirby oder TYPO3
Flexible Inhaltsmodelle für anspruchsvolle Auftritte.
Keine Präferenz
Die Agentur soll eine Empfehlung abgeben.
Frage 5 von 5
Wie wichtig ist Barrierefreiheit für Ihr Projekt?
Zugängliches Webdesign plant Kontraste, Schriftgrössen und Tastaturbedienung von Beginn an ein.
Pflicht
Öffentliche Stelle oder klare Vorgabe nach WCAG.
Sehr wichtig
Sie möchten möglichst viele Menschen erreichen.
Grundniveau
Saubere Kontraste und lesbare Schriften genügen vorerst.
Noch kein Thema
Sie wünschen dazu eine Beratung.
Fast geschafft
Wohin dürfen wir Ihre Übersicht senden?

Sagen Sie uns, wohin wir Ihre persönliche Empfehlung schicken dürfen. Sie kommt in wenigen Minuten per E-Mail.

Vielen Dank, {vorname}

Ihre persönliche Empfehlung ist unterwegs und kommt in wenigen Minuten per E-Mail. Bitte prüfen Sie auch Ihren Spam-Ordner.

Vom Moodboard zum Go-live: der Ablauf eines Webdesign-Projekts

Wegweiser mit sechs gelben Schildern, die Orte und Entfernungen in Stunden anzeigen, montiert auf hellblauem Holzpfosten
Sechs Etappen führen vom Designbriefing über Prototyp und Designsystem bis zur Aufschaltung.

Ein Webdesign-Projekt durchläuft sechs Phasen: Designbriefing, Analyse und Moodboard, Wireframes und Prototyp, Screendesign und Designsystem, Umsetzung mit Content sowie Test und Go-live. Freigaben auf Ihrer Seite bestimmen das Tempo.

Die frühen Phasen sparen später Geld. Ein Wireframe lässt sich in Minuten ändern, eine fertig umgesetzte Seite nicht. Testen Sie den Prototyp deshalb mit einigen Personen aus Ihrer Zielgruppe, bevor die Agentur Farben und Bilder ausarbeitet.

Im Screendesign entsteht das Designsystem mit Komponenten, Farben und Typografie. Anschliessend übernimmt das CMS die Bausteine. Vor dem Go-live prüfen Sie Darstellung, Kontraste, Tastaturbedienung und Ladezeit auf echten Geräten. Eine kurze Schulung macht Ihr Redaktionsteam startklar.

Start

Designbriefing

Sie beschreiben Marke, Ziele, Zielgruppen, vorhandenes Corporate Design und Wunschtermin. Beispiele von Websites, die Ihnen gefallen oder missfallen, schärfen das Bild.

Ziele und Zielgruppen festhaltenCorporate Design bereitstellenPositive und negative Beispiele sammeln
1
Einige Wochen

Analyse und Moodboard

Die Agentur untersucht Mitbewerber und Nutzerbedürfnisse. Ein Moodboard legt die visuelle Richtung fest.

Workshop besuchenMoodboard freigebenInhaltsstruktur abstimmen
2
Einige Wochen

Wireframes und Prototyp

Skizzen zeigen Aufbau und Nutzerführung. Ein klickbarer Prototyp macht Abläufe testbar, bevor Gestaltungsdetails entstehen.

Nutzerwege prüfenPrototyp testenInhalte priorisieren
3
Einige Wochen

Screendesign und Designsystem

Farben, Typografie, Bildsprache und Komponenten nehmen Gestalt an. Das Designsystem hält alle Bausteine fest.

Entwürfe für Mobile und Desktop abnehmenKontraste prüfenKomponenten dokumentieren
4
Mehrere Wochen

Umsetzung und Content

Das Design wandert ins CMS. Parallel entstehen Texte, Bilder und Übersetzungen, die das Layout aufnehmen muss.

Inhalte liefernBildrechte klärenZwischenstände im Testsystem prüfen
5
Vor dem Start

Test und Go-live

Sie prüfen Darstellung auf allen Geräten, Barrierefreiheit, Ladezeit und Formulare. Nach der Abnahme schaltet die Agentur die Website auf.

Gerätetests durchführenWCAG-Prüfung abschliessenRedaktionsteam schulen
6
4,5:1
Mindestkontrast für normalen Text nach WCAG-Stufe AA
6
Phasen vom Designbriefing bis zum Go-live
2
Korrekturschlaufen je Entwurf gelten als gängige Vereinbarung
3
Portfolios sollten Sie mindestens vergleichen

Typische Fehler in Webdesign-Projekten

Weiße Schüssel mit cremefarbener Substanz, blauem Pinsel und Schild "Runde 14"
Endlose Feedbackrunden, fehlende Lizenzen und Gestaltung ohne Inhalt bremsen viele Webdesign-Projekte.

Viele Projekte stolpern über dieselben Punkte: Gestaltung vor Inhalt, Entscheide nach Geschmack, fehlendes Mobile First, ungeklärte Lizenzen, vergessene Barrierefreiheit, kein Designsystem und endlose Feedbackschlaufen.

Die teuersten Fehler entstehen früh. Ein Entwurf mit Blindtext sieht im Meeting überzeugend aus und scheitert an den echten Überschriften. Ein Gremium mit zehn Meinungen verwässert jedes klare Konzept.

Nutzungsrechte bleiben oft bis zur ersten Abmahnung unbeachtet. Webschriften brauchen eigene Lizenzen, Bilddatenbanken regeln Verwendung und Dauer. Für Angebote des Bundes verlangen das Behindertengleichstellungsgesetz (BehiG) und eCH-0059 barrierefreie Gestaltung. Private Unternehmen orientieren sich an den WCAG 2.1 oder 2.2.

1
Design vor Inhalt

Das Layout steht, doch die echten Texte passen nicht hinein. Platzhalter verdecken das Problem bis kurz vor dem Start.

Erarbeiten Sie Kernbotschaften und Seiteninhalte vor dem Screendesign. Testen Sie Entwürfe mit echten Texten.
2
Nur nach Geschmack entschieden

Die Geschäftsleitung wählt den Entwurf, der ihr persönlich gefällt. Die Bedürfnisse der Zielgruppe bleiben aussen vor.

Bewerten Sie Entwürfe anhand von Zielen, Nutzertests und Ihrem Corporate Design.
3
Kein Mobile First

Die Gestaltung entsteht für grosse Bildschirme und wird nachträglich zusammengestaucht. Mobil wirkt alles gedrängt.

Verlangen Sie Entwürfe zuerst für das Smartphone und nehmen Sie mobile Ansichten gesondert ab.
4
Rechte an Schriften und Bildern ungeklärt

Desktop-Lizenzen oder Bilder ohne Nutzungsrecht landen auf der Website. Abmahnungen und Nachlizenzierungen kosten Geld.

Lassen Sie alle Schrift- und Bildlizenzen in der Offerte aufführen, ausgestellt auf Ihr Unternehmen.
5
Barrierefreiheit vergessen

Helle Grautöne und dünne Schriften sehen elegant aus, sind aber schwer lesbar. Nachbesserungen greifen tief ins Design ein.

Legen Sie die WCAG-Stufe im Briefing fest und lassen Sie Kontraste schon im Entwurf prüfen.
6
Kein Designsystem

Jede neue Seite entsteht als Einzelstück. Nach einem Jahr wirkt die Website wie ein Flickenteppich.

Bestellen Sie ein Designsystem oder einen Styleguide mit dokumentierten Komponenten als festen Projektbestandteil.
7
Zu viele Feedbackschlaufen

Immer neue Personen geben Rückmeldungen. Entwürfe drehen sich im Kreis, Budget und Termine geraten ins Rutschen.

Bestimmen Sie ein kleines Entscheidungsgremium und bündeln Sie Feedback je Runde in einem Dokument.

Was kostet Webdesign in der Schweiz?

Blauer Farbeimerdeckel mit rotem Kreuz und "ZWEITER ANSTRICH EXTRA €" Text, daneben Pinsel mit blauem Griff
Seitentypen, Designsystem, Sprachen und Lizenzen bestimmen die Kosten eines Webdesign-Projekts.

Der Preis hängt von der Zahl der Seitentypen, Entwürfen und Korrekturschlaufen, vom UX-Aufwand, vom Designsystem und von den Sprachen ab. Eine Template-Anpassung liegt am unteren Ende, eine Corporate Website mit Designsystem deutlich höher.

Die grössten Kostentreiber sind individuelle Layouts für viele Seitentypen, Nutzertests und ein dokumentiertes Designsystem. Jede weitere Sprache verlangt Anpassungen an Texten und Layout. Branding von Grund auf erhöht den Aufwand zusätzlich. Seriöse Agenturen nennen einen Preis erst nach einem Briefing.

Rechnen Sie über mehrere Jahre. Lizenzen für Schriften und Bilder, Hosting, Pflege und die Weiterentwicklung des Designs kommen zur Projektsumme hinzu. Achten Sie in der Offerte auf CHF-Preise, die Mehrwertsteuer und die Anzahl inklusive Korrekturschlaufen.

Template-Anpassung oder Onepager überschaubar Pauschale je Projekt

Ein bestehendes Theme erhält Ihre Farben, Schriften und Bilder. Geeignet für einen kompakten Auftritt mit fertigem Corporate Design.

Individuelles Webdesign für KMU mittel nach Seitentypen und Entwürfen

Eigenes Layout auf Basis Ihrer Marke, Wireframes, Screendesign und Umsetzung im CMS. Anzahl Seitentypen und Korrekturschlaufen bestimmen den Aufwand.

Corporate Website mit Designsystem hoch nach Komponenten und Sprachen

UX-Research, Prototyp mit Tests, dokumentiertes Designsystem und mehrsprachige Umsetzung. Lohnt sich für wachsende Auftritte mit grossem Redaktionsteam.

Redesign oder UX-Optimierung auf Offerte nach Analyse und Umfang

Überarbeitung einzelner Bereiche, neue Nutzerführung oder Auffrischung des Erscheinungsbilds. Die Agentur kalkuliert auf Basis einer Analyse des Bestands.

Gestaltung kostet auch nach dem Go-live

Planen Sie Lizenzen für Schriften und Bilder, die Pflege der Inhalte, Hosting und die Weiterentwicklung des Designsystems über mehrere Jahre ein. Manche Schriftlizenzen richten sich nach Seitenaufrufen und steigen mit Ihrem Erfolg.

Der Dr.-Web-Quizmaster
Wissenstest
Wie sicher sind Sie bei Webdesign-Fragen?
5 Fragen aus dem Artikel. Wählen Sie Ihre Antwort, dann decken Sie die Lösung auf.
1 Welches Kontrastverhältnis verlangen die WCAG auf Stufe AA mindestens für normalen Fliesstext? Aufklappen ↓
Auflösung aufdecken ↓
Richtig: A. Für normalen Text fordern die WCAG auf Stufe AA ein Kontrastverhältnis von mindestens 4,5 zu 1. Grosse Schrift kommt mit 3 zu 1 aus.
2 Was bedeutet Mobile First im Webdesign? Aufklappen ↓
Auflösung aufdecken ↓
Richtig: A. Mobile First heisst: Inhalte und Layout entstehen zuerst für das Smartphone. Grössere Ansichten ergänzen das Grundgerüst schrittweise.
3 Dürfen Sie eine gekaufte Desktop-Schriftlizenz automatisch auf Ihrer Website einbinden? Aufklappen ↓
Auflösung aufdecken ↓
Richtig: A. Viele Schriftanbieter unterscheiden zwischen Desktop-, Web- und App-Lizenzen. Prüfen Sie die Lizenzbedingungen, bevor die Agentur eine Schrift auf der Website einsetzt.
4 Was ist ein Designsystem? Aufklappen ↓
Auflösung aufdecken ↓
Richtig: A. Ein Designsystem bündelt Gestaltungsregeln und Bausteine wie Buttons, Karten oder Formulare. Neue Seiten bleiben so einheitlich, auch Jahre nach dem Start.
5 Wozu dient ein Wireframe? Aufklappen ↓
Auflösung aufdecken ↓
Richtig: A. Ein Wireframe zeigt als Skizze, wo Navigation, Inhalte und Handlungsaufforderungen stehen. Farben und Bilder folgen erst im Screendesign.

Glossar: Webdesign-Begriffe verständlich erklärt

Von Moodboard bis Designsystem: Die zentralen Begriffe aus Gestaltung, Nutzerführung und Barrierefreiheit, anbieterneutral und kurz erklärt.

Moodboard

Ein Moodboard sammelt Farben, Schriften, Bildbeispiele und Stimmungen für die visuelle Richtung. Mit dem Moodboard stimmen Sie die visuelle Wirkung ab, bevor die eigentliche Gestaltung beginnt.

Wireframe

Ein Wireframe ist eine schlichte Skizze einer Seite. Sichtbar sind nur Aufbau, Inhaltsbereiche und Navigation, noch ohne Farben und Bilder.

Klickbarer Prototyp

Der Prototyp verbindet Entwürfe zu einem bedienbaren Modell, häufig in Figma. Sie testen Abläufe mit echten Nutzern, bevor die Umsetzung im CMS beginnt.

Screendesign

Das Screendesign ist der fertig gestaltete Entwurf einer Seite mit Farben, Typografie, Bildern und Schaltflächen. Auf dieser Vorlage baut die Umsetzung auf.

Designsystem

Ein Designsystem enthält wiederverwendbare Komponenten samt Regeln für Farben, Schriften, Abstände und Zustände. Website und weitere Kanäle bleiben so einheitlich.

Styleguide

Der Styleguide dokumentiert, wie Logo, Farben, Typografie und Bildsprache eingesetzt werden. Er ist oft Teil eines Designsystems oder des Corporate Designs.

Corporate Design

Das Corporate Design umfasst das gesamte visuelle Erscheinungsbild eines Unternehmens, vom Logo bis zur Geschäftskarte. Im Web übersetzt die Agentur diese Regeln in digitale Bausteine.

UX-Design

UX-Design kümmert sich um das gesamte Nutzungserlebnis: Verständlichkeit, Orientierung und Wege zum Ziel. Grundlage sind Recherche, Tests und Daten.

UI-Design

UI-Design gestaltet die sichtbare Oberfläche, also Schaltflächen, Formulare, Menüs und Symbole. Gutes UI-Design macht Funktionen auf einen Blick erkennbar.

Mobile First

Bei Mobile First entsteht die Gestaltung zuerst für das Smartphone. Tablet- und Desktop-Ansichten bauen auf diesem Grundgerüst auf.

Typografie

Typografie regelt Schriftwahl, Grössen, Zeilenabstände und Hierarchien. Gute Typografie verbessert Lesbarkeit und prägt die Wiedererkennung einer Marke.

Schriftlizenz

Die Schriftlizenz legt fest, wo Sie eine Schrift nutzen dürfen. Für Websites braucht die Schrift meist eine eigene Weblizenz, abhängig von Aufrufen oder Domains.

Kontrastverhältnis

Das Kontrastverhältnis misst den Helligkeitsunterschied zwischen Text und Hintergrund. Die WCAG verlangen auf Stufe AA für normalen Text mindestens 4,5 zu 1.

WCAG und eCH-0059

Die WCAG des W3C sind die anerkannte Referenz für zugängliche Webinhalte. Der Schweizer Standard eCH-0059 baut darauf auf und gilt für Angebote der Bundesverwaltung.

Call to Action

Ein Call to Action ist eine klare Handlungsaufforderung, etwa eine Schaltfläche für Anfrage oder Termin. Platzierung und Gestaltung beeinflussen die Conversion-Rate direkt.

Häufige Fragen

Antworten auf die häufigsten Fragen rund um Webdesign-Agenturen in der Schweiz, kurz und anbieterneutral.

Was kostet eine Webdesign-Agentur in der Schweiz?

Die Kosten reichen von der günstigen Template-Anpassung bis zur Corporate Website mit Designsystem und hängen von Seitentypen, Entwürfen, Sprachen sowie UX-Aufwand ab. Einen verbindlichen Preis nennt die Agentur nach einem Briefing in der Offerte. Planen Sie Lizenzen, Pflege und Weiterentwicklung als laufende Kosten ein.

Wie lange dauert ein neues Webdesign?

Ein Onepager auf Basis einer Vorlage steht oft nach wenigen Wochen. Ein individuelles Webdesign mit Prototyp und Designsystem braucht mehrere Monate. Das Tempo hängt stark von Ihren Freigaben ab. Fehlende Texte und lange Feedbackrunden verzögern Projekte häufiger als die Gestaltung selbst.

Was ist der Unterschied zwischen Webdesign und Webentwicklung?

Webdesign gestaltet Aufbau, Aussehen und Nutzerführung einer Website. Die Webentwicklung setzt diese Gestaltung technisch um. Zum Webdesign gehören Wireframes, Prototyp, Typografie und Designsystem. Die Entwicklung kümmert sich um CMS, Funktionen, Schnittstellen und Performance.

Webdesign-Agentur oder Baukasten?

Ein Baukasten reicht für einfache Auftritte mit kleinem Budget. Eine Webdesign-Agentur lohnt sich für eine eigenständige Marke, gezielte Nutzerführung und wachsende Websites. Baukästen arbeiten mit Vorlagen und binden Sie an die Plattform. Eine Agentur entwickelt ein individuelles Layout samt Designsystem.

Gehören mir die Designdateien nach dem Projekt?

Nur sofern der Vertrag das festhält. Regeln Sie deshalb Herausgabe und Nutzungsrechte an Entwürfen sowie Designdateien ausdrücklich. Gemeint sind etwa Figma-Dateien, Grafiken und Symbole. Klären Sie zusätzlich die Lizenzen für Schriften und Bilder, damit diese auf Ihr Unternehmen laufen.

Muss eine neue Website barrierefrei gestaltet sein?

Für Angebote des Bundes ja. Für private Unternehmen in der Schweiz besteht bislang keine allgemeine Pflicht. Massgeblich für den Bund sind das Behindertengleichstellungsgesetz und der Standard eCH-0059, beide gestützt auf die WCAG des W3C. Auch privat lohnt sich zugängliches Design, weil Sie mehr Menschen erreichen.

Welches CMS eignet sich für individuelles Webdesign?

WordPress, Webflow, Craft, Kirby und TYPO3 setzen individuelles Webdesign gut um. Die Wahl hängt von Redaktionsteam, Sprachen und Funktionen ab. Webflow eignet sich für visuelle Pflege, Craft und Kirby für flexible Inhaltsmodelle. Lassen Sie sich die Empfehlung der Agentur begründen.

Was sollte ein Designbriefing enthalten?

Ein Designbriefing nennt Ziele, Zielgruppen, vorhandenes Corporate Design, Inhalte, Sprachen, Termin und Budgetrahmen. Beispiele von Websites, die Ihnen gefallen oder missfallen, helfen der Agentur zusätzlich. Halten Sie auch Anforderungen an Barrierefreiheit und die gewünschte Plattform fest.

4,7 128 Bewertungen

Wie hat Ihnen dieser Artikel gefallen?

Michael Dobler & Markus Seyfferth
Autoren
Michael Dobler und Markus Seyfferth bilden das Autorenduo hinter den Vergleichen von Dr. Web. Anbietervergleiche sind ihre Spezialität und entstehen grundsätzlich gemeinsam: Praxiswissen aus über drei Jahrzehnten Web trifft auf den strategischen Rundum-Blick eines Chefredakteurs, damit Entscheider ohne Umwege die beste Wahl für ihr Business treffen.
133 Vergleiche veröffentlicht
Alle Artikel

Schreiben Sie einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Newsletter

Mehr solcher Vergleiche?
Jetzt kostenlos abonnieren.

Jeden Dienstag die besten Artikel aus dem Dr. Web-Magazin direkt in Ihr Postfach – kein Spam, jederzeit abmeldbar.

Einmal pro Woche, kein täglicher Spam
Jederzeit mit einem Klick abmeldbar
DSGVO-konform via Brevo