Responsive Design
Responsive Design bedeutet, dass eine Webseite ihre Inhalte selbst nach der verfügbaren Bildschirmbreite anordnet. Auf dem Handy stehen sie untereinander, auf dem großen Bildschirm nebeneinander. Es bleibt dabei eine einzige Seite mit denselben Texten und Bildern, nur anders gestapelt, und nicht etwa eine zweite Fassung fürs Handy.
Was das genau bedeutet
Ein Kioskbetreiber legt jeden Morgen dieselbe Ware aus. Bei trockenem Wetter stellt er draußen drei Tische nebeneinander: Zeitungen links, Getränke in der Mitte, Süßigkeiten rechts, alles auf einen Blick. Zieht Regen auf, räumt er nach drinnen. Dort ist es schmal, also steht dasselbe Sortiment übereinander in einem Regal, Zeitungen auf Augenhöhe, Getränke ganz unten. Derselbe Kiosk, dieselbe Ware, nur anders gestapelt.
So verhält sich eine Seite, die responsiv gebaut ist. Und daraus folgt die eigentliche Entscheidung, die Sie treffen müssen: Was steht oben, wenn nur noch eine Spalte übrig bleibt? Der Kioskbetreiber setzt die Zeitungen auf Augenhöhe, weil sie am häufigsten gekauft werden. Auf der Seite eines Elektrobetriebs sind das Ort und Telefonnummer, nicht das Firmenjubiläum.
Technisch steckt dahinter eine Regel in der Gestaltungsdatei, die ab einer bestimmten Fensterbreite ein anderes Aussehen anwendet. Zwei Dinge sind es ausdrücklich nicht: eine zweite, abgespeckte Adresse nur für Handys, wie sie vor Jahren üblich war, und ein bloßes Verkleinern der ganzen Seite, bei dem man hineinzoomen muss, um überhaupt lesen zu können.
Warum das für Ihr Unternehmen zählt
Bei den meisten regionalen Betrieben kommt die Mehrheit der Besucher mit dem Handy, oft unterwegs und mit einer konkreten Absicht: anrufen, Adresse suchen, kurz prüfen, ob Sie das überhaupt machen. Eine Seite, auf der man dafür erst zoomen und schieben muss, wirkt in diesem Moment wie ein Laden mit klemmender Tür.
Dazu kommt die Bewertung durch Google. Beurteilt wird vorrangig die Fassung, die ein Handy zu sehen bekommt. Was dort fehlt, weil es „für den kleinen Bildschirm zu viel" war, fehlt damit auch für die Suche. Wie das zusammenhängt, steht ausführlich im Beitrag zur Mobile-First-Indexierung.
Der dritte Grund ist schlicht Aufwand. Eine Seite statt zwei heißt: Sie ändern den Preis einmal, nicht zweimal. Wo es zwei Fassungen gibt, veraltet erfahrungsgemäß immer die, die der Chef selbst nie ansieht.
So gehen Sie vor
- Rufen Sie Ihre Seite auf dem eigenen Handy auf, draußen. Nicht im Bürorechner, nicht im WLAN der Werkstatt. Unterwegs im Mobilfunknetz sehen Sie dieselbe Seite, die Ihre Kundschaft sieht, samt Wartezeit.
- Machen Sie den Daumentest. Kommen Sie mit einer Hand überall hin, ohne zu zoomen? Öffnet ein Tipp auf die Telefonnummer den Anruf? Sind die Felder im Kontaktformular groß genug für einen Daumen? Notieren Sie jede Stelle, an der Sie das Gerät drehen oder zwei Finger brauchen.
- Legen Sie die Reihenfolge fest. Schreiben Sie auf, welche drei Dinge auf dem Handy zuerst kommen sollen, bevor irgendjemand scrollt. Meistens: was Sie machen, wo Sie sitzen, wie man Sie erreicht. Diese Reihenfolge ist Ihre Entscheidung, keine technische Frage.
- Achten Sie auf alles, was seitlich hinausragt. Breite Preistabellen, große Fotos und lange Wörter wie „Elektroinstallationsarbeiten" schieben die Seite auf. Wenn Sie am Handy seitwärts wischen können, ist das der Beleg. Die Ursache zu finden, ist Sache Ihrer Webbetreuung. Melden Sie einfach Gerät und Seite.
- Vergleichen Sie beide Ansichten Wort für Wort. Gehen Sie eine wichtige Unterseite am Rechner und am Handy parallel durch. Fehlt am Handy ein Absatz, ein Zertifikat oder eine Leistung, ist er ausgeblendet worden. Genau das gehört zurück auf die Seite.
Typische Fehler
Vier Sätze, die wir beim Thema Handyansicht besonders oft hören.
Meine Kundschaft ruft doch sowieso an, warum ist das Handy so wichtig?
Weil der Anruf am Handy beginnt. Jemand sucht unterwegs, landet auf Ihrer Seite und tippt auf die Nummer. Steht sie erst nach viermal Scrollen, klein und nicht anklickbar, ruft die Person beim Nächsten an.
Reicht es nicht, wenn man am Handy hineinzoomen kann?
Technisch geht es, praktisch macht es kaum jemand. Zoomen heißt, den Ausschnitt ständig hin und her zu schieben, um eine Zeile zu Ende zu lesen. Nach wenigen Sekunden ist die Person weg, und für Google gilt eine solche Seite als nicht für Handys geeignet.
Brauche ich eine eigene Handy-Seite oder sogar eine App?
Für einen regionalen Betrieb praktisch nie. Eine zweite Adresse nur fürs Handy gilt heute als überholt und verdoppelt Ihre Pflege. Eine App müsste jemand erst herunterladen, und das tut für einen Malerbetrieb niemand. Eine mitwachsende Seite deckt beides ab.
Auf meinem Handy sieht alles gut aus, dann passt es doch?
Ihr Gerät ist eine Stichprobe, keine Prüfung. Die Breiten reichen von sehr schmalen Geräten bis zu Tablets im Querformat, und viele Menschen haben in den Einstellungen eine größere Schrift gewählt. Prüfen Sie deshalb auf mindestens zwei fremden Geräten, gern auf einem älteren.
Verwandte Begriffe
Wie wir damit umgehen
Wir prüfen jede Seite bei 360 Pixel Breite, dem schmalsten Maß, das im Alltag noch vorkommt, und zusätzlich mit vergrößerter Systemschrift. Wenn dabei irgendwo seitlich gescrollt werden kann, gilt die Seite als nicht fertig. Schriftgrößen und Abstände fürs Handy liegen bei uns außerdem an einer zentralen Stelle, nicht in jeder einzelnen Datei. Das entscheidet darüber, ob die Seite nach zwei Jahren Pflege noch überall gleich aussieht.
Wie sieht Ihre Seite in einer Hand aus?
Der kostenlose Sichtbarkeits-Check prüft Ihre Seite technisch und inhaltlich, von der Ladezeit bis zu den Überschriften. Auf unserer Webdesign-Seite steht daneben, wie wir eine Seite von der schmalsten Ansicht aus aufbauen.