网站的视觉路径和版式设计
作者：tony 来源：懒得设计 发布时间：2008-04-15 14:35:00
cooper谈到用户的视觉路径一般是：从上到下，从左到右。
好的视觉设计路径应该是顺应这样的用户习惯，糟糕的设计会让用户无所适从，焦点到处都是。
当然，上图的视觉路径图并非绝对的，浏览习惯因人而异。
网站中方块
因为人们从接触信息以来，信息的呈现就是以方块式存在：报纸、书，单个字成点，一行字成线，一段字成面，而这个面当然是以方形呈现的效率最高。网站的视觉设计大部分其实都是在拼方块。
网站中的方块能很好地引导用户的视觉路径，用户可以通过区块来分辨这个区域的信息是否是自己需要的，从而可以迅速缩小范围细致寻找或者浏览下一个区块，比如yahoo的首页，从大块上来看，用户很容易分辨出4个大区块，每个区块里面又有小的区块。
方块感越强越能给用户方向感。
方块越少越好。
尽量用留白做视觉区分。
对齐和间距
视觉设计最简单，也是最容易忽略的就是对齐。检查的方法就是查看每个方块中的边线，方块与方块之间的边线，尤其是纵向维度。
间距的一般规律：字距小于行距，行距小于段距，段距小于块距。检查的方法可以尝试将网站的背景图案、线条全部去掉，看是否还能保持想要的区块感。
拿淘宝的新首页举个细节的例子(右边是我调整后的)。有时候我们不需要花心思做多么漂亮的图标和颜色搭配，用心地调整好网站的每一个像素或许也能让它焕然一新。
主次关系
怎么对用户引导的关键就在于怎么处理主次关系。说白了就是对比，从视觉的角度上看：形状的大小，颜色，摆放的位置都会影响信息的重要与否。
从大的区块来看，不要平均分割页面，三栏的设计应该让其中一栏明显短一些。
从局部来看，也要把握信息呈现的节奏，比如yahoo中间新闻栏的设计，大图带大标题是第一要点，小图带字是第二要点，纯文本第三，节奏感、主次关系非常强。
常见问题
视觉设计师不懂代码，前端设计师在视觉方面又不专业。常常是实现出来的产品跟视觉设计出来的图片有所偏差。建议视觉设计师跟进调整。
广告图片破坏视觉效果。如果网站足够牛的话，可以让广告方遵循视觉规范。如果不行的话，起码设计师还能决定广告的尺寸，位置等等。
写这篇文章刚刚赶上4月份新浪、腾讯、淘宝的首页改版。单纯从视觉设计的角度上看，腾讯非常清爽，很用心。
0
投稿猜你喜欢
死锁的原理非常简单，用一句话就可以描述完。就是当多线程访问多个锁的时候，不同的锁被不同的线程持有，它们都在等待其他线程释放出锁来，于是便陷入- 360搜索引擎自动收录功能，官方提供了代码，带式，十分坑爹，没有提供批量提交入口，只是提供了一段js代码，关键是 一个js去下载另外一个js
- 在Python中可以通过几种方法调用C++的函数，这里介绍使用ctypes的方法。ctypes是Python自带的一个模块，能够直接载入C+
- 本文实例分析了Python星号*与**用法。分享给大家供大家参考，具体如下：1. 加了星号（*）的变量名会存放所有未命名的变量参数，不能存放
- [原文地址] VS 2008 Performance Improvements[原文发表时间] Thursday, September 27
- 1. CBV加装饰器CBV加装饰器有三种方法，案例：要求登录(不管get请求还是post请求)后才可以访问HTML代码index.html&
- 首先要解释一下：“极致之美”不是说月儿的这篇文章，因为本人还没有自大到这种程度:P，它形容的是Lisp和javascript结合的优美形态。
- ALTER TABLE 表名字 ADD CONSTRAINT pk_表名字 PRIMARY KEY( SNumber, SDate ); S
- 这篇文章主要介绍了Java正则表达式Pattern和Matcher原理详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参
- 本文实例讲述了Python扫描IP段查看指定端口是否开放的方法。分享给大家供大家参考。具体实现方法如下：#!/usr/local/bin/p
- 本节内容0、列表常用功能汇总1、定义列表2、访问列表中的元素3、切片4、追加5、插入6、修改7、拷贝8、删除9、扩展10、统计11、翻转12
- 创建索引：MySql创建索引的语法如下：CREATE [UNIQUE|FULLTEXT|SPATIAL] INDEX index_name
- 认证系统auth auth模块是Django提供的标准权限管理系统,可以提供用户身份认证, 用户组和权限管理。auth可以和adm
- 目录支持多种类型的过滤避免多个范围查询优化排序理解索引概念最简单的方式是通过一个案例来进行，以下就是这样的一个案例。假设我们需要设计一个在线
- 1、先去官网下载mysql 安装包https://dev.mysql.com/downloads/mysql/2、下载完后解压到你想要安装M
- 大家都知道，数据库的安全性是很重要的，它直接影响到数据库的广泛应用。用户可以采用任意一种方法来保护数据库应用程序，也可以将几种方法结合起来使
- 一、简介Supervisor 是一款 Python 开发的进程管理系统，允许用户监视和控制 Linux 上的进程，能将一个普通命令行进程变为
- 本文给大家分享了好几种复制表结构、表数据的示例介绍，具体详情请看下文吧。1、复制表结构及数据到新表CREATE TABLE 新表SELECT
- 从 PDF 表格中获取数据是一项痛苦的工作。不久前，一位开发者提供了一个名为 Camelot 的工具，使用三行代码就能从 PDF 文件中提取
- 前言：『入门MySQL』系列文章已经完结，今后我的文章还是会以MySQL为主，主要记录下近期工作及学习遇到的场景或者自己的感悟想法，可能后续
