这算是比较跟数位行销相关的心得。 前阵子把 Nowill 的「好感度 No.1 的网页设计：RWD 不出槌法则，网站在任何装置都完美呈现」给读完了，是一本 4.5 颗星好看的书，里头提到的 web font 解决方案我有去试，其中一个就是 Fonts.com，因为 Fonts.com 里头有繁体中文的网页字体，只可惜速度很慢就是了，并不实用。 在测试 Fonts.com Web Fonts 的过程中，我发现他们的 call for action 设计非常有趣，请留意下图中那些「Start a free plan」按钮所出现的次数： 图1：http://blog.zeals75.com/?p=30622#img1 令人惊讶地，Fonts.com Web Fonts 的 call for action 按钮在同一个页面竟然出现到 9 次这麽多，每一个 section 都有 call for action。 我回想当时自己的这段 user journey，我就是进入 Fonts.com Web Fonts 的首页之後，沿着 section 往下看，看到中段时，开始发现有「Start a free plan」按钮，再几个 section 之後，我又看到「Start a free plan」按钮，当时我的心动指数是不断提昇的，在浏览的这个过程中，一连串的 call for action 按钮，彷佛有个人在我耳边不断地怂恿我「快行动吧！快行动吧！」 然後我就真的行动了！真是个成功的设计。 也许 Fonts.com 就是如此坚信 user 会有这种跳跃式的卷动扫视行为，所以才不愿意错放任何一个可以说服 user 采取行动的机会。我认为这种连续性的 call for action 设计，不光是从行销面有实质帮助，从 UX 面也是另一种思维，我的角度是： 图2：http://blog.zeals75.com/?p=30622#attachment_30625 从上图中你可以看见，在观看这个 section 时，你的眼球很自然地会先落在左上角的标题和右方的图示上，接着才是左边的内文，而且我相信大部分的「网路逛街者」都是视觉动物，更不用说那些不谙英文的人，更是只看图和找按钮，以 Fonts.com 是做全世界的生意来说，把 call for action 按钮放到图示的下方，我觉得是很合理的设计。 若你又仔细看上图的话，Fonts.com 的 section 左侧下方其实也是有个按钮，叫做「Learn more」，这个位在段落尾巴的「Learn more」并不属於 call for action，而是使用者阅读文字动线的一环，有点类似 Apple.com 那种一直不断在每个 section 给你「进一步了解」的设计手法： 图3：http://blog.zeals75.com/?p=30622#attachment_30627 前面提到，Fonts.com 选择将 call for action 放在图示的下方，将 read more 放在段落的下方，这种切分的手法，等於同时满足了这两种 user 的需求：一个想好好看，一个急着找解决方案。 －－－分隔线－－－ 除了 Fonts.com 有这种连续性 call for action 设计之外，我也在 responsive CSS framework Gumby 的网站上看到同样的手法（Gumby 我是经由乐在设计才知道的）： 图4：http://blog.zeals75.com/?p=30622#img2 上图「Download Gumby」的按钮出现了 6 次，而且很棒的是 Gumby 有加 icon，不但可以让 user 潜意识觉得网站整体比较有质感，而且还尽可能地让网站跨越语言的限制，让不谙英文的 user 也能轻易发现 download 按钮的位置。 提醒：切图已死，用 Font Awesome 做 icon 就好罗！ －－－分隔线－－－ 有连续性 call for action 设计，当然也有不连续性的，像 KKBOX 就是只放头尾： 图5：http://blog.zeals75.com/?p=30622#img3 中间 4 个 section 都没有任何的 call for action，我觉得算是「特别」的设计，也许人家有人家的考量，不想让按钮去破坏画面之类的。也也许他们相信如此的 section 安排，是会让 user 一口气卷到底然後按下 call for action 的。 另外一种 call for action 位置设计，则是像 Spotify 把它固定在 navigation bar 上面，无论 user 浏览到哪里，call for action 也总是在上面等你： 图6：http://blog.zeals75.com/?p=30622#img4 除此之外，call for action 当然也会在头尾出现。但我觉得这种 nav bar 的 call for action 设计在动线上比较「不顺眼球」，因为眼球总是由上而下地看，把重要的 call for action 放在最上面的位置，是否会因此错失掉一些机会了呢？也不一定。我现在反而认为，按照 user 扫视浏览的习惯，call for action 就是多多益善。 反正从来没有 user 会把你的网页给从头到尾看一遍，还倒不如珍惜每个相聚的机会。 -- 更多文章：http://blog.zeals75.com 热情先决 --

※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 223.139.34.92 ※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Marketing/M.1423568208.A.5FD.html