网页排版设计怎么做留白？极简负空间视觉教程

ithinkimight

Shun Cutlery

Nate Hanson

我们需要将设计做得更加简洁。去年, 我们对极简主义的狂热追捧到了顶点, 并由此产生了与之相对应的、非常简洁的视觉设计风格。

这个风格体现在每一个细节上, 从 logo 的设计开始, 到名片的制作, 再到网站的呈现, 我们都在每一处都将简洁这一原则贯彻到底, 毫不妥协。今年, 设计师们将在视觉设计中融入并且增加更多的留白部分。毫无疑问, 这种做法将会把简洁设计这种风格推向另一个新的高潮。

负空间是一个非常重要的艺术设计方法, 很多人也都觉得没有必要把画布的每一个角落全都给填满。如果把负空间用到网页设计里面的话那么会产生非常不错的效果, 因为就不需要把那么多的元素全部都呈现到界面去, 而且人们也在慢慢地适应这个情况, 所以这是没问题的。

当我们在访问网站的时候我们是非常清楚自己到底需要什么的, 我们是希望不需要进行怎么样的搜索就能够直接找到目标信息的, 这也是很正常的预期。

我们的建议是, 你不要总是绞尽脑汁去琢磨怎么通过设计方案来凭空制造出所谓的空间感。你不如采取一种更为常规的设计手段, 先将原本页面所需的所有内容进行铺陈和摆放, 然后在此基础之上, 大刀阔斧地将那些多余的元素从页面上逐一削减掉。

当你按照这个思路去反复操作之后, 就会发现最终呈现出来的设计效果, 恰恰就是你所期望得到的那种样子。

它是那种桃粉色, 也是那种浅橘色。

manoscrafted

etchapps

fhoke

我们曾对众多web设计领域内流行的色彩进行较为细致的观察与剖析, 蓝色堪称是最为普遍采用的色彩选项之一种, 无论是用于构建企业形象展示的网站, 还是开发娱乐性质的在线平台, 只要在页面布局中适当点缀蓝色元素, 便极有可能创造出视觉上较为令人满意的网页作品, 甚至在过去的一段时期里, 乃至可能在未来持续发展的进程中, 我们同样对于呈现暗色调主题风格的网站怀有显著的好感度, 需要强调的是, 面对如此庞大且丰富的色彩资源库，在真正面临具体设计抉择的关键节点时, 这些先前的色彩应用经验完全能够为你带来具有实际价值的参考依据。

今年流行的颜色包括肉色、粉色以及浅橙色, 我认为这些色彩完全可以和任何彩色或者无彩色相互搭配, 它们看起来既显得沉静又不枯燥单调, 同时既有吸引人的魅力又没有过于张扬露骨的感觉, 所以我觉得很多人在今年的设计工作当中应该会把这些颜色运用上去。

建议：想尝试一下这些神奇的颜色吗？试试 #F97743 和 #F38268吧！

别看体积大块头大, 效果却是非常显著。

dmva-architecten

allanyu

这个内容是由ryanmichaelkelly提供的。

现在, 我们除了会设计传统的电脑显示屏之外, 还会设计平板电脑和手机。哪怕是在只有巴掌那么大的狭小空间里, 网站的内容也一定要清晰明了。有许多设计师在进行网页设计的时候, 往往喜欢采取加大字体字号以及放大图片尺寸的方法去应对, 可是这些手段说到底还不够新奇, 也不够大胆。

现在, 做更大些胆子的设计时机已经成熟。人们始终在进行常规模式的设计工作, 但眼前这种分辨率持续变高的现象确实存在, 支持出现的像素数量也同步增加。实际中大量印刷媒体领域积累的实操案例, 已然被引入到显示界面的设计过程里。此刻就需要把上述两类手段合并到一起, 顺势返回到网页设计的轨道上重新出发。

