Zum Inhalt springen

Eingabefeld zu schmal

SurveyTester misst jedes Text- und Zahlenfeld auf der echten Seite und meldet Felder, die für den eingegebenen oder längsten erlaubten Wert zu schmal sind.

Veröffentlicht 6 Min. Lesezeit .md

Ein Befragter tippt sein Alter, 53, in ein Feld - und das Feld zeigt "5". Die "3" ist noch da, sie rollt aber nur ins Bild, solange der Cursor im Feld steht. Sobald der Befragte weitergeht, sieht die Antwort falsch aus, und viele gehen zurück und "korrigieren" sie. Das Ergebnis ist entweder ein falscher Wert oder ein verärgerter Befragter. SurveyTester misst jedes Text- und Zahlenfeld in der dargestellten Seite und meldet ein Feld, das für seinen Wert zu schmal ist, als Fund. Die Prüfung gehört zu den Auto-Detect-Prüfungen und läuft, ohne dass jemand sie starten muss.

Warum ein zu schmales Feld schwer zu finden ist

  • Es hängt von der dargestellten Seite ab, nicht vom Skript. Die tatsächliche Breite eines Felds ergibt sich aus Umfrage-Template, CSS, Schrift und Bildschirm. Das Fragebogenskript sagt darüber nichts, und ein Feld, das auf dem Monitor des Programmierers breit genug ist, kann auf dem Handy zwei Ziffern breit sein.
  • Es zeigt sich nur mit dem passenden Wert. Wer "7" ins Altersfeld tippt, sieht nichts Auffälliges. Das Problem erscheint mit "53", mit einer zehnstelligen Telefonnummer oder einer Postleitzahl - mit genau dem Wert, den der Tester zufällig nicht eingegeben hat.
  • Es fällt selbst dann leicht nicht auf. Beim Tippen rollt das Feld mit dem Cursor mit, der Tester sieht also den ganzen Wert. Erst nach dem Verlassen des Felds ist ein Teil davon verdeckt.
  • Dasselbe Feld wiederholt sich. Ein Template mit fester Feldbreite betrifft jede Zahlenfrage der Umfrage, in jeder Sprache - aber niemand testet jede Zahlenfrage mit ihrem längsten Wert.

So funktioniert es

Ist eine Seite eines Testlaufs geöffnet, misst die SurveyTester-Browsererweiterung die sichtbaren Text- und Zahlenfelder direkt in der dargestellten Seite: die Breite, die tatsächlich für Text zur Verfügung steht (Feldbreite abzüglich Innenabstand und bei Zahlenfeldern abzüglich der Pfeiltasten), mit der echten Schrift, Größe und Laufweite des Felds. Das ist eine Messung, keine Schätzung aus dem HTML.

Die Prüfung läuft in jeder Art von Testlauf:

  • SurveyBots - jedes Feld wird direkt gemessen, nachdem der Bot seine Antwort eingetippt hat.
  • Manuelle Tests und Testlinks - jedes Feld wird gemessen, wenn der Tester es nach dem Tippen verlässt; Felder, die schon einen Wert haben (zum Beispiel nach dem Zurückgehen), werden beim Öffnen der Seite gemessen.

Wann die Prüfung anschlägt

Ein Feld wird in zwei Fällen gemeldet:

  1. Der eingegebene Wert passt nicht hinein. Der Text ist breiter als der sichtbare Teil des Felds, der Befragte sieht nur den Anfang.
  2. Der längste erlaubte Wert würde nicht passen. Bei Zahlenfeldern betrachtet SurveyTester zusätzlich die Grenzen, die die Umfrage dem Feld setzt - das Attribut maxlength (Anzahl Zeichen) und die Werte max und min - und prüft, ob der breiteste damit erlaubte Wert passen würde. Ein Feld mit maxlength="3", das nur zwei Ziffern zeigt, wird auch dann gemeldet, wenn der Bot "7" getippt hat. So findet schon ein einziger Testlauf das Problem, ohne dass jemand den längsten Wert ausprobieren muss.

Eine kleine Toleranz von zwei Pixeln fängt Cursor und Rundung ab, damit ein Wert, der gerade noch passt, nicht gemeldet wird.

Was nicht geprüft wird

  • Lange Textfelder. Ein Freitextfeld für einen Satz soll scrollen; der Test mit der Maximallänge gilt nur für Zahlenfelder. Ein Textfeld wird nur gemeldet, wenn der tatsächlich eingegebene Wert abgeschnitten ist.
  • Unrealistische Grenzen. Ein maxlength über 12 Stellen gilt als technische Grenze, nicht als die Länge, die Befragte eingeben sollen.
  • Versteckte, schreibgeschützte und deaktivierte Felder sowie die SurveyTester-Leiste selbst.
  • Wiederholungen. Jedes Feld wird einmal pro Seite eines Testlaufs gemeldet, und der Text des Funds enthält nur Eigenschaften des Felds, nicht den eingegebenen Wert. Zwanzig Bots mit zwanzig verschiedenen Altersangaben ergeben also einen Fund für das Feld, nicht zwanzig.

