5大黄金准则,设计你的移动端邮件

移动设备上的邮件设计不仅仅是一个内容填充列表,它涉及诸多设计元素。

对于移动设备的设计从来不是一件简单的事情。人们采用不同的方式使用网络,我们需要考虑一个全面的方案,特别是在小屏幕上使用邮件。

让我们一起来探讨关于移动设备上的邮件设计需要考虑的问题,这些讨论并不意味着能够解答手机邮件设计上的所有问题,但这是一个好的起点。

1.保持简洁

严禁复杂—尤其是在邮件上。始终避免使用复杂的结构,否则在小屏幕上渲染时一定会失败。请记住许多设备是不支持媒体查询的(例如谷歌邮件),所以我们不能指望成熟的内容重排技术。

一个线性简单的布局在大多情况下都能表现良好。

邮件的整体大小也非常重要,如果它超过了预设的大小(大概100KB),你的邮件将不能完全加载。我在所有的客户端上都没有测试出这个问题,但是谷歌邮件和IOS设备出现了这个问题。

下面这张截图里,你能够看到用户是如何通过点击一个链接查看整个信息:这使得用户不必阅读全部邮件。

1425382039long_mail

阅读全文…

留白艺术,让你的设计有呼吸感

留白是艺术设计中需要遵循的重要视觉准则之一。网页设计中留白使元素之间保持距离,拥有呼吸的空间。下面放几招留白要点。

空白不代表无用

一些人可能认为页面上的空白越少越好,为了放尽可能多的文字,图片等信息,或者为了缩小整体版面。其实不然,页面上元素越多越容易混乱,让人找不到正确的阅读顺序(视觉流线)。所以页面需要充分的留白,当然过多留白也不好,需要找到一个平衡点。

一般来讲留白过多比留白过少要好一些。所以设计时多调整,看哪一种比较舒服。

artistic-credibility-in-web-design-03
阅读全文…

教你设计一个顶尖的“联系我们”页面

网站内页的模式有时候不完全一样,做出精致的独特内页需要花费额外的精力。通常我们把首页作为基本模板,以模板做网页非常方便,尤其是当网页内容还会不断扩展增加时。

下面举例说明如何设计一个崭新的联系页面,可用于个人网站,也可用于大一点的公司网站。本文内容侧重于创建精美联系页面的特定的趋势和设计技术。

简化联系表格

01-yummygum-contact-page-form-design

阅读全文…

那些让你过目不忘的HTML5页面

20150311213440800-630x360

来源:腾讯ISUX 

从引爆朋友圈的H5小游戏《围住神经猫》,到颠覆传统广告的大众点评H5专题页《我们之间只有一个字》,从2014下半年起,各种H5游戏和专题页纷纷崭露头角。“H5”,这个由HTML5简化而来的词汇,借由微信这个移动社交平台,正在走进更多人的视野。本文聚焦于基于微信传播的H5页面的视觉设计,通过一些案例分析来谈谈设计思路与方法,希望与大家进行交流探讨。

阅读全文…

你不得不关注的2015年网页设计趋势(下)

本文为下篇,上篇直达:你不得不关注的2015年网页设计趋势(上)

6.方框减少

网页设计师总是喜欢炫耀自己的思维能够跳出框框,而且能以不止一种方式跳出方框。姑且称之为“画一个框框然后证明你能打破它”理论。矩形显示器本身就是对网页设计师的束缚(别说你见过圆形显示器)。网页上的每个HTML元素也是方形的。

但是跟大多数人一样,设计师不喜欢被束缚。下面提供据我判断目前处于上升期的几个趋势,可以作为证明你不是矩形奴隶的长期战略计划。

就像不存在矩形边框一样去设计布局

1422939018Circles_Hexagons_Iirregular_Shapes

阅读全文…