Average rating is 66% positive
66.67
6 votes
This pattern was helpful This pattern is useless

Tag

Problem summary

The user wants to find more data in the same category and/or contribute data in the same category

Example

Example image showing 'Tag'

Usage

  • Use when the content on your website is possibly mapped into multiple categories and does not necessarily only fit into one hierarchical category.
  • Use when you want users to contribute data to your website and let them organize their contributed data themselves.

Solution

Let the contributers of information on your website add keywords (tags) to the content they submit. These keywords are then transformed into links that leads to tag pages; listing all other contributions for that tag (category).

Rationale

Tags are relevant keywords associated with or assigned to a piece of information. Tags are often used on social websites, where users can upload their own content. Here, tags are used to let users organize and categorize their own data in the public sphere. In this way, tags can be seen as a bottom-up categorization of data rather than a top-down categorization of data, where the creators of the site define the hierarchy data is submitted to.

More examples images of the Tag pattern

Tags added to a blog post. When adding tags at flickr, you can choose from tags you gave other pictures (grayed out) or type new. Upon submission, each tag is shown above the input field in a vertical list. They can each be easily removed separately. When adding tags to a video at Vimeo, tags are separated by commas, and each tag are upon submission added  to a horizontal line below the input field. Each tag can easily be removed separately.
Tags added to a blog post. When adding tags at flickr, you can choose from tags you gave other pictures (grayed out) or type new. Upon submission, each tag is shown above the input field in a vertical list. They can each be easily removed separately. When adding tags to a video at Vimeo, tags are separated by commas, and each tag are upon submission added to a horizontal line below the input field. Each tag can easily be removed separately.
This pattern was last updated on February 07, 2008

1 comment

Post a comment

Required
Required
Will not be published
simple_captcha.jpg
Required
Type the code from the image