超大的设计具备吸引人们注意力的功能, 这与简洁的设计有着异曲同工的巧妙之处, 倘若存在体积庞大、占据视觉空间显著的物品或元素出现在眼前并引发我的关注, 那么我必定会首先将目光聚焦于此区域, 这种现象从本质层面进行分析, 或许就构成了我们摆脱日常生活中繁杂多样的信息噪声干扰的一种全新路径。

我们此前已经针对尺寸较大的图片进行过多番尝试, 接下来的建议方向是将注意力转移到文字的规格上, 具体可以尝试将文字的大小调整到介于64像素和72像素这一区间范围之内。

在此过程中, 推荐引入类似FitText这样的技术方案工具作为辅助手段, 通过这种方式来实现文字内容对不同分辨率屏幕显示尺寸的自适应动态匹配效果。

动态图片

socialdesignhouse

teehanlax

patrikervell

随着技术的不断更新和发展, 在Web设计里面去添加动态的图片、还有视频这样的东西, 现在变得越来越简单了。并且这个过程还并不会占用非常多的空间资源。

所以上面提到的那些元素, 在今后的Web设计理念里面, 会慢慢变成一种平常的、固定的状态。大家请想一想看, 有谁会希望说自己平时访问的网站, 看起来像是那种从霍格沃兹魔法学校那边传过来的呢?

动态效果具备强有力地吸引人们注意力的作用, 它们能够使得那些普通的图片以及滚动条变得富有魅力。当现在处于设计风格中的时候, 设计师不仅能够选用静态图片进行创作, 还可以直接应用动态类型的图片, 这一现状毫无疑问地为各位设计师开启了一片十分广阔的发展空间。

动态效果是我个人最为期待的一种设计发展趋势, 我在此刻不禁想要询问究竟有没有哪一位人士能够将这种动态效果运用得达到极致的境界呢?

我建议你去找一些有关HTML5视频部分的教程, 来好好学一下, 这样就可以开启你不一样的式设计了。

别再继续去使用那个所谓的图片库了。

这是一个英文的专有名词词汇。

neuarmy

artifactcoffee

大家早已不再在乎那些花里胡哨的时尚大片, 他们一心想要看清产品真实的详细信息。那种把产品图片直接放在纯白色背景上的简单风格早已被淘汰出局, 受众群体迫切希望透过表象去洞察产品独特的个性特征以及其背后蕴含的深刻故事。

网站, 仍然是在维系公司和客户之间的纽带。所以, 产品展示的真实性, 对于目标客户来说, 是非常重要的一个事情。因此, 一直只用那些单纯的产品照片, 或者是经过修饰过的时尚大片, 并不是一个好主意。

虽然大多数的人在进行网页设计的工作环节里面, 不能最终拍板决定使用哪种具体的图片内容了, 可是把咱们品牌的这种独有个性还有外在形象通过网络端去展示出来的这一件事情, 依然是十分之重要的。

所以我在这儿满心期待着能够见证到有那么多的网站运营主体们, 胆子变得更大一些, 更加愿意直接使用那些可以真实展现出产品原始样貌的图片材料, 并且把这些相关的资料信息进行一个深度的结合与汇总处理, 从而用这种方式去给浏览者讲述出来关于这个产品设计背后到底隐藏什么样的故事含义的。

大家建议说一定要去买一部相机, 或者是跟着一位摄影师来配合工作, 这么做的目的是为了能够获得那些和图片相关的作品, 而且这些相关作品的水平需要达到和web设计理念所要求相匹配的标准才行, 这这样一来是能够有助于把公司产品的销售数量提升起来的。

结论

Web设计这一方面, 还有时尚设计那一方面, 它们之间存在着非常多的相似之处, 那些看似非常遥远的设计理念和概念, 都有可能很快就会被落实到实际的行动中去, 我们要学会去把当下的潮流给融入进去, 共同来分享和体会设计所带来的那种美感, 敢于去尝试各种各样新鲜的事宜, 从而开创出属于未来的全新风格。

继续浏览有关 网页排版设计极简主义 的文章