Dialoge richtig planen: Löschen muss auch abbrechbar bleiben

Der Browser bringt ein Dialogelement mit

HTML „dialog“ kann für modale und nichtmodale Fenster verwendet werden. Laut MDN öffnet „showModal()“ einen modalen Dialog und macht den übrigen Seitenbereich währenddessen inaktiv. Ein bloß gesetztes „open“-Attribut hat nicht dieselbe Wirkung. Das W3C-Muster für modale Dialoge beschreibt außerdem Anforderungen an Fokus, Tastaturbedienung und Rückkehr nach dem Schließen.

Diese Grundlagen sind etablierte Technik. Der heutige Ratgeber überträgt sie auf einen eigenen Anwendungsfall: Eine ehrenamtliche Redaktion möchte einen noch unveröffentlichten Veranstaltungsentwurf entfernen. Die technische Umsetzung muss später in der tatsächlichen Anwendung geprüft werden; ein gezeichnetes Fenster belegt noch keinen funktionierenden Löschvorgang.

Die Entscheidung konkret formulieren

Der Dialog sollte den betroffenen Entwurf nennen: „Entwurf Sommerlesung löschen?“ Ein kurzer Satz erklärt die Folge. Die Knöpfe heißen „Abbrechen“ und „Entwurf löschen“. Ein allgemeines „OK“ hilft hier wenig, weil die Handlung außerhalb des ursprünglichen Seitenkontexts verstanden werden muss.

Unsere Gestaltungsvorgabe lautet, dass ein versehentliches Öffnen keine Veränderung auslöst. Beim Öffnen wird deshalb eine sichere, nachvollziehbare Fokusposition gewählt. Das kann bei dieser unumkehrbaren Entscheidung der Abbruchknopf sein. Für andere Dialoge, etwa ein umfangreiches Formular, muss die passende Position eigens bestimmt werden.

Einen vollständigen Ablauf testen

Öffne den Dialog per Tastatur. Bewege dich mit Tab und Umschalt-Tab durch seine Bedienelemente. Du solltest nicht unbeabsichtigt im dahinterliegenden Seitenformular landen. Brich anschließend ab und kontrolliere, dass der Entwurf weiterhin vorhanden ist. Die Bedienposition sollte sinnvoll zur ursprünglichen Aktion zurückkehren.

Wiederhole den Test und bestätige die Löschung mit einem eigens angelegten Testentwurf. Prüfe danach die tatsächliche Datenliste. Ein verschwundenes Fenster allein genügt nicht als Erfolg. Wenn die Serveraktion fehlschlägt, muss die Anwendung das verständlich melden und darf keinen Erfolg vortäuschen. Diese Fehlerprüfung gehört in den Bauauftrag.

Mobile Ansicht und lange Titel

Verwende zusätzlich einen Entwurf mit einem sehr langen Namen. Auf dem Telefon dürfen weder Erklärung noch Schaltflächen abgeschnitten sein. Prüfe die Ansicht mit eingeblendeter Bildschirmtastatur, falls der Dialog Eingabefelder enthält. Eine zweite Person sollte ohne Einführung erkennen, was beim Bestätigen geschieht.

Die Abnahme endet erst, wenn Abbrechen, Bestätigen und Fehlerfall jeweils nachvollziehbar funktionieren. Native Elemente erleichtern den Aufbau. Verständliche Entscheidungen und korrekte Datenänderungen bleiben Aufgaben des konkreten Projekts.