Responsive Design - warum deine Website auf dem Handy funktionieren muss
Nimm dein Handy, öffne deine eigene Website und schau sie dir an. Musst du zoomen, um den Text zu lesen? Rutschen Bilder aus dem Bildschirm? Ist der Button zum Anrufen so klein, dass du dreimal tippen musst? Dann hast du ein Problem. Und zwar ein größeres, als du denkst. Über 60 Prozent aller lokalen Google-Suchen passieren auf dem Smartphone. Wenn jemand unterwegs "Elektriker in meiner Nähe" googelt, macht er das auf dem Handy. Wenn deine Website dort nicht funktioniert, ist der Besucher weg. In unter drei Sekunden.
Was bedeutet responsive Design?
Responsive Design heißt, dass sich eine Website automatisch an die Bildschirmgröße des Geräts anpasst. Auf einem großen Monitor sieht sie anders aus als auf einem Tablet, und auf einem Smartphone wieder anders. Aber auf jedem Gerät bleibt sie benutzbar: lesbarer Text, passende Bilder, anklickbare Buttons.
Das passiert nicht durch Magie, sondern durch die Art, wie die Website programmiert ist. Eine responsive Website erkennt die Bildschirmbreite und ordnet ihre Elemente entsprechend an. Texte werden schmaler, Bilder skalieren mit, Menüs klappen zusammen. Alles automatisch.
Das Gegenteil wäre eine Website, die nur für Desktop gebaut wurde. Auf dem Handy zeigt sie die gleiche Darstellung wie auf einem 24-Zoll-Monitor, nur eben winzig klein. Alles ist da, aber nichts ist bedienbar.
Warum Google responsive Design belohnt
Seit 2019 bewertet Google Websites primär nach ihrer mobilen Version. Das nennt sich Mobile-First-Indexing. Nicht die Desktop-Version entscheidet über dein Ranking, sondern das, was auf dem Handy passiert.
Wenn deine Website auf dem Smartphone schlecht funktioniert, stuft Google sie herunter. Egal wie gut der Inhalt ist, egal wie viele Bewertungen du hast. Eine nicht-responsive Website hat bei lokalen Suchanfragen kaum noch eine Chance auf die erste Seite.
Google misst auch, wie Nutzer mit deiner Seite interagieren. Wenn jemand auf dem Handy deine Website öffnet, nichts findet und nach drei Sekunden wieder abspringt, registriert Google das. Hohe Absprungrate, kurze Verweildauer - beides Signale, die dein Ranking verschlechtern.
Woran du erkennst, dass deine Website nicht responsive ist
Typische Anzeichen einer nicht-responsiven Website:
- Text ist zu klein: Wenn du auf dem Handy zoomen musst, um den Text lesen zu können, ist die Seite nicht responsive.
- Horizontales Scrollen: Wenn du nach links und rechts wischen musst, weil die Seite breiter ist als dein Bildschirm, stimmt etwas nicht.
- Buttons zu klein oder zu nah beieinander: Auf dem Smartphone tippt man mit dem Finger, nicht mit einer Maus. Buttons müssen groß genug sein und genug Abstand zueinander haben.
- Bilder ragen über den Rand: Wenn Fotos oder Grafiken abgeschnitten werden oder den Text überdecken, fehlt die mobile Anpassung.
- Menü nicht bedienbar: Auf dem Desktop funktioniert ein horizontales Menü mit sieben Punkten. Auf dem Handy muss das ein sogenanntes Hamburger-Menü werden - drei Striche, die sich aufklappen.
Google bietet einen kostenlosen Test an: Suche nach "Google Mobile-Friendly Test" und gib deine URL ein. Innerhalb von Sekunden siehst du, ob deine Website den Test besteht.
Was responsive Design für Handwerker besonders wichtig macht
Die typische Situation: Ein Hausbesitzer hat ein verstopftes Rohr. Er steht in der Küche, zieht sein Handy aus der Tasche und googelt "Sanitär-Notdienst Neuruppin". Er klickt auf das erste Ergebnis. Wenn die Website auf dem Handy nicht funktioniert, tippt er auf "Zurück" und nimmt den nächsten Treffer.
Bei einem Notdienst entscheidet das in Sekunden. Aber auch bei geplanten Projekten: Wer abends auf dem Sofa mit dem Handy nach einem Handwerker sucht, hat keine Geduld für eine Website, die nicht passt.
Dazu kommt: Telefonnummern auf einer responsiven Website lassen sich direkt antippen und ein Anruf wird gestartet. Auf einer nicht-responsiven Seite muss der Nutzer die Nummer ablesen und manuell eintippen. Klingt nach Kleinigkeit, ist aber ein Grund, warum Anfragen ausbleiben.
Was responsive Design kostet
Jede professionell entwickelte Website ist heute responsive. Das ist Standard, kein Aufpreis. Wenn dir jemand eine Website ohne responsive Design anbietet, ist das kein Angebot, das ist ein Problem.
Bei älteren Websites, die noch nicht responsive sind, gibt es zwei Optionen: Anpassen oder neu bauen. Das Anpassen einer bestehenden Website kostet je nach Zustand zwischen 500 und 2.000 Euro. Ob sich das lohnt, hängt davon ab, wie alt die Seite ist. Wenn die Website älter als fünf Jahre ist, ist ein Neubau meistens sinnvoller, weil sich in der Zwischenzeit auch bei SEO, Sicherheit und Performance die Standards verschoben haben.
Schnellcheck für deine Website
Nimm dein Handy und beantworte diese fünf Fragen:
- Kann ich den Text lesen, ohne zu zoomen?
- Finde ich die Telefonnummer in unter drei Sekunden?
- Kann ich das Kontaktformular problemlos ausfüllen?
- Laden die Bilder schnell und vollständig?
- Funktioniert das Menü auf Anhieb?
Wenn du bei einer dieser Fragen zögerst, hat deine Website auf dem Handy ein Problem. Und damit bei Google.
Wie geht es weiter?
Wenn deine Website auf dem Smartphone nicht richtig funktioniert, verlierst du Kunden. Das lässt sich messen und das lässt sich beheben. Melde dich und ich schaue mir an, wie deine Website aktuell auf verschiedenen Geräten aussieht. Kostet nichts, bringt Klarheit.