Responsive Webdesign Agentur: 15 von 71 Firmenseiten sperren das Zoomen

1. Einführung: Was eine responsive Webdesign Agentur wirklich liefert

Wir haben im August 71 Startseiten sächsischer Unternehmen gemessen. Fast alle waren technisch responsive, doch auf 15 dieser Seiten ließ sich am Smartphone nicht mehr zoomen, weil der Zoom im Quellcode abgeschaltet war, und zwar durch einen einzigen Eintrag im viewport-Tag. Wer eine Lesebrille braucht, kommt dort nicht weiter. Genau an dieser Stelle trennt sich eine gute responsive Webdesign Agentur vom Anbieter, der nur ein Häkchen setzt.

Auf einen Blick

• In Deutschland liegt der Anteil mobiler Seitenaufrufe bei 49,41 Prozent, Desktop bei 48,97 Prozent, Tablets bei 1,61 Prozent (StatCounter Global Stats, Juli 2026).
• Google bewertet Websites nach der mobilen Version und empfiehlt responsives Webdesign als einfachste Konfiguration (Google Search Central).
• Die Richtlinie WCAG 2.2 verlangt, dass Inhalte bei einer Breite von 320 CSS-Pixeln ohne Scrollen in zwei Richtungen nutzbar bleiben (W3C).
• 15 von 71 geprüften Firmen-Startseiten unterbinden das Zoomen, 24 von 71 liefern keine responsiven Bilder (Kreativschock-Stichprobe, August 2026).

Eine responsive Webdesign Agentur ist ein Dienstleister, der Websites so konzipiert, gestaltet und programmiert, dass sich Layout, Schrift und Bilder automatisch an jede Bildschirmgröße anpassen. Statt getrennter Versionen für Desktop und Mobilgeräte entsteht ein einziger HTML-Code mit flexiblem Raster, Media Queries und responsiven Bildern, den Suchmaschinen wie Google einmal crawlen und bewerten.

Für kleine und mittlere Unternehmen ist das keine Design-Frage, sondern eine Frage der Erreichbarkeit. Wer heute eine neue Homepage erstellen lassen möchte, bekommt Responsivität von jedem seriösen Anbieter zugesagt. Interessant wird erst, was darunter verstanden wird. Die technischen Grundlagen dazu haben wir in einem eigenen Beitrag zu Mobile First in der Praxis aufgeschrieben; hier geht es um die Auswahl und die Zusammenarbeit.

2. Warum responsive Webdesign über Ihre Sichtbarkeit mitentscheidet

Die meisten Agenturseiten behaupten, über die Hälfte des Traffics komme vom Handy. Für Deutschland stimmt das so nicht ganz. Laut StatCounter Global Stats teilten sich mobile Geräte und Desktop den deutschen Markt im Juli mit 49,41 zu 48,97 Prozent fast exakt auf.

Das ist die eigentlich unbequeme Zahl. Sie bedeutet, dass Sie sich weder eine schwache mobile Ansicht noch eine vernachlässigte Desktop-Ansicht leisten können, und genau dafür gibt es responsive Websites statt zweier separat gepflegter Auftritte.

Bei der Bewertung durch Suchmaschinen ist die Lage dagegen eindeutig. Google schreibt in seiner Dokumentation: „Google verwendet für die Indexierung und das Ranking die mobile Version des Website-Inhalts, der mit dem Smartphone-Agent gecrawlt wurde.“ Und weiter: „Google empfiehlt responsives Webdesign, weil dieser Ansatz am einfachsten zu implementieren und zu verwalten ist“ (Google Search Central).

Kurz zusammengefasst: Was Ihre Besucher auf dem Handy sehen, ist auch die Version, nach der Ihre Platzierung bei Google entsteht. Eine schwache mobile Nutzererfahrung kostet damit doppelt, an der Verweildauer und an den Rankings. Wie sich die mobile Ansicht messbar verbessern lässt, zeigt unser Beitrag zur mobilen Optimierung im Detail.

3. Vorteile von Responsive Webdesign und was eine Agentur dafür leistet

Ein fließendes Layout verhält sich wie Sekt im Kelch und im Wasserglas: Die Menge bleibt gleich, die Form ändert sich. Technisch steckt dahinter ein Raster in Prozentwerten, dazu Media Queries für die Sprünge und flexible Bilder. Das ist der Kern. Wenig spektakulär.

