浅谈网页设计中的网格系统

目 录

摘要………………………………………………………………………………………3
关键词……………………………………………………………………………………3
Abstract…………………………………………………………………………………3
Key words………………………………………………………………………………4
前言………………………………………………………………………………………5
一、 绪论…………………………………………………………………………………1
（一） 研究目的及意义…………………………………………………………1
（二） 研究方法………………………………………………………………1
（三） 研究过程…………………………………………………………2
（四） 研究成果及结论…………………………………………………………1
（一） 网页设计的意义…………………………………………………………1
（二） 网格设计的运用…………………………………………………………1

二、 网页网格系统分析……………………………………………………………3
（一）网页网格的概述……………………………………………………………3
1、 网格的定义与基本功能…………………………………………4
2、 网页网格设计的分类……………………………………………4
（1） 对称式的网格设计……………………………………5
（2） 不对称式的网格设计…………………………………5
（3） 模块网格设计………………………………………6
（4） 复合网格设计………………………………………6
3、 网页网格设计的作用…………………………………………6
（二） 网页网格设计特点………………………………………………………7
（三）网页网格设计的方式…………………………………………7
1、 组合网格……………………………………………………………7
2、 水平网格…………………………………………………………7
3、 垂直网格……………………………………………………………8
4、 成角网格……………………………………………………………8
三、网页设计创意原则…………………………………………………………3
（一） 六栏固定宽度网格布局………………………………………………1（二） 960，24X40网格系统………………………………………………1
（三） Responsive设计概念…………………………………………………1
四、网页制作实例分析…………………………………………………………………9
结束语……………………………………………………………………………………10
参考文献…………………………………………………………………………………11
附录………………………………………………………………………………………12
致谢………………………………………………………………………………………13
目的、意义、研究方法、研究过程、研究成果及结论

浅谈网页设计中的网格系统

摘 要

网格的目的就是让设计得以成立的基础。就本质来说，它就是网页设计作品的骨骼。就是帮助网页设计师快速完成设计的框架结构。我们通过解析网格布局方式寻求设计突破，让网页设计变得更加活灵活现，变得有意思，而不只是一个单单为信息传播而做的载体，网页设计从来都不是信息的奴隶，网格也不会是设计的阻力。让网格系统最大程度为设计提供便利是我们现在所需要努力的。
如今互联网的主旋律是网页设计。根据目前网络形势，首先，我们是为设计而服务，而后我们才是为网页而服务，这跟过去以往的网页设计有着很大的不同，这是视觉设计师应该去做到的。网格系统只有沦为辅助工具，破除网格框架为设计而努力是现今网页设计师做必须努力的。

关键词：网页，网格系统，960

Discussion on the webpage design of gird system

Abstract

The grid system is using a standardized webpage grid layout of a thought, similar to newspaper layout design and layout design format. This is the recent two years, the main principle is that the webpage page is divided into N equal respectively, and then through the combination of a corresponding number of annihilation of webpage design layout, and CSS+div will use all grid style and module is fixed, so the designers in the grid on the basis of webpage design and layout.
Grid aim is to make the design to be the basis for the establishment of. In essence, it is a webpage design works of skeletal. We use the grid to organize content on the page can improve the design accuracy and consistency, which is a higher degree of creativity provides a feasible framework; webpage design style can be simplified to a large extent the design difficulty and convenient for us. With the print media is different, webpage design needs to take into account the different browsers, different operating system platforms, different screen sizes and with the variable factors, webpage grid system designers need to adapt to these external changes. Only adapt to these changes, the grid can greatly improve the entire network visual environment effect.

Key words: Web page, the grid system, rule of thirds, 960

前 言

我们要尊重一篇论文，因为论文是耗费了无数人心血才得以存在的研究证明。它有着无限量存在的时间期限。现代传媒——网页是我研究的主要课题，而它只是无数论文中的一颗小小的“种子”，等待人们的发掘。当现代人花费越来越多的时间在电脑面前时，网络已然成为了我们生活中不可或缺的一部分。网页设计布局是否让我们的眼睛感到舒适，是否让我们的眼睛更方便的去阅读，是当前网页设计师所必须面对的问题。与传统的阅读相比，读者阅读书籍是对书籍内容的深思，而面对电脑屏幕上的网页时，则是对有价值信息的搜索，网络用户比阅读书籍的读者们更加没有多少耐烦。故而，网络时代的设计师们需要更加尊重一个个网页空间。

一、 绪论

近年来，网页设计成为最热门的话题，因为互联网从原来的般遥不可及变成了现在的触手可及的。是社会的发展也是时代的变迁，我们应该顺应设计，顺应这个时代的号召，让设计大方光彩。
论起网页设计，就必定要谈到网格系统的使用，当然，有人会问为什么，其实不过是因为网格系统是可以通过使用一个固定的框架结构，给予我们带来一种强烈的视觉效果布局，不仅如此，网格系统也将会用来评定一个网站的可用性和持久性。在这里，我不否认网格系统的重要性，但是，我们必须明确网页设计的目的依旧是设计。现在让我们通过来了解网格系统，来了解其对网页设计师们的重要性。不过最终我们还是要破除网格着重设计。
（一） 网页设计的运用
网页设计的运用必然伴随着网格系统的运用，网页设计的历史有多长，网格系统的历史就有多长，甚至网格系统的历史比网页设计还要长久的多。
网页设计的目的&#