Den Fund lesen

Der Fund heißt Eingabefeld zu schmal – eingegebener Wert wird abgeschnitten und nennt das Feld (seinen Namen oder seine Id), die für Text verfügbare Breite in Pixeln, wie viele Ziffern das Feld zeigen kann und, falls gesetzt, das maxlength des Felds. In der Testsitzung wird das Feld direkt auf der Umfrageseite markiert; die Markierung sagt zum Beispiel, dass das Feld 18px breit ist und nur 1 Ziffer zeigt.

Platzhalter: Screenshot einer Umfrageseite in der Testsitzung mit einem Altersfeld, das von "53" nur "5" zeigt, markiert durch die Fund-Markierung
Das abgeschnittene Feld auf der Umfrageseite markiert
Platzhalter: Screenshot der Liste automatisch erkannter Funde mit dem Fund "Eingabefeld zu schmal – eingegebener Wert wird abgeschnitten", dem Feldnamen, seiner Breite und der Anzahl sichtbarer Ziffern
Der Fund in der Liste der Funde

Wie jeder automatisch erkannte Fund wird er entweder angenommen - er wird zu einem Issue für den Umfrageautor - oder mit einem Grund abgelehnt, zum Beispiel wenn das Feld absichtlich kompakt ist.

So beheben Sie es in der Umfrage

Die Lösung liegt fast immer im Layout der Umfrage, nicht in der Fragelogik:

  • Feld verbreitern. Die meisten Umfrageplattformen haben eine Breiten- oder Größeneinstellung für Zahlen- und Textfragen. Stellen Sie sie auf den längsten Wert ein, den Befragte eingeben werden, plus etwas Luft.
  • CSS verwenden. Setzt das Template eine feste Breite, überschreiben Sie sie für das Feld oder für alle Zahlenfelder, zum Beispiel mit width: 6em;. Schriftbezogene Einheiten (em, ch) wachsen mit dem Text mit; min-width verhindert, dass das Feld auf schmalen Bildschirmen schrumpft. width: 5ch; schafft Platz für genau fünf Ziffern in der Schrift des Felds.
  • Das Attribut size verwenden. Bei einem einfachen HTML-Eingabefeld fordert size="5" ein Feld von etwa fünf Zeichen Breite an - eine CSS-Breite aus dem Template hat aber Vorrang.
  • Grenzen prüfen. Ist das Feld absichtlich schmal, sollten maxlength und max zu den Werten passen, die Sie wirklich erwarten. Ein maxlength="10" an einem Altersfeld ist ein eigener Programmierfehler.
  • Auf dem Handy testen. Responsive Templates verkleinern Felder oft auf kleinen Bildschirmen. Lassen Sie SurveyBots oder einen manuellen Test mit einer mobilen Geräteeinstellung laufen, um zu sehen, ob das Feld dort noch passt.

Nach der Korrektur misst der nächste Testlauf das Feld erneut; passt es, entsteht kein neuer Fund.

Die Prüfung ein- oder ausschalten

Die Prüfung steht unter den Auto-Detect-Prüfungen als Zu schmale Eingabefelder erkennen. Wie die anderen Prüfungen lässt sie sich für die ganze Firma unter Administration › Unternehmenseinstellungen › Automatische Fehler-Erkennung ein- oder ausschalten, außerdem pro Projekttyp und pro Projekt. Das Ausschalten beendet die Messung für neue Testläufe; bereits gemeldete Funde bleiben in der Liste. Siehe Auto-Detect Issues und Automatische Ticket-Erkennung pro Projekttyp einrichten.

Platzhalter: Screenshot der Einstellungen der automatischen Fehler-Erkennung mit der Zeile "Zu schmale Eingabefelder erkennen" und ihrem Ein/Aus-Schalter
Die Prüfung unter den Auto-Detect-Prüfungen

Hinweise

  • Die Prüfung braucht die SurveyTester-Browsererweiterung, denn nur die echte Seite kennt die tatsächliche Breite eines Felds. Seiten, die ohne Browser analysiert werden - etwa ein hochgeladener Fragebogen -, werden nicht gemessen.
  • Die Messung gilt für das Browserfenster des Testlaufs. Ein Feld, das auf dem Desktop passt, kann auf dem Handy trotzdem zu schmal sein; testen Sie mit den Geräteeinstellungen Ihrer Befragten.
  • Dropdowns, Schieberegler und mehrzeilige Textbereiche werden nicht gemessen.

Das Wichtigste

Wer nicht sieht, was er eingegeben hat, bricht ab oder antwortet falsch. SurveyTester misst jedes Feld in der dargestellten Seite, mit dem tatsächlich eingegebenen Wert und mit dem längsten Wert, den das Feld erlaubt - so wird ein zu schmales Feld im ersten Testlauf gefunden, nicht vom ersten Befragten.