网站设计与架构实验模板本科Word下载.docx

1、 南京邮电大学 管理学院 网站设计与架构 课程实验第 一 次实验报告实验内容及基本要求：实验项目名称：网站规划与平台搭建实验类型：操作每组人数： 1实验内容及要求：内容：网站调查、案例分析要求：抽取相关约束条件，合理构建电子商务平台实验结果： 一、创建三个站点（1）首先将D盘中的garden1、htmltest、mysite三个文件夹复制到C盘Inetpub文件夹的wwwroot文件夹中形成镜像。（2）然后打开dreamweaver软件，在站点菜单栏下新建站点。（3）第一个站点名为garden1，本地根文件夹选择D：website designgarden1，默认图像文件夹为D：website

2、 designgarden1image。（4）访问本地/网络，相对应的远端文件夹为C:Inetpubwwwrootgarden1。同是选择维护同步信息和保存时自动将文件上传到服务器。（5）服务器模型为ASP VBScript。将相关信息填完后，即可建立一个站点，其余两个站点的建立方法同上。建立完成后，得到如下结果：二、案例分析：garden1中打开index.asp，在浏览器中预览/调试。妆园已经是一个功能较完善的网站，具备促销专区、缺货登记、新闻动态等功能。网站的整体布局符合人机交互式界面便于浏览。各个链接都是有效的，点击后能够自动跳转到相应的界面，并且界面正常显示。再来看XX的静态页面，整

3、体简洁美观。没有任何冗余的文字，以按钮和链接的形式满足其复杂的功能， 至简主义的设计风格跃然纸上。南邮的静态页面中，主要呈现的是南邮新闻，通知及公告。一打开就能知道最新资讯，一目了然。当然也涵盖了其他链接，实现了一个功能丰富齐全的公共网站界面。但大篇幅的新闻占据主体部位，不能满足最佳人际交互式界面需求，可以使用单独链接跳转新闻界面使用户浏览使用更便捷。三、心得体会 虽然我目前为止还不能独立设计出一个完整的HTML静态页面，但通过浏览分析妆园、南邮主界面以及XX的静态页面，我能够大概了解到静态网页的布局要满足人机交互式界面的需求。在功能方面不要求复杂，但基本功能必须包括。像XX的界面就做到了既简

4、洁功能又全面，不失为一个好的搜索引擎网页的样板。预览调试这些网页后，为我日后设计网站界面打下了一定的基础。成绩评定：该生对待本次实验的态度 认真 良好 一般 比较差。本次实验的过程情况 很好 较好 一般 比较差对实验结果的分析 很好 良好 一般 比较差文档书写符合规范程度 很好 良好 一般 比较差综合意见：成绩指导教师签名沈超日期2015-4-14 网站设计与架构 课程实验第 二 次实验报告使用Dreamweaver设计静态网页熟悉设计软件DreamWeaver选择设计主题并利用网络元素进行网站设计一、 新建htmltest站点站点处新建站点htmltest，浏览相应的html静态网页。3-1

5、主要是对HTML文件的背景进行改变，包括加入JPG、GIF格式的背景，以及改变背景的颜色。在10.htm这个例子中，通过在浏览器中预览调试可以用一个链接使网页跳转到22.htm即南邮主界面。3-2的例子是关于改变文字的字体、大小、颜色、加粗、下划线、删除线、上下标等。07.htm中有一个特殊的强制不换行的代码，打开浏览器预览时无论怎样改变窗口的宽度都影响不到文字的行数显示。二、手写代码实现窗口处添加CSS样式一栏，新建一个类，选择Font-size改变字体的大小，Font-family则可以改变字体（编辑字体列表可以添加更多的字体类型），color中自由选择字体颜色，而Background-c

