Responsive · Prüfpunkt
Wie prüft man ein einzelnes Element auf allen Bildschirmgrößen?
Ein einzelnes Element prüft man, indem man es gezielt anspricht und auf jeder Gerätegröße einzeln misst. Der Prüfservice macht genau das: Er sucht das benannte Element — etwa eine Preistabelle, ein Anmeldeformular oder einen eingebetteten Kalender — auf Smartphone, Tablet und Desktop und prüft, ob es vorhanden und sichtbar ist, vollständig in die Gerätebreite passt und sich gut bedienen lässt.
Diese Fragen beantwortet die Element-Prüfung
Je Gerätegröße beantwortet die Prüfung fünf Fragen. Ist das Element überhaupt vorhanden? Manche Bausteine verschwinden auf kleinen Bildschirmen vollständig. Ist es sichtbar, mit messbarer Breite und Höhe? Passt es in die Gerätebreite, oder ragt es seitlich über den Bildschirmrand hinaus? Sind alle Bedienflächen darin — Schaltflächen, Links, Eingabefelder — mindestens 24 mal 24 Pixel groß, wie es die Barrierefreiheits-Regel WCAG 2.5.8 verlangt? Und bleibt jeder Text darin vollständig lesbar, statt abgeschnitten zu werden? Zu jedem Geräteprofil legt der Bericht ein markiertes Bildschirmfoto bei, auf dem das geprüfte Element hervorgehoben ist — der Zustand ist damit belegt, nicht nur behauptet.
Dann lohnt sich der Blick auf ein einzelnes Element
Die gezielte Prüfung ist das richtige Werkzeug, wenn eine bestimmte Stelle Sorgen macht oder gerade repariert wurde. Typische Fälle: Eine Preistabelle ragte auf dem Handy über den Rand hinaus, und nach der Korrektur soll belegt sein, dass sie jetzt auf allen vier Gerätegrößen passt. Ein neues Kontaktformular soll vor der Freischaltung auf Bedienbarkeit geprüft werden. Oder ein eingebetteter Fremdinhalt — eine Karte, ein Buchungsfenster, ein Bewertungs-Baustein — verhält sich anders als der Rest der Seite, weil er von einem anderen Anbieter stammt. Statt die ganze Seite erneut zu prüfen, liefert die Element-Prüfung eine klare Antwort zu genau dieser Stelle.
So gehen Sie es an
- Benennen Sie das Element, das Ihnen Sorgen macht, so konkret wie möglich — etwa „die Preistabelle auf der Angebotsseite“.
- Prüfen Sie nach jeder Reparatur gezielt das betroffene Element auf allen vier Gerätegrößen, statt sich auf den Desktop-Eindruck zu verlassen.
- Sehen Sie sich die markierten Bildschirmfotos im Bericht an — sie zeigen das Element im Zustand jeder Gerätegröße.
- Lassen Sie eingebettete Fremdinhalte wie Karten oder Buchungsfenster gesondert prüfen, denn sie folgen eigenen Regeln.
Häufige Fragen
Was ist ein Viewport?
Der Viewport ist der sichtbare Anzeigebereich des Browsers — vereinfacht: das Fenster, durch das Besucher die Website sehen. Auf dem Smartphone ist er schmal, am Desktop breit. Der Prüfservice arbeitet mit vier Viewport-Profilen von 390, 768, 1440 und 1920 Pixeln Breite, weil sich das Verhalten einer Seite mit der Breite ändert.
Warum verschwindet ein Element auf dem Handy?
Viele Websites blenden Bausteine auf kleinen Bildschirmen gezielt aus, um Platz zu sparen — manchmal gewollt, manchmal versehentlich durch eine Vorlagen-Einstellung. Die Element-Prüfung deckt das auf: Sie meldet je Gerätegröße, ob das Element vorhanden und sichtbar ist. Fehlt es nur auf dem Handy, wissen Sie, dass die mobile Ansicht gesondert eingestellt werden muss.
Kann man eingebettete Inhalte wie Karten oder Buchungsfenster prüfen?
Ja, genau dafür eignet sich die Element-Prüfung. Eingebettete Inhalte stammen von fremden Anbietern und folgen eigenen Regeln — sie können breiter sein als das Gerät oder zu kleine Bedienflächen mitbringen. Die Prüfung misst das Element auf allen vier Gerätegrößen und belegt den Zustand mit einem markierten Bildschirmfoto je Profil.
Weiter im Prüfbereich Responsive
- Auf welchen Bildschirmgrößen sollte eine Website getestet werden?Auf vier Profilen: 390, 768, 1440 und 1920 Pixel Breite — jeweils als echtes Gerät im Browser nachgebildet.
- Wie zuverlässig sind automatische Website-Prüfungen?Verlässlich wird eine automatische Prüfung durch Wiederholung: Jeder Befund wird zweimal erhoben, gemeldet wird nur, was beide Messungen sehen.
- Warum darf eine Website auf dem Handy nicht seitlich scrollen?Seitliches Scrollen zeigt: Inhalt ragt über den Bildschirm hinaus. Die Prüfung misst den Überstand in Pixeln und nennt das verursachende Element.
- Wie groß müssen Schaltflächen auf einer Website mindestens sein?Mindestens 24 mal 24 Pixel, so verlangt es die Regel WCAG 2.5.8. Die Prüfung misst Schaltflächen und Links auf vier Gerätegrößen und nennt zu kleine.
Dieser Prüfpunkt gehört zum Prüfbereich Responsive — dort stehen alle Prüfpunkte im Überblick. Was die Prüfung insgesamt leistet, zeigt die Leistungsseite; wie ein Ergebnis zustande kommt, erklärt das Prüfverfahren. Alle Prüfbereiche im Überblick: Wissensbasis.