《网站建设与web设计》实验指导书
实验一网站建设规划和网站建设初步
实验目的
1.对网站进行目标定位
2.观察适合在网上销售的商品类别
3.提出创建网站的商品目录结构
4.规划网站的框架结构
5.分析建站的步骤与方法
6.熟悉申请域名的流程和管理机构。
7.掌握IIS的使用技巧。
8.练习在IIS中建立站点和对站点进行管理。
实验目标
1.提出网站建设过程中系统规划的总体思想和原则。
2.确定企业网站销售商品的分类方法,方便用户快速浏览,找到自己所需要的商品或服务。
3.确定网站提供服务的大框架,使浏览者能够在首页上通过网站的提示迅速进入自己需要
的页面。
4.为网站选择适当的方案,满足企业业务量的需要,具有服务稳定、价格适中、沟通便利、
易于扩展的特点。
5.能正确安装IIS
6.0
6.在IIS中建立和管理站点。
实验内容
1.浏览大量成熟网站,参考网站的商品分类方法。(亚马逊https://www.wendangku.net/doc/8513379220.html,、戴尔
https://www.wendangku.net/doc/8513379220.html,、首都电子商城https://www.wendangku.net/doc/8513379220.html,、阿里巴巴https://www.wendangku.net/doc/8513379220.html,)
2.参考https://www.wendangku.net/doc/8513379220.html,网站建站的方案,明确建设网站的步骤—般经过网站规划、域名注册、
服务器配置、网页设计、网站测试与发布、网站管理与维护、网站推广等步骤就可以实现。
建站时可以是企业独立建站,可以是托付给相应的公司建站,也可以采取双方合作的方式建站。在分析企业需求时侧重点有所不同,要予以考虑。
3.申请域名(可选做)
一个好的域名应该与企业的性质、企业的名称、企业的商标及平时的企业宣传一致。选择与本公司密切相关的域名,但注意不能超过20个字符。
访问中国互联网络信息中心https://www.wendangku.net/doc/8513379220.html,,查询域名认证注册服务机构,选择一家
机构申请注册自己的域名。
4.DNS设置(可选做)
5.设置Internet信息服务管理器(IIS)
6.Web站点的建立和管理
7.以小组的方式,规划一个电子商务网站(如网上书店、鲜花礼品商务网站、在线电脑销
售网站等)。要求规划网站的栏目、形象设计、导航设计、网页布局设计,画出草图。、实验二创建一个静态页面——网站首页
实验目的
1.熟练掌握静态网页的制作
2.掌握简单的表单制作方法
实验要求
环境准备:
计算机中装有IIS、网页制作工具(如Dreamweaver或Frontpage等)软件、网页制作相关的素材和资料。
知识准备:熟练掌握网页制作工具的使用方法。
实验目标
创建如图2-1所示的“静雅书苑的网上书店”网站首页。
图2-1 问题分析
网页设计容易出现下列问题:
●乱:网页内容太庞杂。
●无吸引力:太简单,显得单调。
●打开速度太慢:网页中使用了过多的多媒体元素。
●重要信息不容易找到:原因是缺乏规划,没有对浏览者需求进行深入分析。
解决方法
●乱:网站首页布局要合理,分类清晰。
●无吸引力:网站首页要提供足够的信息。
●打开速度太慢:首页上图片的大小和使用数量要适当。
●重要信息不容易找到:从网站浏览者的角度分析进行分析,确定内容安排。
实验步骤
(1)启动网页制作工具Dreamweaver软件。
(2)建立本地站点。设置本地根文件夹为D:\jingya。
(3)新建一个静态网页文件,保存该文件名为index.htm。
(4)设置页面属性,在标题处输入“静雅书苑”,“左边距”和“上边距”都设置为0。
(5)插入一个表格,表格参数设置如图2-2所示。
图2-2
(6)选中整个表格,在属性面板中设置表格对齐方式为“居中对齐”,如图2-3所示。
该表格将控制网站首页的整体布局,使网页在不同分辨率的显示器上都能正常
显示。
图2-3
(7)在表格中插入一个1行3列的表格,在属性面板中的“表格ID”框中命名该表格为B1,设置该表格属性为高60,宽度为100%,单元格对齐方式为垂直方向
“顶端对齐”。设置该表格第1、3列列宽为25%,第2列列宽为50%,效果如
图2-4所示。
图2-4
(8)在表格B1的第1和第2单元格中分别插入网站的logo和Banner图片(事先用photoshop或Fireworks软件制作好),如图2-5所示。
图2-5
(9)在B1的第3列中插入一个3行1列的表格,命名该表格为B11。表B11宽100%,,并在B11表格中填入如图2-6所示的内容,并设置B1的背景图片。
图2-6
(10)在大表格中插入一个如图2-7所示的1行5列的表格,在属性面板中命名为B2。
该表格用来制作网页的导航栏。
(11)插入一个如图2-8所示的2行7列的表格,命名为B3。
(12)在B2表格中插入准备好的导航栏图片和填入如图2-9所示的其他项目。
(13)在B3表格中填入如图2-10所示的相关内容。
图2-10
(14)为分类导航栏设置链接(在没有准备好其他页面的情况下,可以先用#设置无址
链接),如图2-11所示。
图2-11
(15)在分类导航栏下面插入一个如图2-12所示的1行3列的表格,命名该表格为
B4。
(16)在表格B4的第1列中制作一个会员登录表单,如图2-13.所示。
(17)制作如图2-14所示的“图书商城”、“影视商城”和“音乐商城”分类索引表格。
图2-14
(18)为“图书商城”、“影视商城”和“音乐商城”分类索引表格设置背景颜色,如#CCCCCC。在B4表格的第2单元格中制作“持续热销”图书信息,如图2-15
所示。
(19)在B4表格的第3单元格中制作“最近新书”栏目的内容,如图2-16所示。
(20)制作“本月销售排行”栏目,如图2-17所示。
(21)制作首页下方的版权信息,单元格背景图片为topback.gif,如图2-18所示。
图2-18
(22)给网页添加Style.css样式表。代码如下:
tr { font-family: "宋体"; font-size: 9pt}
a:link { color: #000000; text-decoration: none}
a:visited { color: #000000; text-decoration: none}
a:hover { color: #3333FF; text-decoration: underline}
form { margin-top: 0px; margin-bottom: 4px}
(23)叮当网站首页的预览效果,如图2-19所示。
图2-19
实验三制作一个网站用户注册的ASP动态页面
实验目的
1.了解ASP的特点
2.掌握设置ASP的运行环境
3.学习ASP进行网络程序设计的开发
4.学会调试ASP程序
实验要求
环境准备:计算机中装有IIS
知识准备:会使用Dreamweaver等网站开发软件,掌握动态网页设计的方法
实验目标
实验步骤
第一步:配置ASP运行环境
要使用ASP创建动态网页,首先要从硬件和软件方面配置好ASP的运行环境。
在硬件方面,必须在计算机上安装网卡,并接好网线。
在软件方面,必须安装TCP/IP、服务器软件及浏览器软件,并指定本机的IP地址。
在满足了以上条件后,还要安装5.0以上版本的IIS。
(1)安装IIS
单击“开始->设置->控制面板->添加或删除程序”命令,安装Internet信息服务组件。
(2)测试IIS
在浏览器的地址栏中输入http://127.0.0.1或http://localhost或http://计算机的IP地址或http://计算机名,如能显示IIS的帮助页面,表示测试成功。
(3)配置WEB站点
打开IIS管理器,设置“默认web站点”
①打开“默认web站点”属性对话框
②Web站点设置
③主目录设置(网站的根目录设置为主目录)
④默认文档设置(设置网站首页为默认文档,上一次实验课的index.html页面
添加为默认文档)
配置完成后,进行测试,在浏览器中输入http://localhost即可打开index.html页面。(4)创建虚拟目录
虚拟目录就是相对于IIS的根目录来说的,一个站点的根目录只能有一个,为了多个Web应用程序运行于一个IIS服务器上,就为其虚拟一个IIS目录。每个虚拟目录受控于跟目录的管理,有其特定的权限管理,也可以继承根目录的权限设置。
要通过URL访问网页,需要输入http://localhost/虚拟目录名/文件名
如果要在网络中的其它计算机上访问上述网页,使用计算机名或IP地址来代替localhost 即可。
第二步:制作一个网站用户注册的ASP动态网页
1.制作一个用户注册页面,文件名保存为customer_register.htm,效果图如下:
(1)新建header库,如图所示
(2)新建navigation库,如图所示:
(3)新建footer库,如图所示:
(4)建立用户注册页面,如图所示:
2.制作一个获取用户注册信息的页面,文件名保存为customer_request.asp,效果图如下:
获取注册信息的VBScript的脚本代码如下:
<%
Dim username,pass,comfpass,wenti,daan,name,city,address,zip,phone '为了引用方便,声明变量
username=Request.Form("username")
pass=Request.Form("pass")
comfpass=Request.Form("comfpass")
wenti=Request.Form("wenti")
daan=Request.Form("daan")
name=Request.Form("name")
city=Request.Form("city")
address=Request.Form("address")
zip=Request.Form("zip")
phone=Request.Form("phone")
Response.Write "
用户名:" & username
Response.Write "
密码:" & pass
Response.Write "
确认密码:" & comfpass
Response.Write "
取回密码问题:" & wenti
Response.Write "
取回密码答案:" & daan
Response.Write "
真实姓名:" & name
苏州市职业大学 计算机网络与WebGIS实验报告 姓名: 学号: 学院: 班级:
实验一利用HTML制作表单 1.实验目的 了解掌握HTML语言:基础知识、编辑文档、超链接;图像与多媒体、表格、框架和表单 2.实验要求 硬件:GIS机房配置已达到要求; 软件:Win2000/WIN XP、记事本 3.实验内容 利用所学HTML语言完成表单制作,界面可参考图1,在制作过程中了解HTML文档的基本格式,尤其是表单标签