Mobilansicht wird nicht korrekt angezeigt
Deine Website sieht auf dem Desktop toll aus, aber auf dem Smartphone ist alles verschoben, zu groß oder irgendwie komisch? Das ist ein häufiges Problem und meistens schnell gefunden. Hier sind die häufigsten Ursachen und was du dagegen tun kannst.
Zuerst: Browser-Cache leeren
Bevor du auf Fehlersuche gehst, leere einmal den Cache auf deinem Smartphone. Manchmal zeigt der Browser einfach eine veraltete Version deiner Website an.
💡 Hinweis: Wie das geht, zeige ich dir im Artikel Cache leeren – Browser, WordPress & Hosting.
Mobilansicht im Browser testen
Öffne deine Website auf dem Smartphone und schau genau, was nicht stimmt. Alternativ kannst du das auch direkt am Computer testen:
- Öffne deine Website in Google Chrome
- Rechtsklick auf die Seite → Untersuchen
- Klicke auf das Smartphone-Icon oben links (Gerät umschalten)
- Wähle ein Gerät aus der Liste, z.B. iPhone oder Samsung Galaxy
So siehst du genau, wie deine Seite auf verschiedenen Geräten aussieht — ohne jedes Mal zum Handy greifen zu müssen.
Häufige Ursachen und Lösungen
Das Layout ist auf Mobilgeräten komplett durcheinanderViele Einstellungen in Kadence haben separate Werte für Desktop, Tablet und Mobilgerät — erkennbar an den kleinen Geräte-Icons im Einstellungsfeld. Prüfe, ob du die mobilen Werte versehentlich leer gelassen oder falsch eingestellt hast.
Ein Block ist zu breit und erzeugt einen horizontalen Scrollbalken
Das passiert oft, wenn ein Block eine feste Breite in Pixeln hat statt einer flexiblen Breite in Prozent. Öffne den betroffenen Block im Editor und ändere die Breite auf 100% — oder entferne den festen Pixelwert.
Schrift oder Buttons sind auf dem Handy viel zu groß oder zu klein.
Auch Schriftgrößen lassen sich in Kadence separat für Mobilgeräte einstellen. Gehe in die Typografie-Einstellungen des betroffenen Elements und prüfe den mobilen Wert.Die Seite sieht im Chrome-Entwicklertool gut aus, aber auf dem echten Handy nicht.
Das Tool am Computer ist eine Annäherung, kein perfektes Abbild. Teste im Zweifelsfall immer auf einem echten Gerät — und am besten auf zwei verschiedenen Browsern, z.B. Chrome und Safari.
Änderungen an mobilen Einstellungen in Kadence wirken sich nur auf die Mobilansicht aus — der Desktop bleibt unberührt. Du kannst also bedenkenlos anpassen.