网页设计何去何从 网页设计的设计趋向

2017-03-07 12:02 31 1 收藏

网页设计何去何从,网页设计的设计趋向有哪些?虚拟实境的话题从前年延烧到今年,科技巨头对虚拟实境的投资力道丝毫没有减弱的迹象,特别是Facebook 未来十年将砸下 30 亿美金专注虚拟实境的研发。一起了解下吧。

【 tulaoshi.com - 网页设计 】

网页设计何去何从 网页设计的设计趋向

  虚拟实境技术结合内容

  虚拟实境的话题从前年延烧到今年,科技巨头对虚拟实境的投资力道丝毫没有减弱的迹象,特别是Facebook 未来十年将砸下 30 亿美金专注虚拟实境的研发。可预见的是技术更臻成熟,也会有愈来愈多媒体或品牌运用虚拟实境科技「说故事」,为人们创造更身历其境的感受。

  不失真、载入快的 SVG 向量图档大行其道

  比起传统图片格式JPG、PNG、GIF 以像素构成,近年兴起的可缩放向量图片SVG 在网页上具有更大优势,以标记式语言(XML)组合图形,绘制矩形、圆形、线条都是小事一桩,复杂的填充、形状也难不倒它,也能轻而易举制作动态效果,而且不受解析度影响,无论利用什么萤幕、什么装置观看,都不会破坏图像品质。 SVG 胜出更关键的是,不需 HTTP Request,能够大幅提升网站载入速度。例如这个便是以 SVG 绘制的后背包。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/wysj/)

  巨大字体精准传达品牌意涵

  首页以巨大的字体呈现品牌主旨,也将是今年随处可见的风潮。不过「巨大」并不代表加宽加粗,而是以恰当的字体设计,言简意赅、精准表达产品精神,取代冗长赘言。而字体与背景或色彩互动、或者在字体上塑造动态效果,也是可以尝试的作法。

  打破框架的版面设计

  过去几年,一成不变的网页布局(layout)已开始令人疲乏,幸而Flexbox 以及CSS Grid!(Chrome、Firefox 预计于今年三月开始支援)等技术的出现,让版面设计变得更灵活弹性,为设计师、工程师带来更宽广的挥洒空间,今年将可看到更多网站打破惯有的「对称」、「秩序」守则,形形色色,层层叠叠的网页布局肯定精彩。不过不变的大原则是,设计的重点是要烘托「内容」,内容才是骨肉、才是人们光临网站的主因,因此设计的尺度上也需斟酌,天马行空之余,别反客为主,夺走内容的风采。

  创造小惊喜的「微互动」

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/wysj/)

  「微互动」在网页上也会愈来愈流行,比如滑鼠移过、点击各式网页零件如按钮,卷轴滑动过程中,适时出现细致变化,也能够有提示重点的作用。当然,就跟动态效果一样,设计师也要拿捏「动」的意义与幅度,才不致画蛇添足。

  极简out,色彩在跳舞

  色彩作为表达个性的重要元素,在极简风蔚为风潮时却被剥除,不过约莫去年开始,大面积渐层色块似有强势回归,Instagram、Asana、Stripe 都以饱和的渐层重塑品牌视觉主调,今年绚烂的色彩以及流动的渐层更将大行其道;此外,影像以双色调(duotone)后制,也可能会是今年的潮流。设计师,Sarah Hutto 预言,今年将会是很「funky」的一年,期待强烈的色彩刺激人们的视觉感官。与前两年的明亮轻盈、以及上述张扬鲜浓的色彩对比,以相对沉着冷静的黑色作为主色调也是愈来愈多网站的选择,只要「辅色」(accent color)搭配得宜,黑色一点也不沉闷,反而能在一片光彩的世界里脱颖而出。

  华丽且实用的动态效果

  动态效果在当代的网页设计领域扮演举足轻重的角色,今年也丝毫没有退流行的迹象,反而应用会更广泛。适当的动态效果,具有突出重点、争取注意力的用处,今年以 SVG、CSS 创造的动态效果预料将大幅增加,滚动视差(Parallax Scrolling)也愈来愈华丽。但设计师应考量品牌或内容的内涵以及每个动态效果的意义,避免「为动而动」。更多设计内容请查看: 厨房设计注意这些不吃亏

来源:https://www.tulaoshi.com/n/20170307/2617617.html

延伸阅读
说起 按钮 ,不得不先提一下链接,因为在大部分人看来,似乎按钮与链接差不多,都是完成一个页面的跳转。其实不然,按钮与链接还是有一定的区别。 先简单说说他们的区别吧。 按钮:按钮代表着做某件事,即点击了按钮代表着操作了一个功能,做的这件事是有后果的,不易挽回的。例如典型的google,QQ邮箱。像信息搜索、回复、注册,他们的共同...
标签: Web开发
以下是在网页制作时要注意的一些小问题: 1、20秒60kb原则 据统计,按目前网络下载速度(窄带),浏览者可忍受的时间大约为20秒,文件大小约为60KB,否则一页图文太大,没有人愿意等待。 2、设计工具选择 我个人观点是使用Micromedia出品的Dreamweaver。其功能强大,可以区分两大主流浏览器Netscape和IE各自所支持的语...
标签: Web开发
在网页设计的认识上,许多人似乎仍停留在网页制作的高度上。认为只要用好了网页制作软件,就能搞好网页设计了。 其实网页设计是一个感性思考与理性分析相结合的复杂的过程,它的方向取决于设计的任务,它的实现依赖于网页的制作。正所谓“功夫在诗外”,网页设计中最重要的东西,并非在软件的应用上,而是在我们对网页设计的理解以及设计制...
最终效果图 ipad电脑图片 #3a3a3a,#111111。以增加背景的层次感。 新建图层,用矩形工具拉出一个矩形框,使用渐变来填充矩形框。 用矩形选择工具选中ipad显示屏区域,添加一些好看的图片进去 文本区域看起来很单调,最好的方法是加入一些按钮与图标等,这里先加入以个圆角矩形按钮 加入一些图标 ...

经验教程

378

收藏

23
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部