6、olor改变的是背景颜色。新建几个不同字体、颜色、大小的类后就可以对文字的样式随意改变。编辑后的效果如下图所示：二、 表单设计新建一个空的HTML页面，在设计版块中先插入表单，再插入一个10*10的表格。输入相关文字，姓名、密码、电子邮件地址后添加文本域，性别选项添加单选按钮进行选择，职业选项需要插入列表/菜单并在列表值中添加项目标签，个人爱好的选择通过3对复选框组实现，最后的留言内容后插入文本区域即可。表单基本内容设计完成后，添加提交、重置按钮完善功能。最后合并或删除多余单元格，调整表格样式。在层叠样式表中添加新的类，改变表格中字体颜色、表格背景等。得到如下图所示的表单：。三、 实验心得通过

7、本次实验，了解了层叠样式表的用法，并且学会使用层叠样式表来改变网页的整体表现形式。并且层叠样式表的修改较为简单快捷，适用于网页设计的很多方面，让网页样式设计得非常美观，才能吸引用户的点击量。在表单设计时也可以通过层叠样式表来修改表单的表现形式，使图表变得更加美观，再加上表单中的按钮、复选框、文本域等，就可以完成一个完整的网页表格。与之前的手工表格相比较，电子表格传播更为广泛，为调查分析提供了便利。2015-4-16 网站设计与架构 课程实验第 三 次实验报告VBScript语言的使用熟悉VBScript语言的使用；掌握使用VBScript语言设计动态网页技术一、熟悉VBScriptVBSCri

8、pt是ASP的脚本语言，一般是在服务器端执行的。ASP就是一种技术框架，它为嵌入HTML的VBScript提供了运行环境，并把两者有机地结合在一起，各取所长。它利用VBScript的变量、数组、函数、运算等基本语言元素以及过程、分支判断、循环等高级语言特有的程序设计功能去弥补超文本标记语言HTML的不足。同时又利用HTML能够被客户端浏览器解释执行的特点，将VBScript在服务器端运行的结果在浏览器上显示输出。了解VBScript在服务器端执行有两种语法格式：格式1: 格式2:Script Language=”VBScript” Runat=”Server” VBScript代码/Scrip

9、t将VBScript代码放在客户端执行，这时的语法格式如下：Script Language=”VBScript”二、VBScript设计动态网页在实际应用操作时，可以发现VBScript继承了VB的所有类别运算符，对变量的声明要求也有相似之处。通过运用数据转换函数、时间函数、字符串函数、输入输出函数来设计网页。结合mysite中静态网页的代码来分析VBScript语言在实际中的应用，不难发现循环语句应用十分广泛。Do循环和For循环的应用效果也是不同的。过程分为两类，由Sub子程序和Function函数。两者区别体现在Sub子程序只执行操作但不返回值，而Function函数可以将执行操作后结果

10、返回给调用程序。三、实验心得通过此次实验，初步学习使用VBScript编写asp网页，也让我明白和记住会应用vb脚本语言的重要性。只有对其有一定的了解才会应用。2015-4-21 网站设计与架构 课程实验第 四 次实验报告综合网站设计网站内容的整体设计。熟悉网站设计涉及的相关技术，结合具体背景环境设计一个完整的网站。一、 研究分析案例garden1 garden1案例中主要是以一个化妆品购物“妆园”作为分析研究的对象。在该网站的购物流程包括浏览、下单、购买、以及填写客户信息。每个功能作为一个单独的模块与其他模块之间保证了模块的独立性，这样一来使复杂的程序拆分为一个个简单的程序。从网站的设计角度出发，妆园主要面向女性消费者，所以采用了粉色的基调，赢得女性的青睐。研究过程中我发现，Dreamweaver提供给用户代码与视图相结合的功能，无论是分析还是设计网页时都能一目了然。二、 实验心得 总的来说，一个网站的内容，当然越多会会好，只是再资料多的同时，也要注意到这个资料是否切合主题、是否对网站有用、归纳的是否妥当明了、有没有不必要的档案，这样网页的内容才能真正渐渐迈向量多质精之路，也才能走出属于自己主题的风格。2015-4-23