User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
Currently, on using the browser back button, our site pages back through not only the pages but any modals used. So if the modals were part of a 'series' (e.g. three consecutive modals to capture information) the first modal in the series is presented.
Personally, I feel it is confusing as the context for the modal may be lost - since context is developed using a forward journey. However I have no idea what would be considered best practice.
Does anyone have any advice for best practice?
This does not answer the back button dilemma of the browser, but for three consecutive modals, you could have steps on top to tell the user about them such as shown here in the picture:
Image credits: https://dribbble.com/shots/4928879-Progress-Bar-Modal-Pop-up
From the offset, I'm not a big fan of using modals for multiple step forms; since you will inevitably have to "stack" modals, or similar components, on top of it for semantic (success, warning, error) messages during the filling out process.
Maybe offering access to that multiple-step form from inside the original page is a more straightforward option:
"Do thing" button at relevant page
"new" page with step 1 of doing thing with a "back" or "cancel" button (that takes you back to "relevant page") and a "next step" button
Step 2, 3, 4... with a "previous step" and "next step" buttons
Final step, where you check the submitted info and confirm (which sends you back to "relevant page"), or go to previous step.
If you have a lot of (well defined) steps, a widget that allows you to jump to any step you want might be handy.
In any case, I don't believe a modal is the component to be used here. Move the user to a "deeper" level (like "List of things page" to a "Create new thing page") and avoid awkward interactions like modals popping up with the back button, and free the modal component to be used in things like "you're gonna lose the info behind this modal if you leave" warnings and such.
What if you seperate the modals from the browser back button-
On the form in the modal, have a back option to navigate the form. But only the form.
Pressing the back button on the browser will trigger the browser to say 'sure u want to exit? Info on the form will be lost'.
Or if they haven't filled it in the form then just back up without warning.
Thereby the browser back button sticks to controlling the top level of the information architecture.
This might provide a consistent sense of security for the user about the overall interaction model.
If I think I got your question.....
