Dates can be displayed differently if in a form or if displayed as text.
There is considerable variation between the ways that dates are represented which can cause a great deal of confusion if not addressed consistently.
The ways that dates are expressed within different cultures can vary widely, and using purely numeric representations can mean something different.
For instance, take the following example:
- 3/5/2022
In the U.S. dates are typically represented as month, day, and year, so in this context, this date would be interpreted as March 5, 2022. However, in other parts of the world, such as in Europe, dates are represented as day, month, year. The same numerical representation could be interpreted to be 3 May, 2022. In other words, there is an increased likelihood of user error.
For this reason, it is considered best practice to spell out the month field. However, this can cause some problems with design, as some months (e.g., May) are considerably fewer characters than others (e.g. February). There also may be some variation as months get translated into other languages. For this reason, to be able to keep designs consistent, best practices dictate using a 3-letter abbreviation for the month, (e.g. “Apr” for April, “Dec” for December, etc.)
The format of the date can be presented in a different order for different countries/nationalities.
Specify morning and afternoon using AM or PM (no periods)
For time zones, when dealing with an international audience, it is best to use UTC +/-. For single digits, use no leading zero (e.g. UTC+5.00). If dealing with only US audiences, use the local representation (EST, EDT, CST, CDT. etc.)
Spell out the day of the week if it works for the design; otherwise It is permissible to use 3-letter abbreviations for days of the week, including Sun, Mon, Tue, Wed, Thu, Fri, Sat
In instances where you need to show relative time (e.g. “Last updated” or “Due date”) you can show “Tomorrow” and “Yesterday” in those terms. For shorter periods of time (such as “last updated”), it is permissible to show the number of minutes if less than an hour. Otherwise, if it is less than 24 hours, round to the nearest number of hours.
Examples:
- 25 minutes ago
- 2 hours ago
If less than a week away, include the day of the week, such as “Thursday, April 28.” If a longer time away (greater than a week), show the date and the year. For instance, “July 28, 2022.”
For many inputs, (e.g birth date, or credit card expiration date) users do expect to be able to enter a numerical representation for a month. In these cases, the format should be made clear to the user, the rules by which could be understood internationally. (e.g. MM/DD/YYYY or DD/MM/YYYY, or for credit card expiration dates, MM/YYYY). These should be made explicit in the labels for these fields and/or in the placeholder text.