你可能会说
给消息图标右上角加个未读数的红点
贴在图标或名字角上的那个小红点或数字
看一眼它长什么样
上面这些交互全部由 CSS 完成，没有加载任何脚本 —— 和真实产品里的组件是同一个道理。
大白话解释
徽标是缩在图标或者名字角落里的那个小标记，可能是个红点，也可能是个写着数字的小圆角块，比如消息图标右上角那个三。
它像给物品贴的便利贴角标：不占地方，但一眼就能看见，提醒你这里有新东西。它的工作只有一个，就是勾着你点进去。
正因为它唯一的本事是吸引注意力，所以用多了就废了。如果页面上到处是红点，用户很快就会全部无视，这跟没有提醒是一样的。
什么时候会遇到
- 看设计稿时，消息图标右上角有个红底白字的小圆圈，标注写着未读数。
- 产品要求数字超过九十九就显示成九十九加，不然会撑破那个小圆圈。
- 需求说清空消息后红点要马上消失，结果接口慢半拍，用户以为没生效。
- 发现徽标压在图标上把图标挡住了，位置和大小需要卡得很准。
- 跟 Agent 沟通时你说那个小红点，对方得先确认是徽标还是提示。
可以直接对 Agent 说
「底部导航的消息图标右上角加一个红色徽标显示未读数，超过九十九就显示九十九加，数字为零时整个徽标消失。」
「这个小红点现在把图标右上角挡住了，帮我把它往外挪一点，并且保证它在各种尺寸的屏幕上位置都对。」
「用户点开消息列表后徽标要立刻消失，不要等接口返回，先本地清零，避免用户以为没点成功。」
正文里带下划线的词，是本站其它词条的入口；这一篇自动链了 1 个相关术语。
最容易想岔的地方
常见的错误理解： 数字角标就写真实数字，有多少写多少
更准确的理解： 超过两位数就该收成「99+」。位数一变宽，图标和文字就被顶得错位，通知一多界面反而先乱
常见的错误理解： 小红点就是个提示，点不点无所谓，可以一直挂着
更准确的理解： 红点的意义是「这里有没看过的东西」。用户点完还不消掉，他很快就不信这个红点了，真有事时也懒得看
测一下：真遇到了你会怎么处理
单选 · 选完立刻看解释
消息图标右上角有个带数字的小红点。
它的作用是什么？
-
角标只做提示，通常挂在某个入口上，让人不点开也知道该注意它。
-
它一般不承担动作。点它通常是点到它挂载的那个入口，而不是它自己在执行什么。
-
那是骨架屏 / loading 的职责，跟「提示数量」完全是两回事。
题目只考「这个场景下的第一反应」，不考名词背诵 —— 徽标的定义在上面已经讲过了。