网站设计说明书――李萍

信息工程学院毕业设计（说明书）企业网站的设计与制作专业：计算机应用技术班级：计技0722学号：0702211132学生姓名：李萍校外指导教师：校内指导教师：苏萍二零一零年四月信息工程学院毕业设计（说明书）1目录摘要：....................................................................2关键字：..................................................................2第一章绪言...............................................................3第二章网站设计分析.......................................................42.1网站设计概述........................................................42.2开发工具的选用及介绍................................................42.2.1Dreamweaver8.0..................................................42.2.2PhotoshopCS....................................................52.2.3ASP动态网站脚本语言.............................................62.3关系型数据库的选择..................................................72.3.1MicrosoftOfficeAccess简介.....................................73.1网站定位............................................................93.2系统构思............................................................93.3网站栏目简介.......................................................10第四章详细设计..........................................................114.1网站制作过程.......................................................114.1.1logo的制作过程.................................................114.1.2banner的制作过程...............................................124.1.3主页制作过程(详见图4-3)........................................134.1.4留言板的设计....................................................144.2数据库的设计.......................................................164.3系统实现代码.......................................................174.3.1滚动文字特效（这里主要指网站左侧的“公司公告”）................174.3.2图片切换.......................................................184.3.3首页鼠标特效代码...............................................18结束语...................................................................20参考文献.................................................................20致谢.....................................................................21信息工程学院毕业设计（说明书）2摘要：本文就网站的主题内容及网站的制作与设计这两方面进行描述与分析。本网站的主题知识产权服务，整个网站都是以法律性的内容为主的，主要包括了首页、公司简介、法律服务、友情链接、法界动态、法律法规、在线留言、联系我们、网站公告等栏目。在整个设计过程中主要是运用Dreamweaver、ACCESS、ASP等编写的。通过本网站系统，给想了解知识产权的人群提供了一个良好的平台，同时也为有意愿注册公司、注册商标、申请专利，却无从咨询的人提供了一个可以互动解决问题的平台。如今，在网络技术的迅猛发展下，互联网的不断普及，让人们都感受到网络的方便快捷，从而大家都喜欢选择从互联网上获取信息，因此，互联网逐渐成为一个宽广的信息发布平台和获取信息的平台。本网站也需要通过Internet来对外宣传、普及，从而帮助到更多想了解知识产权的人们。本网站主要是以建立Dreamweaver、ACCESS、ASP等技术的动态网站管理系统的前台表现模块，使用了ASP技术的动态网页技术，加上ACCESS作为后台数据库，制作了一个简单的服务性企业网站系统，实现了企业网站的基本功能，例如用户注册登录，留言板的实现等。关键字：企业网站；ASP；知识产权信息工程学院毕业设计（说明书）3第一章绪言二十世纪进入信息发展高速路，数码化革命给所有领域带来新的改变。随着电脑办公自动化的普及，电子商务应运而生，一切都归功于internet的巨大贡献，互联网的世界里蕴藏无限生机，这里只有想不到的、没有做不到的。由于国际互联网是一个不受时空限制的信息交换系统，所以它是目前最直接、最丰富和最快捷的联系方式，信息沟通的高效率为企业带来了最大的方便。所以在现今社会对于一个企业来说，网站已经是不可缺少的一部分了。现今，知识产权越来越被人们关注，随着就业压力的加重，越来越多的年轻人选择自己创业开公司，大学生也占了一定的比例，由于专业的限定，有些大学生在校基本上接触不到知识产权的知识，当然在社会上的人群也不一定都了解知识产权。同时随着互联网的快速发展和不断普及，网站成了传播信息最有效的平台。所以我制作了一个专门针对知识产权行业的企业网站，给这些人群提供了一个了解和学习知识产权的平台，当然对于一个针对知识产权的服务性企业本身而言，这个网站将会对其自身带来不可估量的效用。社会在发展，人们的思想观念，生活方式也在发展，通过网站这种方式与企业或者他人交流已经趋向普及，信息工程学院毕业设计（说明书）4第二章网站设计分析网站的设计与制作需要用到网页三剑客（Dreamweaver、fireworks、flash），IIS，photoshop等工具。所以首先我们要了解这些工具的功能与用处，然后要能够熟练得掌握这些工具用法，只有你能熟练使用这些工具，你才能在设计过程中尽量避免技术上的问题，提高效率，做到“事半功倍”。2.1网站设计概述网站首页可以说是网站的门面，大家浏览你的网站首先看到的就是网站首页，所以首页不仅要做得美观，引人浏览，还要有丰富的内容。所以我们在首页就首页聚集了大量的信息，除了最基本的法律法规、法界动态、法律服务这些栏目外，我还将公司的公告用滚动文字的形式展现出来，这样静中有“动”的效果可以抓住人的眼球，吸引人去点击。每页左下方都有我们的联系方式，这样就不用转到联系我们这张页面都能获取到公司的联系方式了，当然若想更深入的了解就可以转到联系我们页面。子页面的框架基本上是符合整个网站的整体风格的，banner，导航等都是和首页一样的，不一样的只是正文的内容，这个可以通过模板来实现。出于排除对模板可编辑区域排版的复杂性起见，我这里没有运用模板，而是用另存为的方式实现网页风格“统一化”的。在网站的各页面制作好后，我在Dreamweaver中与Access数据库建立连接，通过在Dreamweaver的一系列操作实现注册登录的功能，而留言板功能我是通过一张空白的写有后台代码的页面转接过去的，名为handle.asp，用户可以通过“在线留言”在网站上发表自己的见解或疑问，达到互动的效果。2.2开发工具的选用及介绍2.2.1Dreamweaver8.0Dreamweaver是创建和管理网页的专业化可视编辑器，在网页设计与制作领域中用户最多、应用最广、功能最强大的软件，随着Dreamweaver8的发布，更坚定Dreamweaver在该领域的地位。它集网页设计、网站开发和站点管理功能于一身，具有可视化、支持多平台和跨浏览器的特性，是目前网站设计、开发、制作的首选工具。1、灵活的编写方式Dreamweaver具有灵活编写网页的特点，不但将世界一流水平的“设计”和“代码”编辑器合二为一，而且在设计窗口中还精化了源代码，能帮助用户按工作需要定制自己的用户界面。2、可视化编辑界面Dreamweaver是一种所见即所得的HTML编辑器，可实现页面元素的插入和生成。或视化编辑环境大量减少了代码的编写，同时亦保证了其专业性和兼容性，并且可以对内信息工程学院毕业设计（说明书）5部的HTML编辑器和任何第三方的HTML编辑器进行实时的访问。无论用户习惯手工输入HTML源代码还是使用可视化的编辑界面，Dreamweaver都能提供便捷的方式使用户设计网页和管理网站变得更容易。3、功能更多的CSS支持——CSS可视化设计、CSS检查工具4、动态跨浏览器验证当保存时系统自动检查当前文档的跨浏览器有效性，可以指定何种浏览器为测试用浏览器，同时系统自动检验以确定页面有没有目标浏览器不支持的tags或CSS结构。动态跨浏览器有效性检查功能可以自动核对tags和CSS规则是否适应目前的主浏览器。5、强大的WEB站点管理功能6、内建的图形编辑引擎7、Dreamweaver的集成特性Dreamweaver8继承了Fireworks、Flash和Shockwave的集成特性，可以在这些Web创作工具之间自由地切换，轻松地创建美观实用的网页。8、丰富的媒体支持能力可以方便地加入Java、Flash、Shockwave、ActiveX以及其他媒体。Dreamweaver具有强大的多媒体处理功能，在设计DHTML和CSS方面表现得极为出色，它利用JavaScript和DHTML语言代码轻松地实现网页元素的动作和交互操作。Dreamweaver还提供行为和时间线两种控件来产生交互式响应和进行动画处理。9、超强的扩展能力Dreamweaver还支持第三方插件，任何人都可以根据自己的需要扩展Dreamweaver的功能，并且可以发布这些插件。2.2.2PhotoshopCSPhotoshopCS是一款图形、图像编辑软件，在网页设计领域被广泛得应用。以下是其10大最新功能：1、改进的文件浏览器使用功能强大文件浏览器的可以快速预览、标注和排序图片；搜索或编辑图像的数据元或关键词；并且可以自动批量共享文件。2、匹配颜色命令可以迅速从一张图片的颜色校正另外一张图像的颜色。3、直方图调色板随时根据对图像的调整更新直方图调色板(HistogramPalette)。4、阴影/加亮区修正使用“阴影/加亮区修正(hadow/Highlightcorrection)”可以快速调整照片中曝光过渡或欠缺的区域。信息工程学院毕业设计（说明书）65、沿路径放置文本可以像在Illustrator中一样把文本沿着路径放置，