网络编程
位置:首页>> 网络编程>> 网页设计>> 深底色页面设计指南[译]

深底色页面设计指南[译]

作者:西乔 来源:前端观察 发布时间:2009-08-06 18:16:00 

标签:设计,页面风格,文字,颜色

深底色风格的页面设计很受欢迎,它可以创造出别致优雅、极富创造力的效果。

深底色设计适用于许多网站类型,但并非所有。这种风格应该在恰当的条件下使用。

虽然深底色风格可以带来视觉冲击力,但是很多设计师并不知道如何有效地表现他们,取得的效果往往适得其反。失败的设计会导致可读性差,难以吸引用户,无法使用传统的设计元素等问题。


所以在这里,我们将讨论一些深底色页面设计的要素,以便让你的下一次设计更受欢迎,更具创造性

最新的调查表示,47%的受访者首选浅底色的设计, 主要原因是基于可读性。大多数人不喜欢阅读深色背景上的亮色文字,那样眼睛容易疲劳从而导致不适的阅读体验。

相比之下,10%的受访者倾向于深底色的网站,另外36%的认为将取决于网站类型而定。

那什么是正确的答案呢?虽然每个人都有自己的观点,但既然有如此高比例的用户可以忍受深底色的页面设计,有时甚至是他们的首选。我们作为网页设计师必须了解如何为我们自己和客户创建更有效的深底色设计。同时我们必须相信深底色风格可以增加其可读性和友好性。

使用更多的空白

在这里或许我们应该称之为“空黑”。

有效地利用空白,在任何设计中都是重要的,对于深底色风格而言更必不可少。

深色的设计令人感到“沉重”,拥挤的布局会加重这种感受。 看看一些流行的深底色设计,可以注意到他们运用了大量的空白。

网站 Black Estate 陈列了互联网上优秀的深底色页面设计,它本身也是一个值得关注的卓越设计。 其设计中运用了大量的空白,还有独到之处:有效地在某些重要元素旁边使用空白。

首先,用户会第一眼看见的元素——logo,旁边有大量的空白。 然后用户会注意到主内容区和右侧的酒瓶。 如你所见,空白完美地反衬出了内容区的主标题和酒瓶上的文字。

Tictoc的设计中,精选内容及相关图片配合大片的空白共同构成。随着页面下移,我们可以发现空白越来越少,这样我们的注意力就会转移到缩展示的内容。

其关键是:空白可以逐步引导用户到页面底部

黑色背景增加了设计的纵深感。 网站非常依赖设计中的空白,配合黑色背景制造出来的创意效果,页面才如此吸引人。

网站 Mark Dearman的布局中应用了大量对称分布的空白。

每个内容区块间的空白提供了足够的呼吸空间,在用户视线浏览到下一区块前,提供很好的休息点。大量的空白是深底色设计中必不可少的,它能够令布局简洁,突出重要的元素,令整体外观更优雅。

0
投稿

猜你喜欢

  • 修改文件的名字 使用“FileSystemObject(文件系统对象)”的GetFile函数得到一个“文件对象”,然后修改这个“文件对象”的
  • 在微软的ASP编程体系中,ADO对象的建立,使得从网页访问数据库成为一件易事,特别是ADO的Recordset对象使得控制数据的输出显示更为
  • 兼容主流浏览器,独立样式表,可以很方便的进行视觉效果自定义截图:模拟下拉菜单演示代码:<!DOCTYPE html PUBLIC &q
  • 阅读上一篇:[译]Javascript风格要素(一) 我们使用习惯用法可以使我们的意图更加的清晰和简洁。使用==时,当心强制转换考虑下面函数
  • <!--#include file="strcheck.asp"--> <% '笔者在写程序的
  • 每位SQL Server开发员都有自己的首选操作方法。我的方法叫做分子查询。这些是由原子查询组合起来的查询,通过它们我可以处理一个表格。将原
  • 本文详细列出了HTML中使用到的各种鼠标事件,如onclick,onmouseover等;页面相关事件如:onerror,onload等;h
  • 在使用Ajax过程中,有时候总会遇到一些难题,浏览器兼容、编码、IE下的特殊处理等等,偶尔会搞的人头昏脑胀哭笑不得,这里列一些小贴士,或许有
  • 众所周知,透明的PNG图片在IE6中是不透明的。为了在IE6中显示透明的PNG图片,找了一下方法,在网页中嵌入JS语句,可是执行效果并不尽如
  • 九宫格是一种比较古老的设计,它最基本的表现其实就像是一个三行三列的表格。其实它最初是在window的c/s结构中用得比较多,比如我们经常看到
  • 我的PJBlog在从2.7升级的3.0的时候,犹豫了很久。升级到PJBlog3.0就是看中了新增的静态页面功能,但是同时又担心造成博客出现大
  • 把程序放到一个文件中,然后包含再call就可以了。(JMAIL4.3)<%'警告函数sub w_msg(messag
  • 写入:1:把gif图像文件读入内存(一个变量strTemp)。2:写入数据库。Dim binTmp() As ByteDim conn As
  • 最近在D4得到一本(美) Penny Mcintire写的《Visual Design for the Modern Web》.突然觉得可用
  • 这十则CSS技巧汇编于网络,作为老手已经司空见惯了,也没有什么新意,但温故而知新,或许阅读一遍也有一定的启发,本文主要面对CSS新手朋友,有
  • 如果你计划将数据库从SQL Server 2000 升级到 SQL Server 2005。你在升级之前一定会测试每样东西,并且证明应用程序
  • 在Web开发中,JavaScript的一个很重要的作用就是对DOM进行操作,可你知道么?对DOM的操作是非常昂贵的,因为这会导致浏览器执行回
  • 不知不觉2008已经走到了尽头,在这近一年中,一直不断的尝试用ExtJS做项目,从1.1到现在的2.2,吃了不少苦头,也有不少收获,总结一
  • asp压缩access数据库,具体asp代码见下: Class DatabaseTools   &n
  • 保持良好的代码风格是每个Coder必学的课程,同样在HTML设计的时候也要特别注意代码的规范性,虽然说不规范的代码不会直接造成严重的后果,但
手机版 网络编程 asp之家 www.aspxhome.com