网页设计课程报告

    网页设计课程报告

设计主题： 青花瓷展览

指导老师： 张老师

所在专业： 09信息管理

所在班级： 二班

姓    名： 林勇

设计时间：2010年12月1日

目录

一、前言……………………………………………………….3

二、网站总体分析与设计    4

1.网站开发环境    4

2.服务器端    5

3.客服端    5

三、网站的组成及内容    7

（一）实现的关键技术    7

1. iframe框架介绍与应用    7

2.ajax技术应用    7

（二）实现过程及代码实现    8

四、总结    11

一、前言

提起青花瓷，人们都知道它是景德镇四大传统名瓷之一。其瓷白中泛青、其花青翠欲滴、是典雅素静的“人间瑰宝”。目前发现最早的青花瓷标本是唐代的,成熟的青花瓷器出现在元代。青花瓷有自己的发展历程：唐代的青花瓷器是处于青花瓷的滥殇期；唐青花经过初创期以后，并没有迅速发展起来，而是走向了衰败。到目前为止，我们能见到的宋青花只有从两处塔基遗址出土的十余片瓷片；成熟的青花瓷出现在元代的景德镇；明清时期是青花瓷器达到鼎盛又走向衰落的时期。青花瓷以其独特的色彩和文化，赢得了世界各国的好评，它不仅代表了中国文化而且以其巨大的商业价值而著称于世！

本网页运用通过图片及文字说明，介绍青花瓷的历史发展，让人们更加了解它独特的美感的同时给人于精神文化享受。

本网叶制作成功地运用ASP.NET改进了ASP的缺陷，使得更易于创建动态Web内容和复杂而可靠的Web应用程序。从底层来说，ASP.NET在服务器端的机制完全是基于Microsoft .NET框架的，这是ASP.NET区别于ASP最根本的特点。用ASP.NET来开发交互式网页,不仅保持了ASP原有的优点，而且可以使用Web服务器控件和HTML服务器控件更加有效地完成系统开发工作。

二、网站总体分析与设计

2.1 设计思想

  运用网页设计的相关知识，设计简单又不失优美、朴素又不失庄重的网页。能够短时间里能吸引浏览者眼球，通过图片、文字、视频等内容传递所需信息，让浏览者过目不忘！主题明确有特色，内容丰富，巧妙运用图片，注意背景颜色等。

2.2 开发工具的选用及介绍

  Dreamweaver是目前世界上最受欢迎的专业级网页制作编辑工具Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台和跨越浏览器的充满动感的网页。

Dreamweaver、FLASH以及在DREAMWEAVER之后推出的针对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)，足见市场的反响和MACROMEDIA公司对它们的自信。说到DREAMWEAVER我们应该了解一下网页编辑器的发展过程，随着互联网(Internet) 的家喻户晓，HTML技术的不断发展和完善，随之而产生了众多网页编辑器，从网页编辑器基本性质可以分为所见即所得网页编辑器和非所见即所得网页编辑器（则原始代码编辑器），两者各有千秋。所见则所得网页编辑器的优点就是直观性，使用方便，容易上手，您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别！

2.3网站系统分析

  本网页运用通过图片及文字说明，介绍青花瓷的发展历史，让人们了解它独特的美感的同时给人于精神文化享受

1.网站开发环境

●网站开发环境：microsoft visual studio 2005集成开发环境

●网站开发语言：asp.net2.0.

●网站后台数据库access2000

●开发架构：asp.net+ajax

●开发运行环境windows xp  windows vista

2.服务器端

●操作系统windows 2003  server

●Web服务器iis7

●数据库服务器access

●浏览器ie6以上版本

●网站服务器运行环境：microsoft.net framework sdk  v2.0

3.客服端

●浏览器internet explorer 6.0以上。

●分辨率：最佳效果1024*768

2.4页面设计

网站内容设计：                  

1.主页部分导航包括展览主页、国外展览、国内展览部分、特色展览部分及历史简介。

2.主页和子页布局方面大部分由布局表格来完成，而且主页LOGO部分、TOP部分、导航条等部分由主页生成模板应用到各个子页里。

3.首页:主要分布有导航条栏、青花瓷LOGE图片（国内外）、相关广告。

展览首页:主要通过青花瓷图片展示其魅力和风格。

海外展览:主要是展览流落于国外的的青花瓷瑰宝。

国内展览：主要是展览流行于国内的几款青花瓷。

