5

I'm working on touching up (as much as I'm allowed) some of the design elements for a website. One client requirement is to draw more attention to the "buy tickets" link as this action is one that users take frequently. There are already a lot of other competing actions in this header area and we currently have three possible options for making "buy tickets" more visually prominent (see examples below).

Existing Layout

enter image description here

This is a film festival organization. Personally I think their primary action is, ultimately, selling tickets, so I believe "buy tickets" should be the most prominent element (but there are differing opinions on the client-side). Which option is most usable (i.e., accomplishes the goal of making "buy tickets" more prominent but is balanced with the other functionalities of the header which accommodates the main navigation, newsletter signup, site title, and special global links)?


1. Include in Main Menu

enter image description here

+ first item in main menu is first things users see (in the menu)
+ larger size (compared to existing) also increases noticeability
- confuses navigation (all main menu items are sections, not individual page links)
- perhaps not enough contrast (this action could be considered more important in the hierarchy than the main menu items)


2. Replace Newsletter Signup Button

enter image description here

+ easy to see (moderate contrast)
+ special visual style makes it unique and important
- removes newsletter functionality which client finds useful


3. Special Button Style for Existing Link

enter image description here

+ easy to see (high contrast)
+ prominent position (for most western cultures)
- dominates visual hierarchy (could be distracting being so high contrast)
- might be departing from established design guides?


Are there other possibilities that I'm overlooking, or does one of these options clearly accomplish the client's goal without taking away from the other header elements?

4 Answers 4

11

I guess I am going to be the dissenting vote and vote for option 2 :)

Reasons

  1. People read from left to right and when you structure a site to have a purpose,you ideally want to lead them to a place where the last thing they remember or see is the purpose of the site. In your case,the "Buy TJFF tickets" stands out clearly and it something most users would notice due to its location and prominent size (see the example below)

    enter image description here

  2. The gradient of the color behind the "Buy TJFF tickets" is subtle and something that draws the eyes when reading from left to right.

recommendations:

  1. Repeating Buy TJFF tickets twice might confuse the user and make him wonder about where he needs to really go to buy the tickets. I would recommend removing it from the navigation bar at the start

  2. Include the newsletter functionality link in the top navigation bar right after"Festival FAQS" so that you are again leading the user on to the tickets tab

Some articles for you to read :

  1. “Call To Action” Buttons: Guidelines, Best Practices And Examples
  2. Call to Action Buttons: A Survey of Best Practices
3
  • Geez, you're really making my decision easy aren't you? haha. I like what you said about leaving the user with the primary action. I also think the repetition doesn't work as well (if I used the "main menu" option, I think I would fight for then removing the duplicate). I hadn't considered moving the newsletter signup essentially switching it with the existing buy-now. Tough call.
    – robmclarty
    Mar 23, 2012 at 20:38
  • Look at the links I provided,even though you are providing a lot of information on your page,your primary objective must be to get them to buy tickets and hence all your actions should lead to it
    – Mervin
    Mar 23, 2012 at 20:42
  • I'm accepting your answer as it was most informative and helped me formulate my opinion. I think I agree with the solution you described (putting the buy-tickets where the current newsletter-signup is located). The links you provided were useful and informative. Thanks.
    – robmclarty
    Mar 23, 2012 at 23:38
1

Moving it into main navigation makes a lot of sense, so I'll pick #1. 3 is too loud.

Your main navigation's language could be a bit more concise, that might help with some of the other issues you mentioned.

Tickets . Festival . Events . Support . Media . Filmmakers . Education . About

Every time you add a word to a navigational choice, it places a greater strain on the mind of the user. Single words are easier, faster. Use them whenever possible. Fight for them.

Also, and you may already be doing this, make sure to link to the tickets section whenever you're trying to generate interest elsewhere in the site. So wherever you describe the films that will be shown, have a buy tickets link or button separate from the main navigation.

1
  • I totally agree with you regarding the menu. Unfortunately the person paying the bills gets the final say on the taxonomy of the main menu (we tried our best for simple + concise labels, believe me). Such is the nature of client work, lol.
    – robmclarty
    Mar 23, 2012 at 20:18
1

Great analysis from all the answers. I would go for 3 because the top task of the website now is to sell tickets. I'm hesitant about 2. because it involves replacing an area and design that was reserved for the newsletter signup (which I think is the top task when tickets aren't available). Repeat visitors may have developed "blindness" to that button and not notice that it's been changed to the link to buy tickets.

After reading everyone's answers, I would suggest combining 1 and 2 - keep the link position and font-size the same as the other links but use a different and brighter color to make it stand out. This way, it won't be too loud or be mistaken as the user state.

1
  • I'd probably go with 2 if the button had a more-contrasting colour (as option 3 does). Partly for the reason stated in the accepted answer (it's the last thing you see; it's "in the user's mind"); but probably more because... to my mind you want the user to have read more of the page before being prompted to buy tickets, so they have a better idea what they're buying a ticket for, or why they'd want to.
    – TripeHound
    Jun 14, 2018 at 10:48
0

Whilst option 3 is 'attention' grabbing it will easily be confused as simply the 'active' state of the user current location in the site. My personal opinion would be option two, with perhaps (if possible) the font size and/or weighting being increased

Your Answer

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

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