当前位置:首页 > 经验学习 > 设计思想

以内容优先的理念设计移动产品

所属栏目:设计思想 时间:2013-12-26 来源: 作者:admin 点击:

知名Web设计师Andy Clarke最近发布了320 and up,开源快速开发模板Mobile Boilerplate的分支。这恰好和他之前媒体查询的样板(media queries)相反,新的样板从较大宽度样式下的小屏幕样式和图层集合开始开发,而不是开始于为小屏幕裁剪大宽度的样式。
这绝对是利用特定宽度样式的最好方法,在结合媒体查询或者JavaScript 之后。但当我看到对应特定设备宽度的像素值时,我有些紧张:320*480,等等。相比之依靠一个假想的宽度,比如960个像素,这当然是一个进步。但我担心的是,这依然只是为了匹配现在流行的显示窗口,而简单地堆砌显示内容。这也是Mark所说的,“被版面局限”了的设计方法( the “canvas in” approach ):
“我相信,为了迎合网页本地布局设计的需要(不考虑设备),我们不得不从版面布局出发,再考虑我们的内容创意。而我们需要的其实是反过来,内容优先来设计布局。”
如今,可能的情况是你的内容就是基于像素的(图像或者视频),而且它们的尺寸恰好适合特定设备显示窗口的大小。但根据我的经验,待处理的大多数内容仍然属于文字类。但像素却不是处理文字的最好单元。这也是我倾向采用基于字体大小(em-based)的媒体查询的原因之一。
我的基本观点是,媒体查询应该服务于内容。某些站点可能适合把直线型布局应用于小屏幕,而柱状布局应用于更大设备(比如平板电脑)的屏幕。对其他站点,即使平板电脑尺寸的屏幕,直线型布局却更适合。这都取决于内容。
我最喜欢的关于内容优先的一个例子,是Dan 的文章type-inspired interfaces。我认为网页设计者的一个共识是,设计都应该内容优先,但我们现在却过于依赖类似画布的工具,比如某些预先确定的网格类工具(predefined grids)。类似地,在框架和信息构架领域,当我们需要专注于内容时,我们经常不自觉地去首先设计菜单和导航界面。
这是最近《移动优先》作者Luke对Jared说的一段话,其中提到了他的设计原则“内容优先,之后才是导航”(“content first, navigation second”)。
Luke曾经广为人知地对互联网开发者宣传移动为先( mobile first )的方法。这种方法用于发现推送给用户的重要内容,的确非常适用。但不要太绝对,有时候这种方法也等同于“打印样式表优先”(print-stylesheet first),或者某种“非桌面环境优先”(non-desktop environment first)策略。正确应用的关键,还是在于你是否把内容优先放在第一位(you’re thinking about the content first and foremost):
“屏幕空间被无端占用80%时,你才被迫注意到留在屏幕上的,应该是对于你的用户或者业务最重要的特点集合。而不是一堆界面的碎片,或者可要可不要的内容。你应该明确什么是最重要的。”
但这不是说你不能把某些不太相关却很不错的内容放到屏幕上。但这应该添加到可能需要某种条件来延缓加载的部分,而不是一股脑地把厨房水池一类的信息放到开始界面上。
移动页面设计上,已经出现了一系列非常不错的典范设计。然而,传统桌面网页设计却成为了死气沉沉和自鸣得意的代名词。这导致的是一堆充斥着陈旧无聊内容的网站,就像 Merlin 的Flickr相册Noise to Noise Ratio 列举的:
“当然,这之中还是有一些非常不错的原创性内容,虽然隐藏在一堆广告、自助链接和附加新闻中。”
对,在图中接着找。负责地说,里面“的确”存在有用的内容,不是吗?





还有一点共识,就是移动用户是不能糊弄的。应该尽快给这些总是匆匆忙忙的用户所需要的内容。但它的推论不一定成立。为什么我们认为桌面用户就更能够忍受如此多不需要的内容呢?
不需要的页面冗余一般看做对页面的破坏,用户可以利用Readability,Safari’s Reader和Instapaper等工具绕开它们。这些工具的存在,一方面是为了从多个内容来源为读者聚合信息(free up content from having a single endpoint),另一方面也将有用内容从被滥用得令人窒息的页面容器中解放出来。这不是新的现象,当然,在RSS出现之前我们就在浏览信息。但这些阅读辅助工具也应该当做对我们的警告,或者挑战。我们怎么能用这样一个用户讨厌的方式来承载内容,以致于用户不得不求助Readability或者Instapaper。

请站长喝杯咖啡?

站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。

坚持免积分、免登录、无任何限制下载!如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!

标签:

你应该也喜欢这些吧

共有 0 条评论

给个评价吧

验证码: