网页的栅格设计思考
作者:小毅 来源:毅博客 发布时间:2007-11-09 10:33:00
网页设计中的脏、乱、差,是我们在设计过程中常会遇到的问题。通常"脏"是由对色彩使用不当所产生的,而色彩使用不当产生的不好效果也分为:"花、灰",花哨、灰头土脸也就是这里所说的"脏"。
我已经在早前的一些文章中谈过我对设计中运用色彩的看法。有兴趣的朋友可以查阅一下《色彩解释》。而"差"基本上是由于我们的技法上不够娴熟所产生的。比如细节上的处理不到位,某个局部的效果制作得粗糙。这可以称之为"差",特别是在处理带有2D效果的设计作品时,这种情况常会出现。
但是我今天在本文中所要谈的是"乱"。什么是乱?这里的乱不是指用色乱,也不是指内容乱,而主要是指布局乱。以前我有幸接触了平面设计,并且从中学到了很多平面设计上的一些知识与技法。其中"栅格设计"就是平面设计中用于处理布局的一种理论。到目前为止我还在研究"栅格设计"。因为着实没有什么比较好的语言可以非常简洁明了的概括这个词。这更像是需要不断用实践去理解的。所以很多时候我们们都无法去讲述。但是在设计中这个栅格却是能帮助我们完成更好作品的一个非常好用的利器。对于栅格设计我也不能说是认识深刻,我这里只是依据我对于栅格设计的理解,将之用于网页设计中,希望能给更多的朋友们一点启示,或许能打开一些朋友的思路。
单纯的文字是没办法让设计师们耐心的看下去的,所以还是老办法,用示图来作为讲解模型。这次我们使用的网页是微软、IBM、ASTRO三个公司网站来讲解。希望通过分解这三个公司的网站设计,能把我所理解的栅格设计传达出来。废话少说,看示图:
我们看到微软公司的网站设计中并没有什么明显的线去区隔不同的区块,但是当我们把当蒙上一层纱,然后用实线把每个部分都画出来这时我们发现这个网站其实是处在一个栅格阵列中。 那么这个阵列中的内容已经很明显了,并且我们从中发现了很多区块在页面中的位置居然是那么的有条理,并且有一些并不在一起的区块,居然也有一定的规律。当然有人可能会说,都用线画出来了当然显得条理,整齐了。问题就在于这里,我们的网站都可以用纵横线区分开。但是一些设计得不好的网站的纵横线可能数量非常的多,纵横线的数量过多并且都挤在一直,这就说明网站的布局显得太乱。或者是过于条理而变得布局平均,没有对比,缺乏美感。其实只要用这样的方法去分析一下自己设计的作品也许就能从中看到问题所在。
![](https://www.aspxhome.com/images/zang.png)
![](https://www.aspxhome.com/images/jiucuo.png)
猜你喜欢
- 前言本专栏将非常细致的讲解相关与计算机视觉OpenCV的相关知识即操作,非常的简单易懂。本文主要讲解相关与计算机视觉的相关入门内容,关于图像
- 1.找到缺失值导入数据集df=pd.read_csv("nba.csv")df.head(10)替换异常值(数据集中异常
- 备注1:解决连接MySQL数据库很慢的问题vim /etc/my.cnf添加内容:skip-name-resolve,重启数据库。 
- 前言 其实这个问题困扰我有一段时间,相信也有人和我一样有这个困扰,网上已有很多这种解释了,但是要么就
- 我就废话不多说了,直接上代码吧!#Python的matrix转置matrix = [[1,2,3,4],[5,6,7,8],[9,10,11
- 目的: 从数据库读取二进制位图图形数据资料, 透过 ImageMagickObject 组件即时制作缩略图,并显示在网页上 (ge
- 自旋锁获取锁的线程一直处于活跃状态,但是并没有执行任何有效的任务,使用这种锁会造成busy-waiting。 它是为实现保护共享资源而提出的
- 近期将公司的MySQL架构升级了,由原先的一主多从换成了DRBD+Heartbeat双主多从,正好手上有一个电子商务网站新项目也要上线了,用
- 本文导读:删除表中的数据的方法有delete,truncate, 其中TRUNCATE TABLE用于删除表中的所有行,而不记录单个行删除操
- <html> <head> <title>51windows.Net </title> &l
- 可以在Mac OS X 10.2.x(“Jaguar”)和以上版本上Mac OS X使用二进制安装软
- 本文实例讲述了JavaScript设计模式之享元模式。分享给大家供大家参考,具体如下:通过两个例子的对比来凸显享元模式的特点:享元模式是一个
- 本文转自微信公众号:"算法与编程之美"1、前言侧滑是一个非常实用的选项组件,它在Android App应用中非常广泛,常
- 在C#或者Java里面我们都知道,一个Class是要包含成员变量和方法的,对于GO语言的Struct也一样,我们也可以给Struct定义一系
- python版本3.7,用的是虚拟环境安装的pytorch,这样随便折腾,不怕影响其他的python框架1、先定义一个类Linear,继承n
- code原文档 1.txt :HelloNanjing100实现代码:file_ = "1.txt"r_file = o
- 什么是DLL文件?DLL文件为动态链接库(英语: Dynamic-link library, 缩写为DLL)它是微软公司在微软视窗操作系统中
- 本文用于对之前openCV知识点学习的复习及实践。要求达到以下效果:一、基本流程思路分析本项目本质上就是进行模板匹配。注:为多用到所学知识,
- 一、JSON数据格式介绍 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。JSON建
- 随着电子邮件的广泛使用,垃圾邮件也日益增多,对用户造成了很大的困扰。因此,开发一个能够自动分类和过滤垃圾邮件的程序就显得非常重要。本篇文章将