NOTE：本篇文章讨论的标签系统设计和设计一套数据库标签系统是不同的，本文针对的是UI/UE设计为基础设计标签，注重的是标签的表现形式和标签界面如何和用户进行交互。不同于设计数据库标签系统，是注重标签之前的以及表的管理的逻辑关系。阅读本文的时候需要注意这一点。
什么是标签？
举个简单的例子，在自然语言当中，当我们提起“名片”这个词的时候，就会主动联想到带有一个人的电话信息，公司信息，姓名等个人信息的90X54mm的纸质卡片。“名片”就可以称之为这个纸质卡片的标签。当标签和内容，物品，事物关系变得复杂的时候我们就需要一个标签系统了。
豆瓣电影标签系统
我们为什么要设计标签系统？
接着上面名片的例子，如果我们向另外一个人询要名片的时候我们肯定不会说：“您能给我一张带有您的姓名，电话信息以及公司信息的卡片吗？”我们肯定会说：“您能给我一张您的名片吗？”由此看出，标签作为一种代词，可以大大的缩减沟通成本。我们将这些已经提前封装和制作好的内容或者物品，贴上一张标签，就可以方便我们的日常沟通和交流了。比如一本书，一个电视节目或者一个网站他们都会有一个或者更多的标签，方便在我们想提起他们的时候有一个准确的名字称呼他们。
值得注意的是，我们人与人交流的时候会使用一些代词作为标签，这是在人与人面对面交流的情境下成立的，因为我们可以通过观察对方的表情，听取对方的语气来判断对方说的是什么东西，同时我们也可以通过自身的反馈来告知对方自己是否理解他的意思，整个对话交流的过程是连续的。然而当人与机器界面进行交互的时候这个过程就是时常中断的，因为机器没有表情和语气的反馈，机器也更加不会知道我们是否理解它所表述的东西，所以在进行界面设计的时候我们十分有必要讨论一下我们的标签系统应该如何设计，通过设计来降低人与机器沟通中断所带来的影响。
标签系统的合理性标准应该是什么？
豆瓣图书热门标签
这里以豆瓣图书热门标签为例，说明标签系统设计过程当中几个需要注意的关键点。
每一个标签都要有足够的代表性
每一个标签都应该有足够的代表性，比如说“小说”我们就知道这个分类下面的图书内容都是故事情节很强的图书，“传记”我们就知道这一分类的图书都是关于一个人物的生平记事的内容。
标签要做区分
豆瓣当中有很多标签，所以我们需要对标签进行区分，把有相似性的标签组织在一起，这样用户更加容易识别和辨认。比如豆瓣图书热门标签里就对不同的标签词汇进行了分类，方便用户快速浏览。
是否应该使用特别专业的词汇？
这是一个关乎用户，需要将思考点放在，用户，内容，情景三个方面进行分析的问题。如果选用的标签词汇和面向的用户群体差距过大，及用户不知道这个标签表达的内容是什么。这样就会给用户造成很大的困惑，导致标签系统的设计失误。
标签需要让用户留下好的印象
印象是相对玄学的东西，当用户点击你设计的标签的时候应该让用户了解和意识标签背后是他真正想要的东西，标签背后所展示的内容应该是和用户心里想的一样的。比如当我们点击“小说”标签的时候，豆瓣总是可以推荐给我们这个世界上最优秀的小说作品。
豆瓣图书小说标签
界面设计上都有哪些标签的表现形式呢？
标签的形式一般分成两种，一种常用的是文字型的，另外一种是图标型的。相对来说文字型标签在web界面上比较常见，图标型的标签在现在的移动端上比较常见。这里我们讨论常用的文子型标签，因为图标型标签，在应用的过程当中有一定的局限性，比如古代的时候各个军队会有不同的图腾和旗帜，如果以姓氏作为旗帜很容易被自己人和敌军辨认，但是使用图腾作为旗帜，如果你是个新设计的旗帜别人肯定很难知道你是谁。关于图标型标签一般会和文字性标签混合使用，我们日后再讨论他的应用。
情景链接式的标签
百度百科的情景链接式标签
我认为最具代表性的就是百度百科的标签了，这类标签常常在文章的内容当中，他们作为一个单独的词汇可以在不同的词条当中建立链接，这种标签很易于让用户留在网站当中跳转和浏览。只是当跳转次数太多的时候，我们就很难再回到最初的位置了。
标题
是的，标题就是一个很明显的标签，当我们写一篇文章那个的时候，它的标题就可以准确的代表这篇文章的内容。
导航系统
亚马逊的导航系统标签
标签系统可以有效的组织网站的信息内容，比如像亚马逊这种电子商务网站拥有众多的产品类目，为了方便浏览就会设计导航系统。
索引术语
搜索一些内容所使用到的关键词和搜索词。比如我们在淘宝搜索“袜子”那么淘宝就会返回给我们所有关于袜子的产品，我们将这样的关键词称之为索引术语。（相对专业的说法）
我们应该如何设计标签系统了？
前面啰嗦了很多是希望各位阅读者可以了解标签系统的概念和目的，这样才更加容易理解我们下面想要说的内容。
一些基本原则
标签代表的范围不要太广泛
标签代表的范围应该窄一些，比如男士袜子就会比袜子代表的内容更加窄，这样更加便于检索获得更好的结果。
标签需要有一致性
zol标签一致性
比如在我使用zol在线的筛选器去检索手机的时候，筛选器上提供的标签都是和手机的参数相关的，这些标签一定都是和手机相关的代词。这样用户查看和使用的时候才不会困惑。
标签的版面与样式
比如说价格标签，我们在设计价格标签的时候从1000-1500元 使用相同的连接线，而不应该500——1000元或者1000-1500元。同时标签的字体，字号，颜色，间距都应该保持一定的规范。
语法问题
比如体育项目“打篮球”，“踢足球”这样的分类，如果是动词+名词的形式那么所有的标签内容就都应该是这种形式，标签系统是“篮球”，“踢足球”这样词语组成形式不准确的是错误的，这么错很难统一规范还会对用户识别造成困扰。
很难注意的粒度问题
首先解释一下粒度这个词，粒度是用来衡量矿物质颗粒直径大小的一个词，（嗯，我是地质大学毕业的~~~）我们用它来描述标签词汇的长短问题。比如叫外卖的标签：“餐厅”，“中国餐厅”，“必胜客”，“西式餐厅”将这些意义相近粒度不同的词汇放在一起的时候，就会感觉很奇怪，其实这些词好像并没有挤在一起的必要。
豆瓣电影标签系统
我们看豆瓣电影的标签，只会在标签下面表明“1994/美国/犯罪/剧情”只要抓取关键字就可以了，完全没有必要说明这是1994年的电影，美国电影，犯罪电影，剧情电影。我们只要表达，简洁的词汇就可以，“中餐”，“西餐”
这样就可以了。
理解性和用户
这里我们需要再次强调，只要和信息架构设计相关的内容，比如标签系统设计，我们就需要考虑到用户，内容，情景的问题，将自己带入到这个场景当中去判断，用户是否可以理解我们设计的标签的词汇。
标签都放在网站的什么地方？
页头
页头
中间内容
中间内容
页脚
页脚
几乎涵盖网站整个页面，不过他们主要还是出现在头尾和内容检索位置。这些关键的标签信息应该在开始和结束的位置不对吗？
简单的标签系统设计方法
表格设计法
表格标签设计法
我们可以将标签的名称，点击标签跳转到的页面的标题以及标签页面html里面的<title>的内容提取出来制作一个表格。
这样我们就可以知道，点击不同的标签从那个页面跳转到那个页面，并且这个页面的标题内容是怎样的。除了让用户使用的时候更加清晰，也比较有益于SEO的优化。
类似网站竞争对手参考
如果你的业务和类似的网站或者竞争对手的网站分类方式相近，直接参考他们的设计方案好了，简单、高效、明确易于用户理解和学习，比如京东商城，淘宝天猫，亚马逊，他们的分类导航几乎都是一样的。
京东商城
亚马逊
电商类网站借鉴这些用户普遍接受的标签设计可能会是一种很好的选择，标新立异才会有风险。
使用专业词汇表
zol专业词汇表
比如zol在线手机页面，上面所有的标签都是数据的详细参数，经常来查看数据的用户肯定都是对手机有一定了解的用户，直接使用描述手机配置的专业词汇进行分类筛选会是一种很好的选择。
自己创建新的标签系统
很遗憾，如果你设计的网站分类标签系统和其他网站都不相似，并且你是独一份，那么你何有可能就需要自己去设计这些分类系统了。
首先我们应该先制作一个词汇表，这个词汇表词汇来源于对网站信息内容的分析、内容作者的提供、以及用户代言人提供的建议。
网站内容分析
现在有很多程序可以根据文章内容自动抓取分类信息，提取网页内容的关键字作为分类标签会是一个不错的选择。
内容作者提供
内容作者提供标签是一个不错的选择，比较符合SNS的观念，所有的内容都由用户提供的，这个老概念恐怕很多人都忘记了，这很有效。
标签系统
比如我在segementfault上提问的时候，我就可以为我的问题创建标签，或者使用系统已经创建好的标签，因为在大的语言认知范围内，我们很有可能会有重复的认知标签，这就让很多松散的用户找到了共同点。
共同标签
用户代言人提供的建议
这个其实更加类似需求分析的方法，假设你想了解学生的需求，你可以不去问学生，而去问老师，因为学生不一定了解自己真正的需求而老师可能会了解。自己制作标签系统是一样的道理。我们可以询问一些用户的代理人，来获得标签词汇表。
总结
标签系统设计的过程当中要有基本的准则和规范才能设计出良好的标签系统，另外值得注意的时候标签系统的目的是让机器和人建立良好的沟通机制，人的认知是会变化的，所以我们的标签系统也应该跟随人的认知一起去更新和变化才会有适合用户的标签系统产生。
网友评论