Der Aufwand einer Agentur liegt in dem, was danach kommt. Diese Leistungen gehören aus unserer Sicht in ein belastbares Angebot:

• Konzeption vor Gestaltung: Inhalte, Struktur und Prioritäten werden zuerst festgelegt, und das Layout entsteht erst danach: zunächst für die kleinste Bildschirmgröße, anschließend für Tablet und Desktop mit mehr Platz.
• Webdesign und Webentwicklung aus einer Hand: Ein Designer, der die Grenzen im Frontend kennt, entwirft anders, denn sonst entstehen Entwürfe, die sich nur auf einem 27-Zoll-Monitor ausgehen und auf dem Handy zerfallen.
• Responsive Bilder: Für jede Auflösung wird die passende Datei ausgeliefert, nicht ein Desktop-Bild für alle Endgeräte.
• Performance: Ladezeit ist auf Mobilgeräten Teil des Designs. In unseren Projekten erreichen wir regelmäßig PageSpeed-Werte von 90 und mehr, vor allem durch Bildkomprimierung, Caching und das Entfernen überflüssiger Skripte.
• CMS-Anbindung: Der Content muss sich pflegen lassen, ohne das Layout zu zerlegen. Bei größeren Datenmengen kommen Schnittstellen zu PIM oder CRM hinzu.
• Suchmaschinenoptimierung von Anfang an: Eine Adresse, ein HTML-Code, konsistente Inhalte auf allen Geräten. Das ist der stille SEO-Vorteil gegenüber getrennten Auftritten.

Zur Abgrenzung: Adaptive Design arbeitet mit festen Layouts für einige Gerätegrößen, responsive Design passt sich stufenlos an. Eine Progressive Web App (PWA) ist noch etwas anderes, nämlich eine Website, die sich wie eine App verhält, inklusive Installation auf dem Startbildschirm und Funktionen, die auch ohne Verbindung nutzbar bleiben. Für die meisten Firmenseiten ist der responsive Weg der flexible und effiziente. Was oben zuerst sichtbar wird, entscheidet dann über den ersten Eindruck; dazu passt unser Beitrag zum Bereich above the fold.

4. Fünf Prüfpunkte für die Auswahl Ihrer Agentur

Diese fünf Punkte lassen sich im Erstgespräch abfragen, ohne dass Sie selbst programmieren können, und sie trennen Anbieter, die Responsivität verstanden haben, von solchen, die nur ein Theme installiert haben.

1. Stufenlos oder drei Größen? Fragen Sie, an welchen Bildschirmbreiten das Layout umbricht. Eine gute Antwort nennt Inhalte als Auslöser für Breakpoints, keine Gerätenamen.
2. Bleibt der Zoom frei? Ein gesperrter Zoom ist eine festgeschweißte Sitzhöhe im Auto: Für den Entwickler passt sie, für alle anderen nicht, und die Antwort muss lauten, dass der Benutzer auf jedem Endgerät vergrößern darf.
3. Wie werden Bilder ausgeliefert? Ein 3.000 Pixel breites Foto auf ein Handy zu schicken, ist wie eine Europalette durch eine Wohnungstür zu tragen. Gefragt sind mehrere Größen pro Bild und moderne Formate. Details dazu in unserem Beitrag über Bilder fürs Web optimieren.
4. Wird auf echten Geräten getestet? Der Browser-Simulator zeigt kein Touch-Verhalten, keine Adressleiste, keine echte Verbindung. Eine Referenz auf dem eigenen Smartphone öffnen ist der schnellste Test.
5. Wer prüft die Responsivität nach dem Livegang? Diese Frage bleibt in Angeboten meist unbeantwortet. Sie ist die wichtigste.

Der W3C-Standard liefert für Punkt eins und zwei einen prüfbaren Maßstab. In WCAG 2.2 heißt es zum Erfolgskriterium 1.4.10 Reflow: „Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for: Vertical scrolling content at a width equivalent to 320 CSS pixels“ (Inhalte müssen ohne Verlust an Information oder Funktion und ohne Scrollen in zwei Richtungen darstellbar sein, bei vertikal scrollenden Inhalten auf einer Breite von 320 CSS-Pixeln). Kriterium 1.4.4 ergänzt, dass Text ohne Hilfsmittel auf 200 Prozent vergrößerbar bleiben muss (W3C, WCAG 2.2).

