Comments on: Where to Align Form Buttons on Different Layouts User Experience Movement Mon, 15 Jan 2018 03:40:42 +0000 hourly 1 By: Ian Hamilton Thu, 12 Dec 2013 13:56:46 +0000 Yes, what Lee said. We recently did some usability testing that included a number of disabled participants, on a large corporate customer facing site. Right aligned buttons caused huge problems for people with mild-moderate vision impairment, in one instance preventing the customer from being able to complete the form at all.

1. Differing designer opinions on which way is theoretically marginally better

2. Some research suggesting that together is marginally better, and suggesting that together and left aligned might be very marginally better again

3. Anecdotal evidence of serious problems for people with vision impairments (including screen magnifier users), sometimes resulting in complete exclusion/abandonment

Point 3 makes it completely cut and dry, case closed. The law varies from country to country, but in the UK at least, under the Equalities Act (which applies to all websites) it is illegal to put people with disabilities at a disadvantage when there’s a reasonable alternative… and difference of opinions over marginal usability differences do not prevent it from being a reasonable alternative.

By: Anna Thu, 05 Jul 2012 08:39:24 +0000 Hi I had a similar problem. I have to design multiple pages with different forms. Sometimes it’s a page with a simple form (then a button under the form seems the correct way to go), then I have a multiple section form with buttons that lie next to certain fields (functional buttons that influence only that field) and I need general buttons for the completion of the whole form (makes sense to put the general buttons under and to the right), and then I have forms that are part of a flow (buttons on left and right that navigate through the flow). The problem this creates is inconsistency. Where does a user or even a person who is building the page know where to put the buttons? I need to create guidelines and am having a lot of trouble deciding on what to go with for the sake of consistency. Should I just create different looking buttons depending on what they do? Help! :)

By: Lee Theobald Tue, 20 Mar 2012 15:19:15 +0000 I personally would prefer never to see a button anywhere but inline with the forms controls.

I’m partially sighted and have a low peripheral vision (I believe I’ve lost about 90% of my field of vision). When I’m in front of a screen, I basically see what I am looking at clearly but as for the items all around it, all bets are off. Due to this I can often miss buttons. I will be filling out a form, scrolling down with my eyes as I go. When I get to the bottom of the form, I’ll automatically look under the form fields. If the buttons aren’t there, I have to go searching for them and for someone with poor eyesight, this can be tricky.

The forms you posted did have one huge help though – the line at the bottom of the form. When the buttons weren’t where I expected them, I did the most logical thing and followed the line with my eyes & voila – buttons.

For me that’s the clincher. Where you place you buttons is up to you but don’t assume people will expect them in the same place as you. A simple visual indicator (like a line in this case) from the form fields to the buttons can be a huge help for someone with low vision like me.

By: Patty Wed, 04 Jan 2012 19:07:01 +0000 Just came across this article and comment thread. I had the same question regarding consistency across different types of forms of the same site.

By: Gonzalo Thu, 03 Mar 2011 09:36:32 +0000 I totally agree. I think combining links and buttons could be good idea if it is a simple form where the user normaly clicks “Save” and almost never “Cancel”.

Thank you very much for your advisory.