《网络设计与开发》实验指导书

1、网络设计与开发实验指导书 东北大学秦皇岛分校经济管理系二零零三年八月目 录实验一 搜索引擎的使用实验二 使用记事本编写一个简单的HTML文档实验三 使用Frontpage和Dreamwaver等工具软件制作网站实验四 利用Photoshop处理图像实验五 网站建设综合实验实验一搜索引擎的使用实验目的通过使用浏览器提高同学们对目前广为应用的几种搜索引擎的使用，使同学们掌握如何从网络中查找自己所需资料的能力。实验设备与软件需求可上互联网PC机一台，安装有Windows操作系统，使用IE浏览器。实验内容及步骤打开计算机使用IE上网。在地址栏当中键入搜索引擎的地址，如 HYPERLINK ，见图1-1

2、。在搜索栏中键入“网页制作”后按google搜索，搜索结果会如图1-2。图1-1 HYPERLINK 的页面大家发现满足条件的网页可能太多，我们可以使用高级搜索来进行更加细化的搜索。图1-2搜索“网页制作”图1-3使用高级搜索5、在高级搜索中键入HTML，我们将可以搜索到一些与网页设计中HTML文档制作相关的一些网站。注意事项1、高级搜索的正确使用。2、如何判断是否为所要查找的网页制作的相关资料。预习要求熟练使用浏览器。选择几个搜索引擎。实验二 HYPERLINK /department/xxx/syzds/SYZDS_WY2.HTM 使用记事本编写一个HTML文档实验目的通过使用记事本编写一

3、个简单的HTML文档使同学们对HTML文档有一个初步的了解，初步掌握一个最简单的HTML文档所应该包含的内容。实验设备与软件需求PC机一台，安装有Windows操作系统，使用IE浏览器。实验内容文档使用Windows操作系统自带的记事本程序编写。要求窗体标题为“Welcome to NCWRC” 使用*HTML文档由head和body两部分组成 使用*和* 用浏览器阅读时要看见4段文字，每段文字的size分别是8、6、4、2 使用* 其中要求每段文字的颜色不同，分别为#00ffff、#882299、#ff0088、#55ccaa 使用* 每段文字要求居中排列 使用*编写完成后用HTML为文件扩

4、展名存盘，存在桌面上就可。使用浏览器浏览我们用记事本编写的HTML文档结果应该如图2-1。注意事项HTML文档应该以开头，以结尾。记事本存盘时应注意存盘的方式。预习要求对HTML文档的基本构成要有一个全面的了解。可阅读简单的HTML文档。图2-1浏览html文档实验三 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM 使用Frontpage和Dreamwaver等软件制作网站实验目的使用 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Frontpage和Dreamwaver等工具软件制作网站，练习工具软件的

5、使用。熟练掌握网页制作的一个工具来制作网站。实验设备与软件需求PC机一台，安装有Windows操作系统， HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Frontpage和Dreamwaver等工具软件。实验内容自己设计一个的网站，画出系统结构图及流程图。根据自己设计的网站，使用Frontpage和Dreamwaver等工具软件，来完成。浏览、测试并发布自己制作的网站。注意事项一定要注意网页的名称，不要使用汉字。发布出现问题，要自习检查。预习要求设计出自己的网站。参考相关的网页制作工具书。实验四 HYPERLINK /department/xxx/

6、syzds/SYZDS_WY0.HTM 利用Photoshop处理图像实验目的通过 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM 利用Photoshop来处理图像，了解图形图像处理的一般过程，并会简单的图形图像处理。实验设备与软件需求PC机一台，安装有Windows操作系统和 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Photoshop图像处理软件。实验内容搜集一些图片，也可以 HYPERLINK /department/xxx/syzds/SYZDS_WY0.HTM Photoshop的相关实例中

7、获得。启动Photoshop 6.0，单击，指向程序，指向Adobe，然后再单击Photoshopshop6.0就启动Photoshopshop6.0了。Photoshop6.0的桌面环境打开后的Photoshop6.0的界面环境如图4-1所示。图4-1 Photoshop6.0的界面环境文件的建立和存取。单击，单击，弹出如图4-2所示对话框。输入文件名，Photoshop6.0的缺省文件名是Untitled-1，也可以再保存文件时再键入文件名。设置文件的宽度、高度，单位可以为象素、厘米、英寸、点、派卡。文件的分辨率。分辨率越搞，图像越精细，同时文件也越大。图4-2 新建文件设置色彩模式。单击

8、右边的下拉黑三角符号，出现列表如图4-3所示RGB、CMYK、Lab、灰度、位图模式可以选择。文档背景区域有三个选项，可以选择白色、背景色、透明色。单击按钮，完成新文件的创建。图4-3设置色彩模式打开图像。单击，单击，弹出如图4-4所示对话框。单击搜寻列表，找到文件所在磁盘和文件目录。单击要打开的文件名，或者在输入文件名。单击，即可打开所需的文件。也可在第三步直接双击也能打开文件。图4-4 打开图像对话框当处理完一幅图像，如何保存起来呢？就像保存任何文件一样，只需将图像改为你想要当格式即可。单击，单击，如果文件已经命名或是编辑原有的文件，则系统直接保存。否则弹出如图4-5所示对话框。图4-5

9、保存图像在下的列表中找到对应的文件夹，在键入文件名。在下拉列表中找到相应的图像格式。单击，图像即被保存在相应的目录下。 具体的可参考相关的Photoshop书籍和资料，自己学习和练习，掌握Photoshop图像处理的基础知识。预习要求参考Photoshop6.0的图书。注意随时存盘。实验五 网站建设综合实验实验目的通过本次实验，学生应具有规划、设计电子商务网站的能力；掌握至少一门开发网站的技术；掌握学习工具软件的方法。实验设备与软件需求PC机一台，安装有Windows操作系统，IIS，JSP的开发和发布的环境（J2DK,TOMCAT），网页制作工具Dreamweaver、Frontpage。实验内容自己选择一个网站题目，规划出系统开发报告，写出详细的设计文档。根据自己的设计方案，进行开发网站，开发出前台，设计后台数据库、表，开发出的网站具有交互式的功能，例如注册系统、聊天室、BBS论坛等等。开