网页设计常规按钮 第1篇
什么事福格行为模型、在体验设计中。我们可以通过福格行为模型去深入的理解用户行为发生的原因。和影响用户行为的因素。从而提示我们产品的体验，和不断地优化我们的产品。
福格行为模型，它以BJ Fogg（斯坦福说服力科技实验室主任）命名。表明一个行为得以发生，行为者首先需要有进行此行为的动机和操作此行为的能力。接着，如果他们有充足的动机和能力来施行既定行为，他们就会在被诱导/触发时进行。
福格将人们的行为拆解为动机、能力、和触发条件三个要素。认为只要三个要素同时满足时行为才会发生。表示为B=MAT，其中B（Behavior）是行为，M（Motivation）是 动机，A（Ability）是能力，T（Triggers）是触发。
这个例子引用来自知乎子木牧先生_id=0
我个人觉得他的这篇关于福格行为模型写的很不错。下面大部分内容摘录于这篇文章内容。
举一个简单的例子，你看到朋友圈有人分享了水果的购买链接，最终你也下单购买了。这其中包含的动机、能力和触发分别是什么呢？
动机就是对水果的渴望，能力就是有时间，有金钱购买商品，而好友的朋友圈则是对购买行为的触发。
动机所谓动机，就是行为的出发点。动机可以分为3个类别：感觉、期待和归属感。总的来说就是为了什么你的目的是什么。
能力有了足够的动机之后，用户还必须要有能力来完成行为。能力包含了以下6个方面：时间、金钱、体力、脑力、社会偏好（社会的约定俗成、认知、从众等）、非日常（非日常的购物方式）。
触发条件触发就是行为的刺激点，引导用户行为的发生。在上瘾模型中，触发可以分为内部触发和外部触发。
在产品设计中，我们希望能够实现用户自主的内部触发，比如每天7点钟，用户都能主动打开到蚂蚁森林收取能量。当你拿起手机时，会不由自主的打开微信。但是很多时候我们都无法唤起用户内心的触点，只能依靠各种外部触发。例如购物过程中常见的各种促销活动的广告位，或者优惠券即将过期的提醒等。
动机、能力、触发条件、这三者的关系是什么呢。动机、能力以及触发条件会构成一条行为曲线，用户的动机越强，行为过程中要求的能力越简单，加上特定的触发情景，用户完成行为的几率也就越高。
这福格行为模型。我在网上整体看了看。很有意思的，他并不是一个针对设计的一个行为模型。而是只对于人的。一大的行为模型。当你明白他怎么说什么的时候可以把这个理论用到很多的方面去。比如生活，比如人际关系。比如怎么能够让你的朋友给你帮个帮。哈哈哈
本来这部分内容是要将各大厂的示例界面拿出来逐个说说的。但是这篇文章，本来是2023年12月份就要写完的。一直拖到2024了才写完。没有了当初的激情了。所以这部分示例就只拿我自己做的SaaS平台里面一个小业务模块的界面拿出来浅谈几句。
整个就不谈什么项目背景、业务需求呀，什么的。单纯从底层的原理出发。去浅浅的谈一谈这个很平常的界面。首先页面上方标题的切换、这很成熟的处理方式、在B端设计里也是很常见的至少有90%的界面是采集的这种切换方式。为什么其实很简单。就是因为他简单高效、而且放置的位置也是页面内容区域最明显的地方。
充值按钮、也是在你的视觉相对会集中的地方。而且他和下方的操作按钮也都在一个区域。整个界面其实就是对不同信息模块进行不同的划分和分区。这样去处理B端的信息、能够最大程度上解决界面信息混乱的问题。我个人觉得B端界面大部分都是像抽屉。或者像一个整齐的工作太。
说到这里其实还挺想说说、一直被才各种大佬提的B端C化的问题。有机会的话写一篇文章好好说一说我对B端C化的看法吧。
还是要不断的学习、不断的前行的。这篇完整开始写到现在应该有两个月了吧。从新开始的原因也很简单。我们公司的一个产品朋友。语重心长的和我说。你要明白你不能糊弄你自己。总之又开始前进了。
我是彪形大汉、KING UXD研究中心主理人。做自己觉得对的事，不断的输出价值希望我们顶峰相见。
网页设计常规按钮 第2篇
① 次按钮 常规按钮，用于非主要动作。如果不确定选择哪种按钮，次按钮永远是最安全的选择。② 主按钮突出“完成”、“推荐”类操作；一个按钮区最多使用一个主按钮。③ 文字按钮弱化的按钮，采用更轻量的按钮样式，可用于需大面积展示按钮场景，例如表格组件中的操作列。④ 图标按钮图标提供视觉线索，避免逐字阅读按钮文案，更高效地使用界面。-需要在较小的空间内展示尽量多的按钮。-使用纯图标按钮必须有 Tooltip 提示按钮含义。⑤ 在按钮中添加图标用于对按钮含义补充解释，提高按钮识别效率。
在三个大厂规范里他们对基础按钮的划分也差不多，只是他们出发的依据不一样而已。大同小异。你可以理解东西就那么多东西至于怎么划分。条条大路通罗马嘛。我个人感觉ant的按钮规范做的会更普世。其他两个平台的做的就更简单纯粹。
网页设计常规按钮 第3篇
在基础常规按钮之外还有那么一批特殊的按钮需要注意。虚线按钮、幽灵按钮
虚线按钮用于引导用户在一个区域中添加内容。
幽灵按钮 置于复杂或较深的背景中，避免按钮突兀地破坏背景的整体性。该场景下可灵活定制样式。
按钮的布局位置也是一个很讲究的事情。我们现在基本大厂的规范也都是从一些基础的概念出发所延伸出来的解决方案。所以我们了解了解这些普通的概念还是很有必要的事情。
网页设计常规按钮 第4篇
在我要写这篇文章时，在网上翻找资料。于是乎就发现了在我们现在很多很常规的界面设计里面。各个元素的位置是有很多基础概念做理论支撑的。下面我们来了解一下这些有趣的概念吧。
古藤堡法则或者原则，剧说是由14世纪西方活字印刷术发明者古藤堡提出的。他这个原则大概意思是人们在阅读时遵循这某种习惯。从左到右、从上到下。（其实吧，我在网上搜了搜，感觉这个法则也需存在。但不一定是古藤堡提出来的。百度百科也没有说有古藤堡法则或者原则这一说。而且我百度了一下。最早出现这一说法的是0几年的一篇文章里。说古藤保法则对网页排版有帮助）
我们暂且就先相信这些基础的规则是古藤堡提出来的。那么根据他的这些原则，得出了我们现在熟知的一些理论。（这里吐槽一下。从左往右是近代西方传进我国的。我们国家的书籍是从上到下从右往左，新中国成立之后才采取了我们现在的这种阅读方式和习惯。）根据古藤堡原则我们可以得到一张古藤堡图。
在这张图中、把我们阅读的过程用四个区域进行了划分。第一视觉区、强休息区、弱休息区、终端休息区。这张图所表达的是在我们的阅读过程中我们的注意力在不同的区域是有强弱之分的。
有了古藤堡原则和他的这张图、我们发现在我们视觉阅读信息时对不同的区域的注意力是不同的。所以我们在设计的时候。会将主要的信息放到注意力强的位置上去。
比如在写一些文件时。我们会把日期和签名放到右下角的区域。在B端页面中我们会经常把标题放到左上角、然后把按钮放到右下角去展示。这些都和古藤堡原则有很大的关系。
菲茨定律是对人类操作过程中的运动特征、运动时间、运动范围和运动准确性进行了研究。所总结出来的定律。我们简要的介绍一下这个定律。
简单的说费茨定律说的就是、我们在操作的过程中。距离越短、目标越大、用时越少。具体说一下费茨定律指的是，使用设备（比如我们的鼠标）到达一个目标（比如按钮）的时间和下面两个因素有关系。
01、设备当前的位置离目标位置的距离（D）。距离越长、所用时间越长。
02、目标的大小（S）目标越大，所用时间越短