特色展览:主要展示几种特色青花瓷的种类和款式。

历史简介:主要介绍青花瓷相关历史和相关文化。

4.网站的CSS样式由内部和外部CSS样式组成。

5.网站主要由文本、图片、flash、特效等元素构成。

三、网站的组成及内容

（一）实现的关键技术

1. iframe框架介绍与应用

页面的结构主要采用iframe框架结构 

浮动框架的属性如下表:

Ajax主要用于局部区域更新更新范围小往返数据量小，没有屏幕滚动用户体验好。

在使用ajax时要安装asp.net2.0ajaxextension1.0msi安装后将visualstudio 2005编辑器将ajax集成进来。如果是visualstudio 2005不用安装 已经集成进来了。

聊天器模块主要用到的控件有scriptmanager ,updatepanel ,timer.

2.2.1 Scriptmanager控件的主要属性和方法

Updatapanel控件的主要属性

Timer是一个定时器控件，可以设定特定时间规律触发

●主要属性

Enabled属性：是否启用true为启用false为不起用

Enabledviewstate属性：是否自动保存其状态以下用于往返过程

Interval属性：用于定义触发间隔时间 单位ms

●主事件

Tick：当到达间隔触发时间后，自动触发时间。

（二）实现过程及代码实现

2.1页面设计

页面中涉及的主要控件及用途如下表：

实现主题图片嵌入

展览的几个主要导航条

.2.3常见开发技术问题总结

在这里简单的描述开发时遇到的一些问题，希望能够对读者在以后开发项目有一些帮助。

网站显示乱码

网站出现乱码与默认编码格式有关，在这里可以在网站的web.config配置文件中，同一网站编码格式

代码如下：

在application_start事件中不能使用response对象。

此时在application_start事件并不能响应页面，还没有执行到resquest_begin事件，可以通过使用conexant.response来解决此问题。

●Session对象在application_onacquirereaqueststate事件中无效

Session对象只有在application_onacquirereaqueststate事件调用以后才能生效

●Session对象在global.asax全局文件中生效事件

Session对象只有在触发acquirereaqueststate事件之后生效，在触发该事件后就一使用session对象了 

●获得当前session中保存的所有对象

通过遍历所有的session_key来获得

代码如下：

Arraylist sessionCollection=new arraylist()

Foreach(string strKey in session.Keys)

{

sessionCollection[strKey];

}

四、总结

首先我要做的就是要选择好题目和网站的风格，之后我就分步骤准备在制作网站前所要做好的准备工作。我浏览了各大网站的一些特点，借监这些网站的优秀之处，不好的地方在自己的网站上加以改良，从而使自己的网站更加美观。

回顾这次课程设计，至今我仍感慨颇多。的确，从选题到开始制作，从理论到实践，可以说得是苦多于甜，但是可以学到很多很多的的东西，同时不仅可以巩固了以前所学过的知识，而且学到了很多在书本上所没有学到过的知识。

在选择好题目和网站的风格之后，我就开始了实训项目的进程，按照实训方案的规定，先是将网站的总体策划以书面的形式展现出来，通过审核之后，在相应的时间段找相关的素材，搜集与主题相关的文字、图像等。再是设计网站的内容结构、目录结构和链接结构，设计首页及其页面的版式结构。然后创建本地网站，建立网站的目录结构。制作首页、二级子页、内容页，创建超级链接。最后就是测试与浏览网页，如果还有什么不理想的地方再改进再预览，如此反复，最后达到最好效果！

在此次网站的设计与制作过程中，难免会遇到过各种各样的问题，这毕竟是第一次独自设计网站、制作网站。但值得高兴的是：在设计的过程中发现了自己的不足之处，对以前所学过的知识理解得不够深刻，掌握得不够牢固，没有能完全达到自己预期的效果，还好通过老师的细心指导才能达到最终效果……

一周网页设计与制作的实训课程结束了，回顾这次课程设计实训，至今我仍感慨颇多。的确，从选材到开始制作，从理论到实践，在两周的实训日子里，可以说得是苦多于甜，但是可以学到很多很多的的东西，同时不仅可以巩固了以前所学过的知识，而且学到了很多在书本上所没有学到过的知识。更懂得并亲身体会到了理论与实际相结合的重要性，只有理论知识是远远不够的，把所学的理论知识与实践相结合起来，从理论中得出结论，才能真正为掌握技术，从而提高自己的实际动手能力和思考的能力。