Damit haben Sie zwei Zahlen an der Hand: 320 Pixel Breite und 200 Prozent Zoom. Das ist deutlich belastbarer als der Satz „sieht auf dem Handy gut aus“.

5. Unsere Position: Responsivität endet nicht mit dem Livegang

Die Ratgeber der Branche behandeln Responsivität als Liefergegenstand. Sie wird gebaut, abgenommen, abgehakt. Unsere Position ist eine andere: Responsivität ist ein Betriebszustand, der sich mit jedem neuen Inhalt verändern kann, mit jeder Tabelle, jedem Bild und jedem eingebetteten Formular.

Für diesen Beitrag haben wir im August 2026 die Startseiten von 118 Mitgliedsorganisationen des Unternehmerverbands Sachsen abgerufen, die dort mit eigener Adresse verzeichnet sind. Nach Abzug von Web-, Medien- und Marketingbetrieben, Banken, Versicherern, Konzernmarken und leeren Domains blieben 71 auswertbare Startseiten. Gemessen wurde ausschließlich im Quellcode der Startseite, ausgewertet wird aggregiert und ohne Nennung einzelner Sites, damit an dieser Stelle keine einzelne fremde Website erkennbar oder bloßgestellt wird.

• 68 von 71 Startseiten setzen das viewport-Meta-Tag korrekt auf die Gerätebreite. Die technische Grundlage ist also Standard.
• 15 von 71 schalten den Zoom ab oder begrenzen ihn auf die Ausgangsgröße. Das steht im Konflikt mit WCAG 1.4.4.
• 24 von 71 liefern auf der Startseite keine responsiven Bilder aus, sondern eine Datei für jeden Bildschirm.
• Mindestens einen dieser Befunde tragen 18 von 71 Seiten.

Die Zahlen zeigen ein Muster. Das Häkchen „responsive“ ist gesetzt, die Qualität dahinter schwankt. Und die drei häufigsten Ursachen entstehen nicht beim Bau, sondern im Betrieb: eine breite Tabelle im Redaktionssystem, ein hochgeladenes Originalfoto, ein eingebettetes Formular von einem Fremdanbieter.

Ethan Marcotte, der den Begriff geprägt hat, formulierte es so: „Rather than tailoring disconnected designs to each of an ever-increasing number of web devices, we can treat them as facets of the same experience“ (Statt für eine immer größere Zahl von Geräten voneinander getrennte Entwürfe zuzuschneiden, können wir sie als Facetten derselben Erfahrung behandeln), nachzulesen bei A List Apart. Eine Facette lässt sich beschädigen, ohne dass die anderen es zeigen. Deshalb gehört die Prüfung der mobilen Ansicht in die laufende WordPress-Wartung, nicht nur ins Abnahmeprotokoll.

6. So läuft die Zusammenarbeit Schritt für Schritt

Ein Website-Projekt ist planbar. Sechs Schritte, ein Termin für den Livegang.

1. Erstgespräch: Ziele, Zielgruppen und Budget werden geklärt. Wir beraten hier bewusst offen, auch wenn ein kleinerer Umfang für Sie sinnvoller ist.
2. Konzeption: Seitenstruktur, Inhalte und Funktionsumfang werden festgeschrieben. Aus dieser Liste entsteht der Festpreis.
3. Entwurf ab der kleinsten Breite: Sie sehen zuerst die Handy-Ansicht. Was dort nicht gebraucht wird, kommt auch auf dem Desktop nicht dazu.
4. Programmierung: Umsetzung im Frontend, Anbindung an das CMS, saubere Übergabepunkte für Redakteure. Eine dezente Animation darf sein, wenn sie die Bedienung stützt.
5. Test und Abnahme: Prüfung auf echten Endgeräten, bei 320 Pixeln Breite und mit 200 Prozent Zoom. Erst dann gilt die Seite als funktional.
6. Livegang und Pflege: Updates, Backups und ein kurzer Blick auf die mobile Ansicht gehören danach zum laufenden Betrieb.

