What is Tag Cloud:

A tag cloud is a stylized way of visually representing occurrences of words used to described tags. The most popular topics are normally highlighted in a larger, bolder font. Visitors to a blog or site using a tag cloud, are able to easily see the most popular tags within the page — making it easy to discern the topics covered in one quick look. Also called a weighted list.

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.

(1). Tags are sorted alphabetically. The most important or frequent terms are highlighted via an appropriate font size.
(2). 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.
(3). Tags are sorted according to their importance or frequency. Both font-size and colors can be used to emphasize the importance of terms.
(4). Tags aren’t sorted at all. Font-size, font-weight and colors in use.
(5). Tags are sorted according to their similarity. Similar terms appear as neighbours next to each other. A variety of visual formatting can be applied.

How To Make a Tag Cloud:

I actually find my tag cloud quite handy because it lists all my tags on one page, and I can see what topics I post about most frequently quite easily. I also use it as a way to see which tags I have already used, so I can be consistent when tagging posts.

Anyways a lot of folks would like to know just how you can get one of these mullets, er tag clouds. I have shown how I do it below using CFML. If you don't use ColdFusion you should still be able to follow along.

At this point you may be wondering what's a tag cloud? If so consult the picture below:

social networking .net development & solutions e-commerce .net 3.5 .net web application development SharePoint development migration services C2C services media working methodology e-learning solutions B2B services MS dynamic solutions e-mail template system fixed cost projects karten C# development lease management system .net2.0, .net3.5, sharepoint data base

Steps to Creating Tag Clouds:

Step 1 - Get a list tags, and their frequency

SELECT COUNT(tag) AS tagCount, tag
FROM tblblogtags
GROUP BY tag


In my tag cloud I list all my tags, but if you have a lot of tags you may want to limit the min number of occurrences using a HAVING statement. For example HAVING tagCount > 5

Step 2 - Find the Max and Min frequency

<cfset tagValueArray = ListToArray(ValueList(tags.tagCount))>

<cfset max = ArrayMax(tagValueArray)>

<cfset min = ArrayMin(tagValueArray)>

Step 3 - Find the difference between max and min, and the distribution

You can define the distribution to be more granular if you like by dividing by a larger number, and using more font sizes below. You will probably need to play with this to get your tag cloud to look good.

Step 4 - Loop over the tags, and output with size

“<cfoutput query="tags">

<cfif tags.tagCount EQ min>

<cfset class="smallestTag">

<cfelseif tags.tagCount EQ max>

<cfset class="largestTag">

<cfelseif tags.tagCount GT (min + (distribution*2))>

<cfset class="largeTag">

<cfelseif tags.tagCount GT (min + distribution)>

<cfset class="mediumTag">

<cfelse>

<cfset class="smallTag">

</cfif>

<a href="/tag/#tags.tag#" class="#class#">#tags.tag#</a>

</cfoutput>

Step 5 - Loop over the tags, and output with size

.smallestTag { font-size: xx-small; }
.smallTag { font-size: small; }
.mediumTag { font-size: medium; }
.largeTag { font-size: large; }
.largestTag { font-size: xx-large; }

There are probably lots of different ways to build a tag cloud, but this is the first method that came to mind.

How our tag cloud works

The Many Eyes tag cloud can show one of two kinds of data: free text, or a two-column table of tags and numbers.

If you choose to use free text, the tag cloud will strip out punctuation, calculate the frequency of each word, and draw the word at a size that is based on its frequency. The tag cloud will also ignore common words in some languages, such as the word "the" in English.

Whenever the mouse is over a word, information about the occurrences of that word and the context it was used in will be shown in a tooltip.

Expert Notes

Tag clouds have several benefits: they are extremely simple, easy to read, and by their nature don't suffer from the labeling problems of bar charts, tree maps or bubble charts. Yet there is some controversy around tag clouds, partly due to their strong association with trendy web sites (one wag dubbed tag clouds the "mullets of Web 2.0").

More seriously, in tag clouds long words are emphasized over short words, and words whose letters contain many ascenders and descenders may receive undue attention as well.

How should you balance the potential pluses and minuses? In choosing a tag cloud, keep in mind the alternatives, especially a plain table, a bar chart, and a bubble chart. Our current view is that the legibility and potential data density of tag clouds make them well-suited to large texts and collections of tags.