web网站开发实验报告.docx

《web网站开发实验报告.docx》由会员分享，可在线阅读，更多相关《web网站开发实验报告.docx（12页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、web网站开发实验报告 web网站开发试验报告西安理工高校试验报告成果第1页（共4页）课程：Web网站开发试验日期：201*年6月11日专业班号：组别：交报告日期：201*年6月14日姓名：学号：报告退发：（订正、重做）同组者：老师审批签字：一、试验性质设计型试验（2学时）二、试验目的通过试验，使学生理解表单验证及网页布局设计的基本思路，驾驭表单验证及网页布局设计的基本方法，通过表单验证和网页布局的联系，进一步理解网站开发的基本思路，并能够依据应用需求设计一个合理的网页来解决实际问题，提高学生的动手实力以及理论与实践相结合的实力。三、试验任务1驾驭网页布局的基本思路和方法。2驾驭表单验证的基本

2、思路和方法。四、试验打算复习教材中有关网页布局及表单验证的内容，细致阅读和分析教材中的例子。五、试验内容1网页布局应用Dreamweaver程序对网页进行布局。（1）选择“文件”|“新建”吩咐，在弹出的对话框中新建一个网页，名为bd.html，在“文档”工具栏中将网页的标题设置为“表单应用”。（2）插入一个2行1列表格（表格1），表格宽度为“98%”，边框为“0”。（3）在表格1的第一个单元格中输入文字“表单应用”，设置该文字字体为“隶书”，大小为“36”像素，前后都插入图片logo_3.jpg。（4）将光标定位在表格1的其次个单元格中，选择“插入”|“表单”|“表单”吩咐，在该单元格中插入一

3、个表单域。（5）在表单域中插入一个15行2列的表格（表格2）。表格宽度为500像素，边框为“1”，间距为“0”。将该表格的左边列全部单元格的宽度设置为“90”像素，前9行单元格高度设置为“30”。（6）将表格2的第一行合并为一个单元格，设置单元格水平对齐方式为“居中对齐”，背景颜色为“#DF3071”。在单元格中输入文字“请完成以下内容的填写”，设置文字的大小为“18”像素，颜色为“白色”。（7）将表格2的左边列各单元格的水平和垂直对齐方式都设置为“居中”对齐，并分别输入文本信息：昵称、密码、确认密码、性别、籍贯、诞生日期、电子邮箱、联系电话、个人爱好、照片和备注，如下图所示：（8）将光标定位

4、在其次行其次个单元格中，单击“插入”工具栏上的“表单”类别，然后单击“文本字段”按钮，在弹出的对话框中单击“确定”按钮即在单元格中插入了一个单行文本框。设置该文本字段的字符宽度为“24”。在文本字段后输入“*”。效果如下图：（9）用同样的方式在“密码”和“确认密码”后插入文本框。选中文本框，在“属性”面板中设置名称为psw，字符宽度设置为24，最多字符数为12，类型设置为“密码”。属性如下图所示:(10)将光标定位在性别后的单元格中，单击“插入”工具栏上的“表单”类别，然后单击“单选按钮”按钮，在协助功能属性窗口中的标签文字中输入“男”，如下图所示。确定后则在单元格中插入了一个单选按钮。设置刚

5、插入的单选按钮的名称为sex，选定值为1，初始状态为“已勾选”，如图所示：（11）用同样的方法在男的后面插入一个单选按钮，在“属性”面板中设置单选按钮的名称为sex，选定值为2，初始状态为“未选中”，并在该按钮后输入文本“女”。最终效果如下图所示：（12）将光标定位在籍贯后的单元格中。单击“列表/菜单”按钮，则在插入点添加一个菜单，在菜单的“属性”面板中设置名称为”jg”，类型为“菜单”。在“列表值”对话框中添加项目如下图所示。设置好列表值后，在“属性”面板中设置初始化时选定“四川”。在菜单后输入文字“省（市）”。最终效果如下图所示：（13）用同样的方法设置诞生日期如下图所示：（14）参考昵称

6、后文本字段的方法设置“电子邮箱”和“联系电话”，效果如下图所示：（15）将光标定位在个人爱好后的单元格中，插入复选框。将插入的复选框名称设置为hobby，选定值设置为internet，初始状态为“未选中”，并在复选框后输入文本“网络”。用同样的方式插入其他复选框，名称都设置为hobby，选定值分别为：music、travel、read、sports和draw。外观效果如下图所示：（16）将光标定位在照片后的单元格中，插入“文件域”。外观效果如下图所示：（17）将光标定位在备注后的单元格中，单击“文本区域”按钮，在插入点添加一个文本区域对象。在“属性”面板中设置插入文本区域的字符宽度为40，行数

