深底色页面设计指南[译]
作者:西乔 来源:前端观察 发布时间:2009-08-06 18:16:00
深底色风格的页面设计很受欢迎,它可以创造出别致优雅、极富创造力的效果。
深底色设计适用于许多网站类型,但并非所有。这种风格应该在恰当的条件下使用。
虽然深底色风格可以带来视觉冲击力,但是很多设计师并不知道如何有效地表现他们,取得的效果往往适得其反。失败的设计会导致可读性差,难以吸引用户,无法使用传统的设计元素等问题。
所以在这里,我们将讨论一些深底色页面设计的要素,以便让你的下一次设计更受欢迎,更具创造性。
最新的调查表示,47%的受访者首选浅底色的设计, 主要原因是基于可读性。大多数人不喜欢阅读深色背景上的亮色文字,那样眼睛容易疲劳从而导致不适的阅读体验。
相比之下,10%的受访者倾向于深底色的网站,另外36%的认为将取决于网站类型而定。
那什么是正确的答案呢?虽然每个人都有自己的观点,但既然有如此高比例的用户可以忍受深底色的页面设计,有时甚至是他们的首选。我们作为网页设计师必须了解如何为我们自己和客户创建更有效的深底色设计。同时我们必须相信深底色风格可以增加其可读性和友好性。
使用更多的空白
在这里或许我们应该称之为“空黑”。
有效地利用空白,在任何设计中都是重要的,对于深底色风格而言更必不可少。
深色的设计令人感到“沉重”,拥挤的布局会加重这种感受。 看看一些流行的深底色设计,可以注意到他们运用了大量的空白。
网站 Black Estate 陈列了互联网上优秀的深底色页面设计,它本身也是一个值得关注的卓越设计。 其设计中运用了大量的空白,还有独到之处:有效地在某些重要元素旁边使用空白。
首先,用户会第一眼看见的元素——logo,旁边有大量的空白。 然后用户会注意到主内容区和右侧的酒瓶。 如你所见,空白完美地反衬出了内容区的主标题和酒瓶上的文字。
在Tictoc的设计中,精选内容及相关图片配合大片的空白共同构成。随着页面下移,我们可以发现空白越来越少,这样我们的注意力就会转移到缩展示的内容。
其关键是:空白可以逐步引导用户到页面底部
黑色背景增加了设计的纵深感。 网站非常依赖设计中的空白,配合黑色背景制造出来的创意效果,页面才如此吸引人。
网站 Mark Dearman的布局中应用了大量对称分布的空白。
每个内容区块间的空白提供了足够的呼吸空间,在用户视线浏览到下一区块前,提供很好的休息点。大量的空白是深底色设计中必不可少的,它能够令布局简洁,突出重要的元素,令整体外观更优雅。
猜你喜欢
- 作为python和机器学习的初学者,目睹了AI玩游戏的各种风骚操作,心里也是跃跃欲试。然后发现微信跳一跳很符合需求,因为它不需要处理连续画面
- 1.过程蜘蛛纸牌大家玩过没有?之前的电脑上自带的游戏,用他来摸鱼过的举个手。但是现在的电脑上已经没有蜘蛛纸牌了。所以…
- 唉,可怜呀,用了这么久的SQL今天头一次用到外连接,效果不错,方法如下: 使用外联接 仅当至少有一个同属于两表的行符合联接条件时,内联接才返
- 解决静态资源失效的问题这就需要修改我们的 config 中的 index.js了,默认的build 中的部分是这样的: build: { &
- 一、关系型数据库设计规则遵循ER模型和三范式E entity 代表实体的意思 对应到数据库当中的一张表R relationship 代表关系
- 好久没有更新过PyQt5相关的专题了,今天正好有空就做一个文件、文件内容检索的小工具。目的是为了能够很快的完成的在任意磁盘路径下找到我们需要
- 有时候我们的数据是按某个频率收集的,比如每日、每月、每15分钟,那么我们怎么产生对应频率的索引呢?pandas中的date_range可用于
- 1. 效果展示2. 游戏介绍经典的推箱子是一个非常古老游戏,甚至是80,90年代的回忆,目的是在训练你的逻辑思考能力。在一个狭小的仓库中,要
- FULLTEXT以前使用查找时都是以 %关键字% 进行模糊查询结果的,这种查询方式有一些缺点,比如不能查询多个列必须手动添加条件以实现,效率
- collections中defaultdict的用法一、字典的键映射多个值将下面的列表转换成字典一个字典就是一个键对应一个单值得映射,而上面
- 从98年某月某日我的第一个个人猪页诞生.到2008年的今天.宣告了我从事设计行业整整十年.十年,很多变化,从摆弄个人猪页到现在以做设计为生,
- 时间久了,注册用户和朋友数据库里的废记录渐渐多了起来,尤其是电子邮件地址,请问有什么好的办法可以快速安全地将它们删除吗?试试下面这个办法,它
- def Num2MoneyFormat( change_number ): ""&q
- 当你链接到应用程序以使用MySQL客户端库时,可能会遇到以mysql_开始的未定义引用错误,如下所示:/tmp/ccFKsdPa.o: 在函
- 看完本篇文章你可以:同步本地和服务器的全部或者部分文件本地debug,服务器跑实验在这之前你要确保服务器上已经创建好虚拟环境你本地已经安装好
- 本文实例讲述了Python求两个文本文件以行为单位的交集、并集与差集的方法。分享给大家供大家参考。具体实现方法如下:s1 = set(ope
- 以下的实例为去除指定表中数据类型是VARCHAR,CHAR,NVARCHAR的字段值中的不可见字符。 注释:此处只去掉前后的不可见字符,不包
- 在这里我们介绍两个拼接数组的方法:np.vstack():在竖直方向上堆叠np.hstack():在水平方向上平铺import numpy
- 区别1let和var用来声明变量,const用来声明常量。变量就是赋值后可以改变它的值,常量就是赋值后就不能改变它的值。当声明为对象时,可以
- 案例以论坛为例,有个接口返回帖子(posts)信息,然后呢,来了新需求,说需要显示帖子的 author 信息。此时会有两种选择:在 post