I have a big form with like 16 inputs, going from basic inputs, selects and multiselect. Now I want to reduce the cluttering for the user by moving the more advanced inputs such as multiselects to another page or fullscreen modal, so like that if the user wants to use any of it he will be having it cleanly in another screen.

I've seen many website do it and I don't know it's really the right thing to do or just use another alternative methode such as collapsibles. Should I separate it or keep it in the same page ?

  • 4
    Could you please provide some screenshots/wireframes and also explaining what are these inputs for? Are they related to each other or not?
    – Shahriar
    Dec 25, 2021 at 10:47

1 Answer 1


Some general guidelines and questions that will impact what the best solution will be:

Are all the inputs relevant for all the users? If no then try to only show the ones that specific users needs to see. If yes try not to hide any important fields. Hiding functionality is rarely a good idea, both from an accessibility point of view and it can also introduce stuff from a validation point of view.

Are the inputs related to each other? Then one solution could be to split them into steps. But then they need to be ordered in a logical order. If it comes down to one of the aims of form is completion, having multiple steps can create a feeling of wanting to complete the form if started.

  • This is actually what I did. I did an accordion with all inputs, and left the important ones open from the start, so like that the user will hide.display other not so important inputs at will. Dec 28, 2021 at 3:47

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.