A. web表格怎样做得美
下面我们以一个简单的示例来体会体会一下表单。
最终效果如下：
如何用web表格控件FineReport做web表格
2
新建表单
点击文件>新建表单，如下图
如何用web表格控件FineReport做web表格
拖入组件
如上图所示的效果图，我们可以看到该表单需要有1个下拉框控件以及对应的1个标签控件和一个查询按钮，还需要一个以表格形式显示数据的报表块和显示图表的图表块，此时，我们确定了需要在表单中添加一个报表块，一个图表块，3个控件。
注：在组件介绍中，我们知道控件即可依附于参数面板组件存在，也可以单独以组件的形式存在，在这里可随意使用哪种形式，效果都一样，那么使用依附于参数面板组件存在的形式。
参数组件
从工具栏中将参数组件拖拽至表单主体中，并将相应的三个控件：下拉框、文本控件和查询按钮拖拽至参数组件中，并设置标签控件的控件值为：客户，如下图：
如何用web表格控件FineReport做web表格
报表块组件
从工具栏中将报表组件也拖拽至表单主体中，如下图：
如何用web表格控件FineReport做web表格
注：如果组件数量过多，在web端展示的时候自适应在一页内显示会比较拥挤，那么此时可以在右侧下方选中整体框架body，在右侧上方的属性表中将组件缩放修改为自适应原样缩放，如下图：
如何用web表格控件FineReport做web表格
充满展现区域：是指在web端展示的时候，所有组件自适应充满整个浏览器页面显示，不出现滚动条；
自适应原样缩放：是指在web端展示的时候根据制作表单时候组件大小比例显示，并不缩放充满整个web页面，如果超过页面大小，会出现滚动条。
其详细显示样式请查看表单样式
图表组件
再从工具栏中将图表组件拖曳至报表块组件的下方，如下图：
如何用web表格控件FineReport做web表格
控件绑定数据
定义数据集
效果图中，新建数据集ds1：SELECT 产品名称,库存量,产品.成本价 ,产品.单价 FROM 订单,订单明细,产品 where 客户ID='${company}'and 订单.订单ID=订单明细.订单ID and 订单明细.产品ID=产品.产品ID，参数company的默认值为VINET,。
注：参数名字必须与客户ID下拉框控件名称保持一致。
客户下拉框控件
选中下拉框控件拖拽到适当位置，下拉框控件名设为“company”，数据字典来自FRDemo数据库的客户表（数据类型选择数据库表，数据库选择FRDemo），实际值和显示值分别为客户ID和客户名称，控件值为VINET：
如何用web表格控件FineReport做web表格
报表块
参数面板与控件都已经设置好之后，点开报表块里面的触笔按钮，进行报表块编辑界面，如下图：
如何用web表格控件FineReport做web表格
新建数据集
效果图中，报表块里面要显示订单明细数据，根据客户ID进行过滤，新建数据集ds2：select * from 订单 where 客户ID='${company}'，company默认值为VINET.
表样设计
如下图所示，设计表样：
如何用web表格控件FineReport做web表格
点击左下角的表单按钮回到表单的设计界面，选中报表块，可在右侧的属性表中设置其报表块工具栏是否可见，如下图：
如何用web表格控件FineReport做web表格
图表块
鼠标选中图表块所在区域，为该图表绑定数据，图表数据源来源于数据集数据源，其分类系列设置如下：
如何用web表格控件FineReport做web表格
条件属性
由于该图表块类型为组合图，即需要通过图表条件属性来修改不同系列的图表类型，如下图，新增一个条件属性，设置当系列序号为3的时候，其坐标轴为次坐标轴，图表类型为折线图：
如何用web表格控件FineReport做web表格
13
注：设置条件选择系列序号的时候需要与数据绑定时的数据列顺序相匹配，在上图设置图表数据时，库存量、成本价和单价的系列序号依次为1、2、3，条件属性主要是设置库存量系列用柱形图展示，成本价和单价用折线图展示并使用次坐标轴。在添加一个组合图时，会默认添加2个条件属性，详细请查看组合图
到此为止，表单就已经制作好了。
B. Web表单设计—点石成金的艺术（一）
最近在读《 Web表单设计—点石成金的艺术 》一书，颇受启发。而且该书目前已经买不到了，好像二手书也买不到，特意找了pdf扫描版来读，读书过程中的一些感悟跟大家分享。
一、表单的设计
大多数人都不喜欢填写表单，这也就说明了应该关注优秀表单设计。
而很多的特定数据来源都提供了衡量表单设计影响的方式：
（1） 可用性测试 （观察人们与表单如何交互）
（2） 实地测试 （从人种学角度观察人们在家中或办公室中与表单互动的情况；）
（3） 客户支持 （了解客户填写表单时遇到的问题）
（4） 网站追踪
（5） 眼动跟踪 （记录人们如何理解表单的表现形式）
（6） Web惯例 （即查看该问题的通用解决模式，可理解为分析竞争对手的解决方案）
二、表单的组织
类似标签后面是否要防止冒号的问题，用户真的不关心。用户关心的是问题内容和所问的原因。
有些字段需要告诉用户填写的原因（ 为什么问这些问题，能为用户带来的好处 ），如果不能回答，就要考虑是否真的需要这个字段。
表单所提的问题即 标签要尽量的简洁清晰 。
如果简洁的标签容易引起用户的误会，应该 尝试使用自然语言的方式 。
表单较长或较复杂时应 考虑对表单内容进行分组 ，有助于浏览和快速完成填写。
有些时候很多问题需要按顺序回答，否则回答就没有意义。这时候人们需要看到所有问题，一个较长的网页是好的解决方案。通常这些问题会和一个主题相关。
有些 可选问题在表单填写完成后再问比较好 ，如“您如何知道我们”或者“您想进一步了解我们吗”。这样会比初始表单就提问能获得更多的答案。
可以通过Web惯例调查， 比较相似网站的设计方案 ，引导发现网上已经形成的常见表单组织结构，但是也要结合自身情况不要只停留在简单复制竞争对手。
对表单进行分组时， 每个内容组都从视觉上区别于表单的其余部分 ，但是对比太多也可能造成视觉污染，阻碍人们浏览表单。
信息设计专家爱德华,托佛特认为，信息由产生作用的差异构成，任何无助于布局的页面元素都会损坏布局。 采用最好的必要视觉信息来区分内容组 。
英文网站， 标签首字母应当大写 ，使内容组更容易浏览。
最后，祝大家六一儿童节快乐！永葆童心~
C. 关于Web表单设计的经验分享
表单在UI设计中的出现场景还是比较多的，尤其是在一些To B的产品设计中。最近自己有做大量web 表单设计，就想把自己学到的一些关于表单设计的知识点分享给大家～
一、什么是表单？
表单在网页中的主要功能是负责采集数据以及向服务器传送数据的。表单是采集用户信息数据重要的途径。好的表单设计能提升信息采集的效率与成功率。不好的表单设计会影响用户心情，体验差，导致信息采集不成功甚至带来利益的损失。
二、表单的构成
表单通常由标签、输入域、操作按钮、这三部分构成。
标签
标签我们可以把它理解为标题，告诉用户该表单需要填写什么信息、该表单需要采集什么内容。标签通常出现在输入域的左边、顶部、或者输入域内。
标签按所填信息的必要性分为必填项和非必填项，一般我们会在必填项的标签内容加上＊号。＊号的的摆放位置有下面两种情况：
1.当标签与输入域居中对齐时，建议把＊号放在标签左侧。
因为＊号比较显目，用户往往第一眼会先看到它，然后按照用户从左往右的阅读习惯，视觉落点分别为文字标签、输入域。考虑到表单的填写效率，＊号位于左侧的表单阅读起来会更加顺畅。所以当标签与输入域居中对齐时，把＊号放在标签左侧会更好。
2.当标签与输入域左对齐时，建议把＊号放在标签右侧。
由于人们纵向的阅读习惯，视线会成F型。＊号在左侧还是在右侧并不会对用户视觉落脚点造成太多困扰，另外考虑到对齐的形式，＊号放在标签右侧会更好。
输入域
输入域是录入用户各种类型信息的重要交互区域。输入域包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框、和文件上传框等等。
不知道这些输入域的区别的小伙伴可以去ant design官网学习一下，传送门：
https://ant.design/components/overview-cn/
因为输入域是录入信息很重要的交互区域，在设计时我们应该考虑用户输入的多种场景去设计。我们可以将用户的输入过程分为输入前、输入中、输入后。根据每一种场景中细化我们的设计。比如在输入中：我们要考虑光标的设计、输入文字信息的设计，信息提示等，在输入后：我们要考虑信息输入错误应该给予怎样的视觉反馈等。总之考虑得越细致，越能提高信息录入的成功率。
操作按钮
操作按钮是在用户填写完表单各项内容后，所要进行的操作动作，来完成或者结束当前操作流程。操作按钮分为全局操作按钮与局部操作按钮。全局操作按钮控制整个表单，比如提交、发送等操作按钮。局部操作按钮是对某一范围的内容起作用，比如编辑、删除操作。
三、表单设计常见问题
1.标签采用哪种对齐方式更好？
在我们的实际项目中，通常会因为文案的长短不一，导致我们不知道该采用哪种对齐方式。标签的处理原则就是要要尽量对齐，采用哪种对齐方式应考虑具体的制约因素和目标来定。
左对齐
当标签采用左对齐的方式的时，因为文字标签的长度不统一，导致标签与输入框的间距是不可控的。这就会造成设计的通用性不强，以及横向空间的浪费。
如果采用左对齐的形式，就要尽量去保持文字标签的长度一致，比如通过字距的调整让文字标签的长度保持一致或者通过留足留白空间，这样设计上会更统一。以为例，采取左对齐形式，但是它留足了文字标签与输入域之间的距离，让表单看上去更统一和谐，不足的就是造成了部分空间的浪费。
顶对齐
采用顶对齐的形式，会让标签和输入域垂直显示，纵向布局的信息呈现效果会更好，从而提高用户填写的效率。顶对齐因为垂直排布，会造成纵向空间的浪费，但在横空间上比较节省，比较适用于横向宽度较窄的页面。
▵顶对齐
右对齐
右对齐跟左对齐一样会因为标签长度不可控。导致设计的通用性不强，以及横向空间的浪费，但节约了纵向空间。
▵右对齐
在这几种对齐方式中，用户浏览信息的速率顶对齐>右对齐>左对齐。顶对齐形式适合简易表单、右对齐与左对齐表单适合复杂表单。
2.操作按钮应该用哪种设计形式比较好？
对于全局的操作按钮会用常规的按钮样式，全局按钮分为主按钮与次按钮。
主按钮
主按钮是界面中比较重要的功能操作按钮，比如提交、保存等一些正向的操作。主按钮在视觉层级上最高，能够引导用户很快的找到核心的操作并点击。主按钮通常是纯文本或图文结合的面性形式。图文结合的形式能吸引用户注意，也帮助用户理解该按钮的操作含义。
次按钮
次按钮的层级相对于主按钮层级要弱一些，通常采用线性形式。在一个页面中可以出现多个次按钮。
对于局部操作按钮的设计形式可以是文字按钮、图标按钮，也可以是图标＋文字的形式。至于应该应用哪种形式就要结合具体端场景去考虑。
图标按钮
图标按钮就是用图标来代表该操作的含义，能够直观的表达按钮的功能。在设计的时候我们需要注意图标是易于理解的、是用户熟悉的。图标按钮的设计通常都会配上悬浮框设计，也就是当用户鼠标停留在该图标按钮上会出现对该按钮的文字释义的悬浮框。以微信公众号为例，当鼠标停留在编辑图标那时会出现黑色的悬浮框对其进行解释，让用户理解此按钮的意义，让用户放心操作。
在web设计中，由于按钮的种类与使用场景比较多，建议局部的操作按钮使用线性图标，让它的层级相对其他按钮要弱化一些。
文字按钮
文字按钮通常出现在列表的操作项中。文字的颜色通常是品牌色或者蓝色，因为蓝色在用户的认知中通常是可点击的。
图标＋文字 按钮
图文结合的按钮相对于纯文字按钮会更加直观，也能更吸引用户注意。
3.输入框应该设计几种状态？
考虑的状态越多，设计就会越细，能够及时的反馈信息给用户，从而提高表单填写效率。在考虑输入框的设计状态时，遵循及时反馈的设计原则去考虑。
为了避免用户填写完所有信息后，才反馈有错误，会造成时间浪费，表单填写效率低。通常会把输入框线变成红色，同时出现红色的说明文案，来引起用户的注意。
▵及时反馈错误信息
在设计中我们还需要考虑自动校验的成功与警告状态。颜色通常为绿色与橙色。
输入框到底应该设计几种状态我们也需要根据我们表单的复杂情况去考虑，对于简单的表单设计过于细化的状态是没有必要的。
写在最后的话
表单设计看起来简单，但实际在设计过程中还是有大量的点值得我们去学习与研究的。在这次做表单的过程中，觉得作为设计师我们不应该去挑活，不要觉得表单设计是一个很小的设计就不动脑的照着别人的设计规范抄一遍。像这种看似枯燥但又很重要的模块设计，我们在前期开始设计之前可以从交互层去考虑，再从视觉层面去考虑怎样的表单设计能让用户填得舒心又高效。在看别人的设计规范比如ant design的组件规范时，我们可以去留意他们的设计细节，比如表单上下之间的间距留的是多少？有什么规律吗？按钮的上下边距与左右边距有什么关系吗？通过这些思考，然后去观察总结，并转化为自己的小技巧，到下一次设计表单的时候，我们就会做得很好了。
往期解析
UI设计－首页解析
详情页设计技法解析
轻松get文字标签设计技法
Get点9切图方法（内附切图神器）
D. 【网页设计规范】网页设计规范尺寸
摘 要
随着网络的快速发展，慧巧老互联网的应用越来越贴近生活，越来越多的人假如到了
制作网页的工作中，各式各样的网站如雨后春笋般出现在互联网上。网络技术的发
展带动了软件业的发展，所以用于制作Web页面的工具软件也越来越丰富。从最基
本的HTML编辑器到现在非常流行的Flash互动网页制作工具，各种各样的Web页
面制作工具，而吸引浏览用户的则是视觉效果出色、信息量丰富、使用起来便捷的
网页，所以网页设计尤为重要。互联网成为人们快速获取、发布和传递信息的重要
渠道，它在人们政治、经济、生活等各个方面发挥着重要的作用。网页设计伴随着
网络的快速发展而快速兴起，作为上网的主要依托，由于人们使用网络的频繁而变
得非常的重要。网页讲究的是排版布局，其功能主要就是提供一种形式给每个上网
者，让他们能够了解网站提供的信息。
关键字：网页设计，基本宽埋构成，注意事项，FRONNPATE
Abstract
groups with the rapid development of the network, the application of the Internet
more and more close to the life, more and more people to make a web page work if,
various web sites springing up appeared on the Internet. The development of Internet
technology driven the development of the software instry, so used to make Web page
tool software is also more and more colorful. From the most basic HTML editor to now
very popular Flash interactive Web page creation tools, various Web page making tools,
and attract users powse the visual effect is excellent, rich information, use rise
convenient Web page, so Web design is especially important. The Internet become people
to quickly get, distribution and transfer information important channel, it people in
politics, economy, life and other aspects played an important role. Web design with the
rapid development of network and rapid rise, as the main rely on the Internet, because
people use the Internet frequent and become very important. Web cultured is typesetting
layout, its main function is to provide a form for each user, to let them know the
information provided on this site.
Keywords: SITE DESIGN，CONSIDERATIONS，BASIC FORM，FRONNPATE
目前升 录
第一章 网页的相关概念..................................................................................................1
1.1 什么是网页...................................................................................................1
1.2 网页的构成...................................................................................................1
1.3 常见的网页版式类型...................................................................................2
第二章 常用的制作工具..................................................................................................3
2.1 Macromedia公司出品的Flash互动网页制作工具 ....................................3
2.2 Macromedia Dreamweaver 8 .........................................................................3
2.3 HTML编辑器 ...............................................................................................3
2.4 网页编辑器...................................................................................................3
第三章 网页设计的要素................................................................................................4
3.1 关于文字.......................................................................................................4
3.2 图片要素.......................................................................................................4
3.3 排列方法要素...............................................................................................4
3.4 色彩要素.......................................................................................................5
第四章 网页设计的技巧................................................................................................6
4.1 框架的使用...................................................................................................6
4.2 颜色的搭配...................................................................................................6
4.3 CSS样式的使用 ...........................................................................................7
第五章 网页的注意事项....................................................................................................8
5.1 网页内容要新颖...........................................................................................8
5.2 网页的布局...................................................................................................8
5.3 整体归纳.......................................................................................................9
第六章 总 结................................................................................................................10
致 谢................................................................................................................................ 11
参考文献............................................................................................................................12
第一章 网页的相关概念
1.1 什么是网页
网页(Web Page)其实就是一个用来传输各种信息的文件，它能在网上传输并被浏览器识别和翻译成页面，然后显示在计算机屏幕上。简单的说，通过浏览器在WWW上所看到的每一幅画面都是一个网页。网页是网络上的基本文档。网页中包含文字，图片，声音，动画，影像以及链接等元素，通过对这些元素的有机组合，构成了包含各种信息的网页。其中，文字是网页中最常用的元素。图片可以给人以生动直观的视觉印象，适当运用图片可以美化网页。链接的设计，可以使我们进行选择性的浏览。声音，动画等多媒体信息的加入，使网页内容更加丰富多彩。
1.2 网页的构成
不同性质的网站，构成网页的基本元素是不同的，一般情况下，网页的构成包括网页标题，网页标志，横幅广告，导航栏，主内容区，页脚版权信息等。
1.网页标题
网站中的每一个页面都有标题，用来提示该页面的主要内容。标题出现在浏览器的标题栏中，而不是出现在页面布局中。它的一个比较重要的作用就是引导访问者清楚的知道所要浏览的网页的内容。
2.网页标志
网页标志是一个站点的象征，也是一个站点是否正规的标志之一。一个好的标志可以很好的树立形象。网页标志一般放在网站的左上角，访问者一眼就能看到它。
3.横幅广告
横幅广告（Banner）是互联网广告中最基本的广告形式。Banner可以位于网页顶部，中部或底部的任意一处，一般横向贯穿整个或者大半个页面。
4.网页导航栏
导航栏既是网页设计中的重要部分，又是整个网站设计中较为独立的部分。一般来说，网站中的导航栏在各个页面中出现的位置是比较固定，而且风格也较为一致。
5.主内容区
网页的主内容区是网页的主要内容显示区域。
6.页脚版权信息
页脚是放置网站版权信息的地方，可以放置一些联系方式或其他的导航栏目。
1.3 常见的网页版式类型
网页内容在页面上有规则的排列布置，就称为网页的排版。网页版式类型就是各种不同排版方式的组合。网页的版式是可以随心所欲设计的。一般可以分为满版型，左中右型和上左中右型。
第二章 常用的制作工具
2.1 Macromedia公司出品的Flash互动网页制作工具
这是是一款功能非常强大的交互式矢量多媒体网页制作工具。能够轻松输出各种各样的动画网页，它不需要特别繁杂的操作，也比JAVA小巧精悍！但它的动画效果、互动效果、多媒体效果十分出色。并且由于Flash编制的网页文件比普通网页文件要小得多，所以加快了浏览速度。这是一款十分适合动态Web制作的工具。
2.2 Macromedia Dreamweaver 8
Macromedia Dreamweaver 8是一款专业的网页设计软件，它采用所见即所得的编辑方式，用于对Web站点，Web页和Web应用程序进行设计，编码和开发，利用它可以轻而易举的制作出充满动感的网页。利用Dreamweaver 8的可视化编辑功能，用户可以快速创建Web页面而无需编写任何代码，用户可以查看所有站点元素或资源并将它们从易于使用的面板直接拖到文档中。
2.3 HTML编辑器
虽然HTML代码复杂，编辑和调试要花费大量的时间，但因HTML的稳定性、广泛支持性及可创建复杂的页面效果，仍受高级网页制作人员的青睐。就目前来说，有众多的编辑器供选择，这些编辑器广泛支持复杂页面创建及高级HTML规范。
2.4 网页编辑器
其中以Microsoft Frontpage为代表，它具有如Word一样的操作界面，熟知Word功能的操作者，只要稍加培训就能轻松编制网页。而且，Frontpage还能解析网页的HTML源代码，并提供了预览支持。但Frontpage的一些特殊显示功能并不能在其它非IE浏览器下实现。所以Frontpage是一款非常适合初、中级网页制作人员使用的工具软件。
第三章 网页设计的要素
3.1 关于文字
文字是美好事物最基本的方式，在网页中，文本内容也是最重要的组成部分，最美观，最整齐的方式放入到网页中，才能构成一个美观的页面。有的设计者想通过闪烁的文字来引起访问者的注意是可以被人理解的，但一个页面中最多不能有三处闪烁文字，太多了给用户一种眼花缭乱的感觉，反而会影响用户去访问该网站的其他内容，正所谓“物极必反”也。
虽然你可以在你的HTML中使用特殊的字体，但是，你不可能预测你的访问者在他们的计算机上将看到什么。在你的计算机里看起来相当好的页面，在另一个不同的平台上看起来可能非常糟糕。一些网站设计员喜欢使用来定义特性，这虽然允许你使用特殊的字体，但是仍需要一些变通的方法，以免你所选择的字体在访问者的计算机上不能显示。所以用普通的文字进行制作是最保险也是最方便的。
3.2 图片要素
要设计出漂亮的主页，首先要成为计算机图形高手，仅这一点就可以让初学者花上一年半载的时间。图片的要求与页面的内容有关，一些较随意的主页像股票、医药站点等，来访者并不在乎你能否做出精彩的图片，有些时候他们反而觉得放置图象后影响了访问速度，他们关心的只是页面内容；相反像一些需要靠图象来吸引访客的主页，如游戏介绍、影视介绍、风光名胜等站点，图象是一个极为重要的要素，在这里缺少了恰当的图象，整个页面就会黯然失色、就是一个不完整的主页。这需要去学习像photoshop这样的图形图像处理软件，还要有一定的美术基础，如审美观、创意技巧等。如果给每个图形加上文字的说明，在出现之前就可以看到相关内容，尤其是导航按钮和大图片更应如此。这样一来，用户在访问你的站点时就有一种亲切感觉，认为你心细，比较善解人意，时时刻刻为他人着想，相信你的好心会有好报的。
3.3 排列方法要素
主页的第二个要素是排列方法，即网页布局。网页作为一种版面，既有文字，
又有图片；文字有大有小，还有标题和正文之分；图片页有大小而且有横竖之别。图片和文字都需要同时展示给观众，不能简单地将其罗列在一个页面上，否则会搞得杂乱无章。关于具体的网页布局，常见的有“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型等，关于它们，在网页设计的相关书籍中或者在网络上都可以看到详细的叙述。比如如果内容非常多，就要考虑用“国字型”或拐角型；而如果内容不算太多而一些说明性的东西比较多，则可以考虑标题正文型；而如果是一个企业网站想展示一下企业形象或个人主页想展示个人风采，封面性是首选；Flash型更灵活一些，好的Flash大大丰富了网页，但是它不能表达过多的文字信息。还没有提到的就是变化型了，只有不断的变化才会提高，才会不断丰富我们的网页。
3.4 色彩要素
色彩在网页所占比重很大。有了合理清新的色调，会弥补主页上的其它不足。页面的色彩搭配是与网站的主题分不开的，一个网站必须有一种或两种主题色。不至于让浏览者迷失方向，也不至于单调乏味。一般来说，页面的主体文字应尽量使用黑色等较深的颜色，与背景对比明显，按钮、边框等使用彩色。例如教育类网站使用蓝色为主题色，再用红色和黑色作为配色，就能表达出严肃、稳重的效果。
第四章 网页设计的技巧
4.1 框架的使用
框架（FRAME）是Web上经常会看到的页面结构。框架的最常见用途就是导航。一组框架通常包括一个含有导航条的框架和另一个要显示主要内容页面的框架。
使用框架具有以下优点：访问者的浏览器不需要为每个页面重新加载与导航相关的图形；每个框架都具有自己的滚动条(如果内容太大，在窗口中显示不下)，因此访问者可以独立滚动这些框架。例如，当框架中的内容页面较长时，如果导航条位于不同的框架中，那么向下滚动到页面底部的访问者就不需要再滚动回顶部来使用导航条。
使用框架具有以下缺点：可能难以实现不同框架中各元素的精确图形对齐；对导航进行测试可能很耗时间。
许多专业 Web 设计人员不喜欢使用框架，并且许多浏览 Web 的人也不喜欢框架。在大多数情况下，这种反感是因为遇到了那些使用框架效果不佳或不必要地使用框架的站点(例如，每当访问者单击导航按钮时就重新加载导航框架内容的框架集)。如果框架使用得法(例如，在允许其他框架的内容发生更改的同时，使一个框架中的导航控件保持静态)，则这些框架对于某些站点可能非常有用。
4.2 颜色的搭配
做网页的初学者可能习惯使用一些漂亮的图片作为自己网页的背景，但是浏览了一下大型的商业网站，你会发现他们更多运用的是白色，蓝色，黄色等，使得网页显得很典雅温馨。我们可以使用一些简单的配色技巧来使我们的网页看起来美观大方。
1.用一种色彩
这就是指先选定某一种色彩，然后通过讲色彩变浅或者加深的方法以产生新的色彩，这样会让人看起来比较统一。例如以咖啡色为基调，整体上的色彩都以咖啡色为主，给人的视觉效果是一种古朴的气息迎面扑来。
2.用黑色和一种彩色
一般来说，网页的背景色应该柔和、淡素一些，再配上深色的文字，使人看起
来自然、舒畅。而为了追求醒目的视觉效果，可以为标题使用较深的颜色。例如以黑色为底色，衬以亮黄色，这样配出来的效果会让人感觉别具一格。
3.用两种色彩
可以先选择一种色彩，然后再选择其对比色，这样选出的色彩丰富但不杂乱。例如以橙色和蓝色相结合作为主色彩的网页，通过橙色和蓝色在网页上的对比能迅速传达网站主题内容，容易增添强烈的兴奋度，多用于内容是食品、休闲娱乐、产品等的网站。
4.3 CSS样式的使用
CSS(层叠样式表)是一种制作网页的新技术,它的全称是级联样式表,即Cascading StyleSheets的缩写，又称之为风格样式表单。CSS是在网页制作过程中普遍用到的技术。采用了CSS技术控制的网页，设计者会更轻松、有效地对页面的整体布局、颜色、字体、链接、背景以及同一页面的不同部分、不同页面的外观和格式等效果实现更加精确地控制。
第五章 网页的注意事项
5.1 网页内容要新颖
1.网页内容的选择要不落俗套，要重点突出一个“新”字，这个原则要求我们在设计网站内容时不能照抄别人的内容，要结合自身的实际情况创作出一个独一无二的网站。 放眼望去，网上的许多个人主页简直就是"杂货店"，内容包罗万象题材千篇一律，人人都是"软件下载"个个都有"网络导航"，从头到尾找不出一丝“鲜”意。所以，我们在设计网页时，要把功夫下在选材上。选材要尽量做到“少”而“精”又必须突出“新”，如能坚持天天更新的话我相信这样的网页一定会受到大家的欢迎。
2.网页制作好后，不能说万事大吉了，其实事后的工作量更大。因为网页制作是一时的，而维护更新的工作是每天都要做的。要及时把网页上已经作废的连接应该立即删除掉，比如用户无意中点击了页面中的一个连接，在苦苦的等待之后，换来的是无法访问的结果，那么他们会对你的网页大失所望，可能以后再也不会光顾你的网页了。若不能及时更新，也最好在主页上发布信息，告诉前来访问的朋友，因有特殊情况需要离开一段时间，未能及时更新主页，希望各位见谅，这样就能给人一种对别人负责的感觉，同时能得到网友的信任。
5.2 网页的布局
1.善用表格布局。不要把一个网站的内容象作报告似的一二三四地罗列出来，要注意多用表格把网站内容的层次性和空间性突出显示出来，使人一眼就能看出你的网站重点突出，结构分明。
2.注意视觉效果。设计Web页面时，一定要用640×480和800×600的分辨率来 分别观察。许多浏览器使用640×480的分辨率，尽管在800×600高分辨率下一 些Web页面看上去很具吸引力，但在640×480的模式下可能会黯然失色。作一点小小的努力，设计一个在不同分辨率下都能正常显示的网页。
3.少放网站地图。许多设计者把他们的网站地图放在网站上，这种做法，却是弊大于利。绝大部分的访问者上网是寻找一些特别的信息，他们对于你的网站是如何工作的，并没有兴趣。如果你觉得你的网站需要地图，那很可能是需要改进你的导航和工具条。
5.3 整体归纳
1.内容要通俗易懂。网站设计最重要的诀窍，恐怕就是你的网页要易读 。这就意味着&def你必须花点心思来规划文字与背景颜色的搭配方案。 注意不要使背景的颜色冲淡了文字的视觉效果，别用花里胡哨的色彩组合，让人看起来你的网页来很费劲。一般来说，浅色背景下的深色文字为佳 。这个要点要求你最好别把文字的规格设得太小、也不能太大。文字太小，人家读起来难受；文字太大，或者文字视觉效果变化频繁，像是冲着人大喊大叫，看起来不舒服。另外，最好让文本左对齐，而不是居中。按当代中文的阅读习惯，文本大都居左的。当然，标题一般应该居中，因为这符合读者的阅读习惯。
2.多学习使用HTML。为了成功地设计网站，你必须理解HTML是如何工作的。大多数的网站设计者建议网络新手应从有关HTML的书中去寻找答案，用Notepad制作网页。因为用HTML设计网站，可以控制设计的整个过程。但是，如果你仅仅是网站设计的新手，你应该寻找一个允许修改HTML的软件包。HomeSite4是一个很好的Web设计工具。在设计过程中，HomeSite4能帮助你学习HTML。它还允许你切换到所见即所得的模式，以便你在把网站发送到Web之前，预览你的网站。
3.少用Java程序。不要使用大幅面的Java程序&def能够用javascript替代效果的则尽量不要使用java.因为目前来讲java的运行速度实在慢的让人无法忍受，往往使浏览者没有耐心等页面全部显示出来，这样你的精心设计便毫无效果啦。
第六章 总 结
网络技术的发展带动了软件业的发展，所以用于制作Web页面的工具软件也越来越丰富。从最基本的HTML编辑器到现在非常流行的Flash互动网页制作工具，各种各样的Web页面制作工具。
当你在INTERNET这个信息的海洋中尽情遨游时，会发现许许多多内容丰富、创意新颖、设计独特的个人网页，不知道你见到这样漂亮可人的网页是否有点心动。一旦你具备了上网的条件，又萌发了制作主页的念头，那么就应该注意网页设计时应考虑哪些方面的问题，包括网站功能和以及访问者需要什么。你的整个设计都应该围绕这些方面来进行。
在一个网站中，最重要的页面当属主页，所以在此以主页为例，说明在网页制作中版面设计的问题。从版面设计来讲,一个有特色的主页,必须包含有四个要素：文字，图片，排列方式和主色调，这四者相辅相成，缺一不可。
致 谢
对于本次毕业设计，我付出了很大的努力才完成。同时也体会到了收获的喜悦。 当然，设计的很大的一部分是得到了秦洪涛老师的大力支持与指导，秦老师认真负责的工作态度，严谨的治学精神和深厚的理论水平都使我受益匪浅。他无论在理论上还是在实践中，都给予我很大的帮助，使我得到不少的提高，这对于我以后的工作和学习都有很大的帮助，感谢他耐心的辅导。
同时也感谢所有帮助我修改论文的同学们，感谢他们的帮助与支持。
参考文献
[1]《中国 档案管理精览》，北京：中国档案出版社，2009．
[2] 沈庆伟，张霖．基于隧道的IPV4/IPV6过渡技术分析[J]．计算机技术与发展，2008
[3]中文Access 2000 24学时教程 作者：Craig Eddy ，Timothy Buchanan出版社：机械工业出版社
[4]刘韬,骆娟等.Visual Basic 实效编程百例（第二版）.人民邮电出版社，2009.8
[5]李维.面向对象开发实践之路（visual basic 6.0版）(BORLAND资深顾问着名visual basic 6.0专家李维最新力作).电子工业出版社，2009.4
[6]KAYEYAMA M. Incompatible displacement methods[A].SPRIET JA.Numerical anComputational Methods
[7]in Structural Mechanics[C].New York:Academic Press,2007.43-57.