7、为5，换行为“默认”。（18）在表格2的第13行右边单元格中输入以下文字：1.请填写上面的的各项内容。2.带星号的项目为必填项。3.感谢您提交以上重要信息。（19）将表格2的第14行合并为一个单元格。设置单元格水平对齐方式为“居中对齐”，背景颜色为“#DF3071”。在单元格中输入文字“填写完成后，选择下面的”提交“按钮提交表单。”，设置文字的大小为“14”像素，颜色为“白色”。（20）将表格2的最终一行合并为一个单元格，在“插入”工具栏中单击按钮，将插入的按钮值设为“提交”，动作设为“提交表单”，用同样的方法插入其次个按钮，将该按钮的动作设置为“重置表单”。效果如下图：（21）保存文件。（2

8、2）设置超链接打开Frameset.html文件。在该框架文件的左边导航列表中选中文字“表单应用”，设置超链接文件为“bd.html”，目标为“mainFrame”。属性如下图所示：（23）在阅读器中预览效果。2表单验证对已做成的网页中“昵称”、“密码”、“确认密码”和“电子邮件”进行非空验证。下面以“电子邮件”为例，对其进行非空验证。functionfunCheck()if(document.form1.text4.value=)alert(“电子邮件”不能为空。)returnfalseelsereturntrue六、试验总结通过这次试验，我才真正理解了“纸上得来终觉浅，绝知此事要躬行。”这

9、句话的真谛。在网页布局部分，出现的问题不大，主要是将网页能够设计得美观一些；在表单验证部分，出现的问题主要是不知道将编写好的alert程序放入代码中的位置。为了能够做出最终验证的结果，我试了很多次，不断通过Web阅读器进行修改。其实没找到正确的位置主要是因为没有留意到标记。最终，经过自己的一番努力还是做出了非空验证的效果。扩展阅读：Web网站开发技术实训报告数码商城网站开发实训报告系、班级：学号：姓名：指导老师：07级电商（1）班201*201*0109*201*年6月书目一、网站建设基本流程.1二、网站域名及网站技术规范1三、网站的基本功能和内容1四、网站优化.2五、网页模版设计.2六、网站

10、运营维护.3七、补充内容.37-1、网站规划.37-2、菜单设置.37-3、网站首页.37-4、网页字体和美工.4八、网站建设中必需克服的问题.48-1、网站规划和栏目设置要合理.48-2、重要的信息要完整.48-3、网页信息量要足够.48-4、栏目层次要过深.41、网站建设基本流程规范网站建设包含下列基本流程：（1）制定网站规划方案：包括网站预期目标、行业竞争状况分析、网站栏目结构、用户行为分析及内容规划、网页模版设计、网站服务器技术选型、网站运营维护规范等基本内容；（2）网站技术开发、网页设计；（3）网站测试；（4）网站内容发布；（5）网站维护及管理。2、网站域名及网站技术规范（1）采纳基

11、于XHTML的国际WEB标准（CSS+DIV）；（2）网站首页为顶级域名而不是多级层次；（3）网站首页及各栏目和内容页面均不采纳网址跳转方式，不采纳过渡页/桥页等网址重定向；（4）合理应用静态网页与动态网页，网站栏目首页和其他重要页面采纳静态网页；（5）网页内容页面层次不宜过多，不超过四个层次；（6）采纳主流域名：.cn、.com等；（7）一个网站对应一个主域名，现有多个域名需统一；（8）网站链接错误率在肯定范围之内，首页等重要页面无死链接；（9）网站设计对不同阅读器具有兼容性。3、网站的基本功能和内容（1）与百度实现无缝链接；（2）具有信息发布、产品发布和管理功能；（3）产品举荐/广告管理功

12、能；（4）具体的联系方式；（5）合理的产品分类/汇总/列表；（6）具体的产品介绍内容；（7）销售及售后服务相关的联系和服务信息；（8）在线服务信息；（9）持续更新的产品动态/产品信息；（10）相关网站链接管理功能；（11）规范的网站地图；（12）网站访问统计功能。4、网站优化网站优化包括三个方面：对用户获得信息优化、搜寻引擎优化、网站维护优化。（1）网站栏目结构合理，栏目设置不要过于困难；（2）网站导航清楚且全站统一，通过任何一个网页可以逐级返回上一级栏目直到首页；（3）网页布局设计合理，网站设计符合用户阅读习惯；（4）重要文字信息尽可能出现在网页靠前位置；（5）字体清楚，CSS风格协调一样；

13、（6）最多3次点击可到达产品具体内容页面；（7）通过网站任何一个网页不超过3次点击可达到站内其他任何一个网页；（8）遵照搜寻引擎为管理员供应的网站优化指南，通过网站结构和内容等基本要素的优化为搜寻引擎检索信息供应便利，不采纳任何被搜寻引擎视为垃圾信息的方法和欺瞒搜寻引擎的方式（如积累关键词、用户不行见文本、页面跳转、复制网页等等）；（9）网站首页、栏目首页及产品内容页面均有肯定的文字信息量；（10）每个网页有独立的、可概括说明该网页核心内容的网页标题（而不是全站或者一个栏目共用一个网页标题）；（11）每个网页有独立的、与该网页内容相关的META标签设计（包括description和keywor

