Order of the fields in a list of ingredients

Question

I need to display a list of ingredients for a cooking recipe on my site. I was wondering if there is a right way to sort the different fields in each line:

• the name of the ingredient
• the unit
• quantity.

Most websites use the following pattern: [quantity] [unit] [name]

But is it really the best way to do it? Shouldn't the name come first, since it's what we want to know first (I mean, knowing that I need 150g of something won't help me, but knowing that I need flour will sure do). Also, the unit is optional, so it might be less confusing if it is put at the end right?

What do you think? Is one of the solution better than the other?

Answer 1

I think the pattern most websites use is actually the best pattern for recipes because this is how you would say it. Therefor it is easier to remember (because it takes less work for the brain to process), especially with a lot of items:
1 cup of milk VS. milk: 1 cup.

Since the reader/user is actually making a dish and not working on the computer/tablet, making thing easy to remember (at least for the short term) is a good thing. This enables the user to focus on the task at hand and spend less time reading a computer/tablet screen.

Answer 2

I agreed with Rudt that the conventional format is most easily readable, not least because it is the conventional format. But it might be helpful to a user making up a shopping list to have the ingredients named first, something like this:

Milk    150g
Butter  4oz
Flour   6oz
Oil     Dash
Salt    To taste
Pepper  To taste

You could this as an alternative display option.

Answer 3

There are times where the expected pattern for something is so ingrained that to do anything else would just be confusing. As developers and designers, we sometimes want to change things to meet new standards. That isn't always a good idea.

I don't think I have ever seen a recipe presented in any other way but this. Cookbooks, recipe cards, online cooking sites all seem to do it this way (I'm sure you can find an example that differs, but a significant minority)

There are times when user's expectations far outweigh any new and improved design standards. If you push to hard for something new, you risk losing a large percentage of users whose well established expectations are not being met. While it is tempting to be different to set yourself apart, don't set yourself so far apart that no-one comes to visit.