Eine Mutter zeigte mir stolz die Website ihrer Tochter, ein Projekt über europäische Geschichte. Am Laptop sah alles perfekt aus: schöne Spalten, lesbare Schrift, organisierte Bilder. Dann öffnete sie es auf ihrem Handy. Chaos.
Der Text war winzig. Man musste horizontal scrollen. Buttons überlagerten sich. Bilder sprengten den Bildschirm. Die Seite war technisch funktionsfähig, aber praktisch unbrauchbar. Über 70 Prozent der Jugendlichen greifen hauptsächlich vom Smartphone auf Websites zu. Diese Seite schloss sie alle aus.
Vorher war das Standard: Websites wurden am Computer erstellt, am Computer getestet, fertig. Niemand dachte an andere Bildschirmgrößen. Die Schriftgröße war fest auf 12 Pixel eingestellt. Bilder hatten feste Pixel-Breiten. Menüs waren für Mausklicks optimiert, nicht für Fingertipps.
Google bewertet das mittlerweile direkt. Seit einigen Jahren schaut die Suchmaschine zuerst auf die Mobilversion einer Seite. Wenn die nicht funktioniert, rutscht die gesamte Website in den Suchergebnissen nach unten. Egal wie gut der Inhalt ist.
Das klingt kompliziert, aber die Lösung ist meist einfacher als gedacht.
Nachher haben wir folgendes geändert:
Erstens haben wir relative statt fester Größen verwendet. Statt „Breite: 800 Pixel" steht jetzt „Breite: 90 Prozent". Die Seite passt sich automatisch an jeden Bildschirm an. Das ist eine Zeile Code.
Zweitens haben wir die Schriftgröße angepasst. Mindestens 16 Pixel für normalen Text auf Mobilgeräten. Alles darunter zwingt Menschen zum Zoomen. Niemand macht das gerne, die meisten verlassen einfach die Seite.
Drittens haben wir die Navigationselemente größer gemacht. Buttons brauchen auf Touchscreens mindestens 48 Pixel Höhe. Kleinere Flächen führen zu Fehltipps und Frustration.
Viertens haben wir die Bilder flexibel eingebunden. Eine einzige CSS-Regel sorgt dafür, dass Bilder nie breiter als der Bildschirm werden. Kein horizontales Scrollen mehr.
Das Ergebnis: Die Website funktioniert jetzt überall. Auf dem Laptop, dem Tablet, dem Smartphone. Die Besuchszeit hat sich verdreifacht, weil Menschen nicht mehr frustriert abspringen. Die Seite erscheint in Googles Suchergebnissen höher, weil sie die Mobilkriterien erfüllt.
Sie können das selbst testen. Öffnen Sie die Website Ihres Kindes auf Ihrem Handy. Ist der Text lesbar ohne Zoomen? Funktionieren alle Buttons beim ersten Tippen? Laden Bilder schnell und passen auf den Bildschirm? Wenn Sie dreimal „nein" sagen, gibt es Arbeit zu tun.
Die meisten Website-Baukästen machen das automatisch richtig. Aber wenn Ihr Kind selbst programmiert oder alte Vorlagen verwendet, fehlt diese Anpassung oft. Es lohnt sich, einen Nachmittag zu investieren. Die Alternative ist eine unsichtbare Website, egal wie gut der Inhalt ist.