web2.0中的tag及其技术实现

19 篇文章 0 订阅
17 篇文章 0 订阅
web1.0做网站
比如一个新闻网站 我们用一个新闻系统
主要的实体是article 那么表设计一般是这样
id title c_id content pubtime author hit
自动编号 文章标题 所属类别编号 内容 发布时间 作者 点击率
然后又一个实体 文章类别
id classname
自动编号 类别名称
具体的做法是网站的编辑上传一篇文章 同时选择一个分类 比如体育
这样整个网站的前台,体育栏目中就多了这条新闻

分类与文章之间的关系是一对多 就是一个类别有很多篇文章 一篇文章属于一个类别

web2.0时期
出现了一个概念叫做标签,正宗是叫tag

简单的做法:
tag表
id tagname num
tag-article表
id article_id tag_id
这样的tag-article表是tag和article的多对多关系
一般仍然是编辑人员 在添加文章的时候手动添加tag,或者从tag库中选取,或者程序从文章标题、内容中检索出tag库有的tag

那么从UGC的角度去看 这还是1.0的做法
改进的做法:
tag表
id tagname num user_id
tag-article表不变
这样在article的展示页面,有一个登录用户的添加标签入口
就是说随便一个网站的注册用户都可以对任何一篇article加tag

再谈谈tag cloud
这是web2.0中实现不同量级tag不同css的术语
具体算法如下:
@toptags = Tag.find_by_sql("select id,tagname,sum(num) as sumnum from tags group by tagname order by sum(num) desc

limit 0,60")
选取热门标签
@max=@toptags[0].sumnum.to_i
@min=@toptags[59].sumnum.to_i
@distribution = (@max-@min)/5
@toptags = @toptags.sort_by{|tag| tag.id }
重新将toptags按照id排序
这样才会看到正宗的web2.0热门标签
定义css:
<style>
.moltopiccolo { font-size: 12px; }
.piccolo{ font-size: 14px; }
.medio { font-size: 16px; }
.grande{ font-size: 20px; font-weight: bold;}
.enorme{ font-size: 25px; font-weight: bold; }
</style>
前台页面对每个tag处理:
        <% for @tag in @toptags %>   
        <% if @tag.sumnum.to_i==@min %>   
        <%     @css = "moltopiccolo" %>
        <%  elsif @tag.sumnum.to_i==@max %>
        <%     @css = "enorme" %>
        <%  elsif @tag.sumnum.to_i> @min + (@distribution * 2) %>
        <%     @css = "grande" %>
        <%  elsif @tag.sumnum.to_i> @min + @distribution %>
        <%     @css = "medio" %>
        <% else @css = "piccolo" %>
        <% end %>
具体效果见: 有趣吧热门标签
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值