现在的 UI 界面设计中，卡片式设计几乎无处不在，依旧是当前热门的设计风格。这种设计手法在加载速度、跨屏幕兼容上有着天然的优势，高度的实用性和较小的流量消耗使其成为移动端的宠儿。这篇文章将会总结卡片设计的八个法则，便于大家记忆并在实践中使用。
卡片是我们随处可见的 UI 小组件，选择它们的原因也很简单：占用很小的空间、展示足够的信息，在这么多信息中，你总能找到 1-2 项你需要的
为什么使用卡片？
1.卡片因其简洁的设计和良好的可用性而被广泛使用；
2.卡片可以作为详情信息的入口，可以展示更详细的信息；
3.卡片在视觉上是赏心悦目的，因为大多数卡片会使用图像，这些图像是赋予卡片视觉风格的主要元素；
（译者注：研究证明，图片本身能够提升设计的质感，而图片和卡片式设计的结合无疑能够让卡片本身对于用户的吸引力，再往上提升一个高度【前提是图得找对】）
4.卡片可以响应网页端和移动端；
5.没有太多认知负荷，卡片随处可见，用户对其相当熟悉；
6.它们使得界面简洁有序，推崇极简主义。
一、理解结构
卡片与物理上的卡片相似。可以把它们理解为容器，将内部的内容信息分组、分层级展示，整合组织起来。
二、阴影/点击态
阴影或是边框线有助于使卡片更加明显，具体使用哪一种视觉样式要视你的 UI 风格而定。
三、背景
卡片的另外一个优点是，可以随意配置背景的颜色，适用多样的视觉氛围，只要跟卡片放在一起不突兀就行。
四、字号和字重
文字越小，用户浏览的效率越低，用户需要花更多时间去辨认和阅读；文字越大，用户浏览的效率越高，用户可以快速识别内容。错误的使用字重会影响界面的可用性和美观度。
五、对比
卡片已经是最小层级的容器了，所以对比度在信息分层和优先级上起重要作用。
六、按钮
可以使用普通按钮、文本按钮或图标按钮。在垂直卡片上，按钮通常放置在底部上；在水平卡片上则是在右侧或底部。
七、信息空间排布
包裹着可聚焦元素的合适内边距（Padding），以及可以组织信息的足够空间(Space)
在可聚焦元素之间添加适当的空隙，也留足够的间距来对内部信息进行分组。
八、聚焦与悬停
鼠标滑过时，为了让卡片更加突出，通常的做法是给卡片加深一点的阴影或者将卡片位置稍微抬高一些。
原文连接：https://uxdesign.cc/8-rules-for-perfect-card-design-4fb7eef32e09