Ein Relaunch folgt derselben Reihenfolge, nur mit einem zusätzlichen Schritt davor: der Bestandsaufnahme, welche Inhalte bleiben, welche zusammengefasst werden und welche ersatzlos entfallen. Wer hier großzügig streicht, spart doppelt, beim Aufwand und bei der Ladezeit. Für Betriebe in der Region ist professionelles Webdesign mit persönlichem Ansprechpartner erfahrungsgemäß der kürzere Weg als eine anonyme Ticket-Hotline.

7. Häufige Fehler und wie Sie sie vermeiden

Diese sechs Fehler sehen wir in unseren Projekten am häufigsten, wenn wir bestehende Seiten übernehmen.

• Desktop-Entwurf zuerst: Das Layout wird für den großen Bildschirm gebaut und danach gestaucht. Wichtige Inhalte landen dabei ganz unten.
• Nur drei Breakpoints: Handy, Tablet, Desktop. Zwischen 500 und 760 Pixeln bricht dann gern etwas, weil dort niemand hingesehen hat.
• Zoom gesperrt: Häufig ein Erbstück aus älteren Themes. Ein Eintrag im viewport-Tag genügt, um es zu beheben.
• Originalbilder im Redaktionssystem: Das Bild wird angezeigt, aber in voller Größe geladen. Auf dem Mobilfunknetz merkt man das sofort.
• Tabellen und Einbettungen ohne Überlauf-Regel: Preislisten und Kartendienste sprengen das Raster, sobald das Fenster schmal wird.
• Abnahme nur am Monitor: Die Seite wird im Büro freigegeben und nie im Bus geöffnet.

Der Gegentest ist einfach und dauert zwei Minuten. Öffnen Sie Ihre Startseite auf dem eigenen Smartphone, ziehen Sie die Schrift mit zwei Fingern größer und drehen Sie das Gerät ins Querformat. Was jetzt verrutscht, verrutscht auch bei Ihren Kunden.

8. Fazit

Responsives Webdesign ist keine Auszeichnung mehr, sondern die Eintrittskarte. 68 von 71 geprüften Seiten haben sie. Der Unterschied entsteht in den Details, die niemand im Angebot nachliest: freier Zoom, passende Bildgrößen, Test bei 320 Pixeln, ein Blick auf die mobile Ansicht nach jedem Redaktionsschritt.

Fragen Sie eine Agentur also nicht, ob sie responsive arbeitet. Fragen Sie, woran sie es misst.

Das Ziel ist ein sehr konkretes Bild: Sie halten Ihr Handy in der Hand, ziehen die Schrift mit zwei Fingern größer, drehen das Gerät ins Querformat. Die Zeilen bleiben lesbar, die Preisliste bleibt im Raster, der Anfragen-Button sitzt unter dem Daumen. Nichts springt, nichts muss zur Seite geschoben werden. Diese Ruhe ist der eigentliche Gegenwert einer guten Umsetzung.

9. Anhang: Checkliste für das Agenturgespräch

• Woran orientieren sich Ihre Breakpoints, an Inhalten oder an Gerätenamen?
• Bleibt der Zoom auf allen Seiten frei nutzbar?
• Wie viele Bildgrößen werden pro Motiv erzeugt, und in welchem Format?
• Auf welchen echten Geräten wird vor der Abnahme getestet?
• Wird die Darstellung bei 320 Pixeln Breite und 200 Prozent Zoom geprüft?
• Wer prüft die mobile Ansicht nach dem Livegang, und in welchem Rhythmus?
• Darf ich eine Referenz nennen und selbst auf meinem Gerät öffnen?
• Ist der Preis ein Festpreis, und was ist beim laufenden Betrieb enthalten?

Kontakt aufnehmen

Sie möchten Ihre Website responsive umsetzen oder eine bestehende Seite prüfen lassen? Schreiben Sie uns, wir melden uns innerhalb von 24 Stunden:

Disclaimer: Alle genannten Zeitangaben, Messwerte und Marktbewertungen sind Erfahrungswerte aus der Agentur-Praxis beziehungsweise Momentaufnahmen der jeweils genannten Quelle. Sie können je nach Region, Anbieter und Projektumfang abweichen. Angaben zu Barrierefreiheits-Anforderungen ersetzen keine fachjuristische Beratung.