Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

a date picker on an airline website

The above screenshot is from an airline's website.

Date pickers are somewhat common on websites - they're especially common for circumstances when you're booking events. Most often when they appear, you have the option to enter a date (via text box, dropdowns, etc) or to click a button that gives you a date picker.

This morning I've been studying why these are used - and when they should be used - in the context of a PC application or PC-accessed website. (There's plenty of reason to use them for touch devices like tablets or phones, so that is not the focus of this question.)

I've considered:

  • They aren't helpful for when the date is known, and shouldn't be used in those circumstances. Steam and Gmail don't offer a date picker for selecting your birth year, for instance.
  • They are helpful for getting to pick a not-yet-known date in context. When you're scheduling something, your choice of date will be influenced by which day of the week, or which week of the month, you're booking in.

But that's only two points. I'm sure there must be more to it I'm overlooking.

When should we use date pickers, and why should we use them?

share|improve this question
1  
As the answers here state, a date-picker gives the context of the day of the week to the date, and puts the dates in sets of 7 - matching the number of days of the week. Imagine a date picker that lacked those 2 features and it quickly becomes obvious which tasks are harder to accomplish. –  RedSirius Jan 6 at 12:59
6  
Another context. Some datepickers grayed out some days as there are not available or already full. For concert, live show, plane tickets you could even have color by day to show the lowest rate. Sometimes it's not ONLY a picker it contains information. –  ColdCat Jan 6 at 16:31
    
An example of what @ColdCat says –  Jay Mann Jan 10 at 10:24

6 Answers 6

up vote 20 down vote accepted

Date pickers are helpful when your concerned dates fall within the context of a month or so but not several years apart as jumping between years would require laboriously many clicks.

Date selectors are not just helpful in reducing the typing errors but they also standardize the formats when several correct variations are possible. For Americans, the correct format of date is month/day/year but for Australians, it is date/month/year. Besides these cultural differences, date may be valid in all these formats.

  1. 04/01/2014
  2. 01/04/2014
  3. 04 Jan 2014
  4. 4 January, 2014
  5. January 4th, 2014
  6. 2014/01/04

Major problem comes when date format is valid but it can be interpreted in two different ways. 04/01/2014 could be 4th of January 2014 as well as 1st of April, 2014. A Visual Date Picker tool will help us resolve such potential problems.

Now coming towards Date of Birth again, I do not prefer a single input box to enter complete date of birth because of the same day/month confusion. A better approach would be to let user select month from a drop-down menu and type-in date and year through input boxes, as used by Google.

enter image description here

share|improve this answer
14  
No! Please, do NOT make me pick the day number and year from a list! Endlessly scrolling down the dropdown lists to finally arrive at the date and year (or even having to search the options for my intended date) will make me leave your site. (I have a numpad for a reason!) –  AJMansfield Jan 6 at 16:34
5  
What a silly list - it puts month before day? How American. –  Konerak Jan 7 at 10:53
    
This is the list of possible date formats and American date format is one of them. –  Salman Jan 7 at 11:57
    
Sorry but date pickers are not created for solving the date formats. It can be easily solved as in Google example by just labeling it. Although I am used to DD-MM-Year format, I can put the entry if I have enough information about how they are shaped. –  Abektes Jan 7 at 13:17
2  
@AJMansfield: You can also type on active dropdown menus to choose options. –  kaarel Jan 8 at 8:05

Other reasons for using a calendar widget (besides taking care of format):

  • Picking date ranges: from/to, start/end, depart/return dates.
  • Providing custom presets for dates and date ranges such as: "A week from now" or "Month to date".
  • Associating date and time (when time is required). They are inseparable in real-life, why separate them (in different fields) on the UI? A good widget allows users to pick both date and time and inserts one, properly formatted, value in the input field.
  • Disabling certain dates on the calendar. Such as public holidays, or dates that are considered invalid in specific cases. Which prevents errors.
  • Showing extra information that could help user pick the right date(s): such as busyness of schedule, or Mom's birthday.
share|improve this answer

Here's a general rule: Is the day of the week important (to you/the user)?

Use a date picker if and only if

  • (b) The user wants to select a date using a known day of the week.
  • (a) The user wants to browse dates and is likely to select a date based on its day of the week.

An example of (a) would be payroll software; a user might know that his/her company pays its employees every second and fourth Thursday of each month, but the user is unlikely to memorize the dates for all the year's paydays.

An example of (b) would be a site for travel reservations; a user might want to browse weekend schedules and select one because it's on a weekend, but ultimately the user does, in fact, need to know the selected date.

share|improve this answer
    
Calendar widget allows to code a bit more data: how much tickets available for particular flight or discount dates and other things like that. –  voroninp Jan 9 at 18:44

WHEN

They are extremely useful for planning events in the future or for exploring times in the past as well as planning ranges for examination of some sort.

Use it anytime you could see your user going to their calendar on the wall and attempting to plan the future or examine past events.

WHY

The calendar is probably one of the greatest examples of information design ever invented. It visually organizes multiple layers of temporal data (year, month, week and day) into a mental model that is completely accessible and traversable with little effort. It's like an abacus for time!

In HCI, it also happens to format dates the way both people and computers can understand.

It's not useful for entering in a birth date because you know that date precisely. A different UI is better for that kind of date entry (not picker)

share|improve this answer

Simply,the cases that you are using your calendar is why you are using a date picker. Date picker is an extended functionality of calendar view.

If you are entering only your birthday, you don't need to check a calendar. If you are arranging your holiday or even finding something, you need again calendar. If you are limiting a time period, it will be better to see it also visually.

Date pickers requires less keyboard input in general and should be always placed after keyboard related entries if it is needed. Please check the rynair website, you can even choose airport without pressing a keyboard entry, at these days because it requires less action than any keyboard entry (if you design the range nicely, of course).

share|improve this answer

I think your two bullet points succinctly sum up when they make sense and when they don't.

Our error, perhaps, is that we've long called them 'date pickers'. They really should be called 'day-of-the-week' pickers in that they are useful when, as you point out, the visual cue of a calendar makes sense...when you need to know the day of the week, or which week in a month a date appears. If you don't need that particular context, they are, at best, superfluous and at worst, just get in the way. The best example of 'the worst' is a birthdate field that requires the use of a date picker starting from today. Few people have the patience to page back 20+ years or so in a date picker.

share|improve this answer
2  
I don't feel it's wrong at all to call it a date-picker. It's just that it also gives you the contextual data of day-of-week and arranges the dates in rows of seven. This meta-data assists with many date-picking tasks. –  RedSirius Jan 6 at 13:31
2  
@RedSirius that was the point I was trying to make. If you don't need the contextual visualization of days-of-the-week, then you don't really need a 'picker' to select the date. The reason to use it is BECAUSE of the days-of-the-week visualization. –  DA01 Jan 8 at 2:35

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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