专栏名称: 交互设计学堂

系统学习交互知识，就找老D。干货分享、在线培训、行知书院三大版块帮你提升自己。最新资讯-全是干货还有老D点评，每天推送；交互培训-在线课程帮助小伙伴进入交互行业，只要3个月；行知书院-老D帮小伙伴们解读经典设计书籍，都是“硬”知识。

用“Z”型模式阅读网页的内容

交互设计学堂 · 公众号 · 设计 · 2017-06-25 19:51

正文

请到「今天看啥」查看全文

第二步，向页面的左下侧，创建一条对角线

最后，再次向右转，形成第二条水平线

当观众的视角以这种模式移动时，它形成一个虚构的“Z”字形：

“Z”型布局的一个例子。图片来源： Tutplus

这种模式是有效的，因为大多数西方读者会像扫描一本书一样扫描你的页面——从上到下，从左到右。

在哪里使用？

“Z”型模式的扫描发生在不以文本为中心的页面上（对于文本繁重的页面，如文章或搜索结果，最好使用“F”型模式（ F-Pattern））。这使得“z”型模式很好地解决了最小化复制及需要被看到的几个关键元素的简单设计。以主要围绕一个或两个主要元素为中心的简约页面或登录页面来实现“Z”型模式，鼓励用户遵循这种方法。

Z型布局在设计项目中是真正的闪耀，其中简约性和号召性用语是最重要的原则。

Facebook的登录页面是Z型布局的一个例子。