14、ds）；（12）每个网页有独立的URL；（13）产品内容页面URL尽可能简短且体现出产品属性；（14）产品/新闻具体内容页面是独立网页不是弹出窗口；（15）对于产品品种多的网站，要有合理的产品分页方式；（16）网站内容保持适当的更新周期。5、网页模版设计（1）重要信息尽可能出现在用户最关注的位置；（2）网页宽度定位适应当前主流屏幕辨别率模式；（3）保持整站CSS风格一样；（4）超级链接有下划线或颜色的明显指示；（5）整个网站中在新窗口打开或原窗口打开网页的规则一样；（6）网站首页字节数不宜过大；（7）多语言版本网站内容之间的切换方式设计合理。6、网站运营维护（1）建立网站内容发布审核机制，始终

15、保持网站内容的合法性；（2）保持网站服务器正常工作，对网站访问速度等进行日常跟踪管理；（3）保持合理的网站内容更新频率；（4）网站内容制作符合网站优化所必需具备的规范；（5）重要信息（如数据库等、访问日志等）的备份机制；（6）保持网站重要网页的持续可访问性，不受网站改版等缘由的影响；（7）对网站访问统计信息定期进行跟踪分析。7、要求内容补充：由于网络营销环境和用户行为在不断发展改变，网站须要增加适应性，可通过改版、重建等方式进行网站升级。在网站建设技术标准方面，遵照国际WEB标准，不再运用过时的HLML4.01；在网站运营支持方面，融入目前居于领先地位的网站优化思想和方法，使得遵照规范建设的网

16、站全面符合主流搜寻引擎的优化指南，具有明显的搜寻引擎优化优势。1.网站规划：整体规划合理，主辅菜单要不清楚；网站建设导向明确，重点突出；栏目适应；各栏目统一规划，整个网站比较清楚；网站的促销功能得到明显体现。2.菜单设置：菜单采纳不宜图片形式，图标标识明确，有文字说明，不要用户移动鼠标进行揣测；菜单层次不宜过多，有效信息层次要少，不须要多次点击才能找到有效信息；过多采纳鼠标响应式菜单，栏目设置不合理，使得用户难以发觉须要的信息；栏目设置有重叠；栏目名称意义不明确，简单造成混淆；全flash首页和菜单，无法优化处理，也没有相应的文字说明，不采纳。栏目清楚够用，但重要信息完整，充分体现有效信息。3

17、.网站首页：少采纳大型图片，用户关切的信息在首页体现，不应多次点击；首页下载速度要快；首页有效信息量丰富；首页有标题；?供应一种以上外语链接页面。主页布局比整齐，重要信息得以重点体现；打开网页不宜弹出多个窗口，影响正常阅读；不要刻意追求“创意”效果，以至于很难理解网站要表达的意思。页面信息：重要信息完整，如联系方式和产品介绍等；页面信息足够，削减多次翻页；去除与企业形象、产品、促销等方面无关的信息；防止产品具体介绍内容过少；内容页面没有标题，或者全部运用公司名为标题；客户能够便利的刚好维护补充，保持其时效性；不允许有无任何内容的栏目。4.网页字体和美工：注意美术效果，但不必大量采纳图片，影响网

18、页下载速度；注意美观，但有些连基本信息内容都不行用图片格式，影响基本信息获得；文字适中、颜色明晰、不影响正常视觉；页面不应过于花哨。8、网站建设中必需克服的问题：（1）网站规划和栏目设置要合理：主要表现在栏目设置不应有重叠、交叉、或者栏目名称意义不明确，简单造成混淆，使得用户难以发觉须要的信息，避开栏目过于繁多和杂乱、网站导航系统混乱；（2）重要的信息要完整：企业介绍、联系方式、产品分类和具体介绍、产品促销等是企业网站最基本的信息，企业网站上这些重要信息完整；（3）网页信息量要足够：包括两种状况：一种页面上的内容，或者将原来一个网页可以发布的内容不行分为多个网页，而且各网页之间必需有相互链接，

19、不须要再次点击主页；另一方面是尽管内容总量不少，但有用的信息少，笼统介绍的内容多；（4）栏目层次要过深。重要的信息应当出现在最简单被用户发觉的位置，应尽可能缩短信息传递的渠道，以使企业信息更加有效地传递给用户；友情提示：本文中关于web网站开发试验报告给出的范例仅供您参考拓展思维运用，web网站开发试验报告：该篇文章建议您自主创作。本文来源：网络收集与整理，如有侵权，请联系作者删除，谢谢！第12页 共12页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页第 12 页 共 12 页