网页设计师该向印刷设计学习的3件事-UI设计 PS-优质IT资源分享社区

admin
管理员
管理员
  • UID1
  • 粉丝29
  • 关注4
  • 发帖数581
  • 社区居民
  • 忠实会员
  • 原创写手
阅读:168回复:0

网页设计师该向印刷设计学习的3件事

楼主#
更多 发布于:2016-06-09 23:43



 
打印规划准则在页面上依然适用,它们会影响到字体、排版、空气,最直接决定了页面的规划质量
了解这3条经典准则,能协助你发明十分好、更易懂的页面规划。




很多经典准则,例如那些字体规划准则,在线上依然有用。图像由Peter Van
Lancker供给,www.flickr.com/photos/petervanlancker
规划即是特定功用的构成——不管构成物是字节仍是原子。这就意味着页面规划从它的先人——纸墨中获益良多。
本文中,咱们要点介绍几则打印规划准则,它们在线上依然适用。
熟练掌握后,你就能提高UI与UX规划水平,发明出十分好、更易懂的规划。
01. 让读者坚持专心
打印规划专心于易读性,页面上也是如此:仅仅把“读者”换成“用户”罢了。
方针应当是明晰的表达,并且让人能够轻松纵览全部规划。咱们来看几个从打印规划沿袭过来的概念。
排版
就像报纸,用户不会阅览网站上的每个字——至少一开端不会。正如免费电子书《为人眼进行页面UI规划》里边描绘的,环视页面是用户的规范做法。
为环视而规划时,有两种形式需求思考。首先是F形式。




F形式排版:Creative Bloq的主页
F形式反映了用户最一般的环视页面的方法。他们的视野从上面开端横向移动,然后沿着左面笔直移动,寻觅杰出的文字。
一旦找到激起他们兴趣的内容,他们又会开端横向阅览页面。
还有Z形式:




Z形式规划:MailChimp的主页
Z形式也是一种自然的阅览形式,一般用于报纸,页面上也是如此。用户在页面顶部水平阅览,然后向左下移动,在页面的下一行再次进行水平移动搜索。
文字
和打印相同,页面文字也应当有明晰的层次。挑选合适的字号,有助于关键字在页面上杰出,让用户更轻松的阅览页面。




明晰的文字层次:World Baking Day网站
咱们来看看文字层次中一些多见的层级:
首要:页面上最明显的文字更大更闪烁,招引用户的留意力。一般用于标题与装修。
非必须:介于中心的一切内容。不像标题那么明显,但要在页面的惯例文字中杰出显现。
再次:首要内容所选的文字。文字层次中的这一级,有助于运用户沉浸在正文中。
别的:更小的一级,运用斜体、粗体、下划线、不相同色彩等等。
合作运用,树立文字的层次,能够发明出次序,防止用户迷失其间。
要测验你页面的易读性,能够运用“3秒准则”:简略地阅览页面,然后看向别处。其间杰出的内容有没有反映出你规划目的?假如是的,那你方向准确,持续坚持;假如不是,则需求打回重新规划——也许的确如此。
02. 树立平衡感
不管平衡感来自于对称、非对称或是放射状,都是为了让规划发明出稳固与共同的感受。假如用户在你的页面上感到轻松,他们会更情愿逗留。
图像或文字不要过于密布:时间思考元素的空隙。排版倾向于简练——密布的规划会阻碍用户。双眼难以承受凌乱,使人更难承受信息的流通。
思考运用极简的规划,经过白色、黑色或十分深的背景和远景元素到达平衡。《为人眼进行页面UI规划》里讨论过,负空间的运用能够引导用户的留意力。




震慑的极简规划事例:鞋类品牌ETQ的网站
上面展示的ETQ网站,利用了负空间将视野引向所陈列的商品。页面底部对比明显的黑白色块,让用户挑选尺度或检查商品价格。
页面上很少搅扰信息,发明了一种安静与次序的感受——当然,也期望有助于促进用户采购。
03. 发明牢靠的规划
让你的规划关于一切用户都是牢靠的。不要运用两种以上的字体,保证一切年龄层的用户都能阅览。过于凌乱会打乱信息。
假如你发现自个在屏幕前不知所措,你的规划也许就包含了太多的图像。
挑选配色方案时也要时间为用户思考——假如是医院网站,运用镇定柔和的色彩;假如受众是青少年,则合适更明显的色彩。




UC San Diego Health的网站选用的配色很符合它严厉的内容
下面是一些书本规划中常犯的过错,相同适用于页面:
未经过满足的测验:一向要尽也许广泛对规划进行测验。内容也许会跨越多种前言(页面、电子书、打印品),这会使得文字有新面貌。并且,有些字体转换到新前言上也许会变得不易阅览。找到适用于一切情境的字体十分重要。还要思考你的规划在不相同屏幕尺度、不相同分辨率和不相同阅览器中怎么展示。
不恰当的语调:为每个页面元素挑选准确的语调。与字体相同,标题应当招引读者留意,副标题作为标题的阐明或弥补,正文要像一段友爱的对话——温暖亲切,让读者渴望了解更多信息。
不恰当的格局:遵从你所选的前言:不然,会一向浪费时间修正文件,应对CMYK用于打印、RGB用于网站这样的疑问。









优质IT资源分享社区为你提供此文。
本站有大量优质UI设计(含PS,软件 网页 平面设计等)教程视频,资料等资源,包含UI设计基础教程,高级进阶教程等等,教程视频资源涵盖传智播客,极客学院,达内,北大青鸟,猎豹网校等等IT职业培训机构的培训教学视频,价值巨大。欢迎点击下方链接查看。

UI设计教程视频
优质IT资源分享社区(www.itziyuan.top)
一个免费,自由,开放,共享,平等,互助的优质IT资源分享网站。
专注免费分享各大IT培训机构最新培训教学视频,为你的IT学习助力!

!!!回帖受限制请看点击这里!!!
!!!资源失效请在此版块发帖说明!!!

[PS:按 CTRL+D收藏本站网址~]

——“优质IT资源分享社区”管理员专用签名~

本版相似帖子

游客