Tag Clouds Gallery: Examples And Good Practices | Design Show...

Popularity Report

Total Popularity Score: 0

Rank

URL Tag Cloud

Groups (3)

EdTechTalk

491 members,2557 bookmarks

This is the group for EdTechTalk.com
educators

620 members,2567 bookmarks

Educators sharing bookmarks and best practice. We have a set of standard tags to help us share things that you may use in addition to your tags. (You may subscribe to these tags via RSS feed by subject area, which makes it very useful.)
SQLI Agency

22 members,305 bookmarks

Afin de centraliser et partager plus efficacement tous les bookmarks que l'on peut s'envoyer les uns et les autres au sein de l'agency que ce soit de la veille techno, ergo, webmarketing ou graphique.

Related Lists

Bookmark History

Saved by 59 people (18 private), first by anonymouse user on 2007-11-06

Elementarytechteacher on 2008-08-09 - Tags design , tagcloud , examples
Grace_kat on 2008-08-09 - Tags tagcloud
Crezard on 2008-08-07 - Tags tags , cloud , sample
Cognatio on 2008-08-05 - Tags tagcloud , usability , design
Kreliz on 2008-07-30 - Tags design , tagging , tag , webdesign , tagcloud , examples , usability

Public Sticky notes

Tag Clouds Gallery: Examples And Good Practices

Highlighted by goosemagoo

Tag Clouds Gallery: Examples And Good Practices

Highlighted by jrwordsworth

Due to their “cloudy” form the design of tag clouds sets them apart from other design elements on a page.

Highlighted by om19bao

Types of Tag Clouds

There is a variety of ways to implement tag clouds. Some methods are more popular than the other ones. Most clouds are primarily sorted alphabetically.

Tags are sorted alphabetically. The most important or frequent terms are highlighted via an appropriate font size.
Tags are sorted alphabetically. All terms have the same font size and weight. More important terms are highlighted with a font color or a background color.
Tags are sorted according to their importance or frequency. Both font-size and colors can be used to emphasize the importance of terms.
Tags aren’t sorted at all. Font-size, font-weight and colors in use.
Tags are sorted according to their similarity. Similar terms appear as neighbours next to each other. A variety of visual formatting can be applied.

Highlighted by om19bao

An interesting tendency we’ve been observing recently is the use of tag indexes instead of tag clouds.

Highlighted by om19bao

In fact, it’s used more and more often — in indexes the tags are sorted alphabetically.

Highlighted by om19bao

Font-size-weighted Tag Clouds

In many cases tag clouds are placed within a sidebar on the left or the right side of the page; therefore they usually don’t have much site area to fill. Consequently, enormous fonts are used sparingly.

Highlighted by om19bao

Colorful Tag Clouds

Instead of large font sizes designers tend to use colors. The weight of the tags isn’t only determined by the font-size, but also by the color it has. The more contrast exists between the color of the tag and the background, the more active the tag is. “Passive” tags usually have colors more similar to the background color — they have to remain in the background.

Caution: the more colors are used, the more irritating tag clouds are. Visitors have to be able to gain an immediate understanding of how tag weights are distributed; a variety of colors doesn’t provide any helpful information. What do the used colors stand for? Is green more important than blue? In most cases 2-3 colors should be the maximal number of colors used in a tag cloud.