Welcome to The Meta Party -
We are a young firm of Search Engine Optimisers and Web Accessibility Consultants. We produce many a free article, one of which can be found below.
Tag Clouds
Jefferey doesn't like them but Im intrigued by them. I actually find them quite nice to use. What intrigues me more, however, is how to create them. Half way through this walk-through the logic clicks and all is clear:
- Count up all the words
- the (10) big (15) cat (20)
- Find the smallest amount and subtract from the others
- the (0) big (5) cat (10)
- Add each of these figures to a 100% font size
- the (100%) big (105%) cat (110%)
- Set these, via CSS, in <span/> tags
- Badda-bing; Tag Clouds
You have been reading Tag Clouds which was posted on Wednesday, May 11, 2005.
This is one of many SEO Articles that we ( The Meta Party ) produce almost daily.
If you'd like to read more about this fine web design and search optimisation company, you can read about our services here .. alternatively if you'd like to replicate or syndicate this article you can do so via our ATOM XML feed [?]; Although, it should be noted, this SEO Articles is licenced under a Creative Commons Share and Share A-like policy.
Comments:
A problem with your method is that you have no top end. So, you could end up with fontsize = 1498% if you have a tag that occurs frequently enough. That, obviously, won't work, and if you notice, Technorati and Flickr both seem to have a maximum font size in their tag clouds. So, the solution is to use ratios instead of differences. To use your example:
Count up all the words (I’m changing the numbers for didactic purposes)
the (10) big (15) cat (27)
Now, we want pick our font sizes in advance. Suppose we pick 100% for our smallest font size and we pick 110% for our largest. All we have to is figure out where our intermediate term falls between 100 and 110. For any given term, the formula is:
TF = term frequency
LF = lowest frequency
HF = highest frequency
(IF – LF)/(HF – SF)
That’s the distance, in percentage terms, from the low end to another term. Now, we just need to translate that into the font sizes:
SM = small font size
BF = big font size
100 + ((BF – SF)*(TF – SF)/(LF – SF))
That’s it! In this example, the answer is:
100 + ((110 – 100) * (15 – 10)/(27 – 10)) = 102.94
So, the tag “big” should be rendered at 103% and no tag will be rendered larger than 110% or smaller than 100%.
Now, to see my point, suppose the example is:
the (10) big (15) cat (270)
Your way:
The: 100%
Big: 105%
Cat: 360%
My way:
The: 100%
Big: 100.19%
Cat: 110%
Which makes sense considering that “big” and “the” are close in frequency compared to “cat” and “the.”
Post a Comment
Count up all the words (I’m changing the numbers for didactic purposes)
the (10) big (15) cat (27)
Now, we want pick our font sizes in advance. Suppose we pick 100% for our smallest font size and we pick 110% for our largest. All we have to is figure out where our intermediate term falls between 100 and 110. For any given term, the formula is:
TF = term frequency
LF = lowest frequency
HF = highest frequency
(IF – LF)/(HF – SF)
That’s the distance, in percentage terms, from the low end to another term. Now, we just need to translate that into the font sizes:
SM = small font size
BF = big font size
100 + ((BF – SF)*(TF – SF)/(LF – SF))
That’s it! In this example, the answer is:
100 + ((110 – 100) * (15 – 10)/(27 – 10)) = 102.94
So, the tag “big” should be rendered at 103% and no tag will be rendered larger than 110% or smaller than 100%.
Now, to see my point, suppose the example is:
the (10) big (15) cat (270)
Your way:
The: 100%
Big: 105%
Cat: 360%
My way:
The: 100%
Big: 100.19%
Cat: 110%
Which makes sense considering that “big” and “the” are close in frequency compared to “cat” and “the.”
