The Pros And Cons Of Using Accordion Menus For UX Designers

Accordion menus are a list of content headers. Website users can click on a section to expand it and read the content. Clicking again should collapse the section. YX designers often use accordions to shorten long pages by letting visitors chose the section to read.

Pros

Accordions allow visitors to get the big picture. They can see what information is available on a page and decide quickly if the page is relevant to their needs. On long pages, visitors may not find what they want without scrolling. If they become tired before reaching the end of the page, they may hit the back button. Ensure headings are descriptive so users can make quick decisions.

Accordions are useful for a checkout page with a long form which could overwhelm visitors. When they can see the information you'll need at a glance, like shipping methods and payment options, they will not hesitate to continue.

Accordions help you avoid linking to other pages on your website. The more they have to click around and go back or close a tab, the more chances you have of losing them.

Cons

Accordions require users to perform an action to view the content. If they have to do this to see every section, it becomes tiresome. Use accordions when your visitors don't need every section if you'll have a dozen or more sections.

If you use an accordion-style checkout process, a user could make errors in multiple places without noticing until completion. They would have to go back and re-open each section to correct them. You can solve this by adding a save or done button under each section to alert users to errors immediately.

If your visitors will likely print your page, accordions will not work unless they can open multiple sections at once. This is especially applicable when they are filling out a form they will want to save for their records. For more information click here https://www.reddit.com/r/webdesign/comments/lhcevm/accordionssuck/.