2021-4-13 | 网站设计论文
一、系统结构导航设计
导航是引导学习者学习的航标,是教学策略的体现。成功的数字学习资源应该具有良好有效的学习导航系统,才能避免学生因为学习资源的丰富而在信息中迷失方向、偏离学习目标,降低学习效率。因此,在本专题学习网站设计中,导航策略设计力求目标明确、方法简单、内容完整、相互交叉,以便学习者在浏览网站进行学习时,很快在网站内找到、浏览到自己需要的资源,方便地应用网站提供的各种资源、方法进行学习和协作交流。本站的导航设计采用了常见的导航条导航、功能面板导航、分页面导航三种形式。
导航条在网页中被广泛运用,相对于文本导航,图像导航条导航更加生动、形象。选择[插入]|[图像对象]|[导航条]命令,打开“插入导航条”对话框,可以增加、删除导航条元件,可将选中的导航条元件向上移动、向下移动,可选[修改]|[导航条]命令修改导航条。而在同一模块内采用了Spry选项卡式面板导航,Spry选项卡式面板可将多项内容放置于同一区域中,浏览者可以通过单击面板上需要访问的选项卡来显示相应内容,其余内容隐藏,而不需要打开单独的页面来访问相应内容,因此给浏览者提供了方便,也节省了网页空间。
将插入点定位于网页要插入Spry选项卡式面板的位置,选择[插入]|[布局对象]|[Spry选项卡式面板]命令,即可在网页中插入Spry选项卡式面板。单击插入Spry选项卡式面板的名称,选择插入Spry选项卡式面板,打开属性检查器,如图3所示,在“面板”列表框中可重新设置面板名称,在“默认面板”下拉列表框中可以选择加载时默认显示哪个选项卡及其内容,如果要修改某选项卡的内容,可在属性检查器的“面板”列表框中选择对应的选项卡,然后在编辑窗口的内容区域内添加相应的内容。
二、动态网页开发平台的架设
交互式动态网页是指能动态更新的交互式网页,其内容的更新和维护是通过基于数据库技术的管理系统完成的。在Windows操作系统中,一般都是利用IIS来构建动态网站开发平台的,IIS是一种允许在公共Internet上发布信息的Web服务器,IIS通过使用超文本传输协议(HTTP)传输信息,同时支持FTP服务,IIS能很好地支持ASP,是动态网站开发的理想平台,本网站是在Windows7环境下开发的。
1.安装IIS
Windows系统在默认情况下没用安装IIS,必须在安装Win-dows后另行安装。打开Windows功能窗口,找到Internet信息服务,将Internet信息服务前面的加号点开,找到web管理工具,选中IIS管理服务、IIS管理脚本和工具、IIS管理控制台。然后点开万维网服务,点开应用程序开发功能,依次选中:.NET扩展性、ASP、ASP.NET、ISAPI扩展、ISAPI筛选器,如果想安装PHP,需要将CGI也选中。选中这些之后,其他默认即可,然后点确定,Windows就开始安装IIS了。
2.配置IIS
安装完IIS还需要设置网页主目录及IP地址,进入“控制面板”窗口,单击[系统与安全]图标,进入“系统和安全”页面后,再单击其中的[管理工具]图标,出现“管理工具”窗口后,双击“Internet信息服务(IIS)管理器”选项进行IIS设置,在“Internet信息服务(IIS)管理器”窗口中删除“DefaultWebSite”,添加信天媒体站点。进入“Asp”设置页面后,展开“行为”选项组,将“启用父路径”的参数设置为True。接下来配置IIS站点,单击窗口右侧的“操作”栏中的“绑定”选项,打开“网站绑定”对话框,在“网站绑定”对话框中选定当前命名的网站,单击[编辑]按钮打开“编辑网站绑定”对话框,可以在其中设置网站的IP地址、端口号和主机名,如果是创建本地测试服务器,可以不在其中设置任何内容,然后单击[确定]按钮返回“网站绑定”对话框,在“网站绑定”对话框中单击[关闭]按钮,完成网站绑定参数的设置。在“Internet信息服务(IIS)管理器”窗口中双击[默认文档]按钮,打开“默认文档”页面后单击“操作”栏中的“添加”选项,出现“添加默认文档”对话框,在该对话框中的“名称”文本框中输入index.asp,表明名为index.asp的文档将作为网站的默认文件,单击[确定]按钮,返回“Internet信息服务(IIS)管理器”窗口,完成IIS的配置,如图5所示。
3.设置站点
为了方便在设计制作过程中查看页面效果,需要在Dreamweaver中为设计的动态网页设置一个临时站点,启动Dreamweaver,选择[站点]|[管理站点]命令,出现“管理站点”对话框,选定事先设置好的用于创建动态网站的站点名(如信天媒体),然后单击[编辑]按钮,打开“站点设置对象”对话框,根据需要设置或更改站点名称和本地站点文件夹。选择“服务器”类别,单击[添加新服务器]按钮,在出现的设置选项中添加服务器名称、连接方法、服务器文件夹和WebURL参数,注意将“连接方法”设置为“本地/网络”。切换到“高级”选项卡,将“服务器模型”设置为ASPVBScript。单击[保存]按钮返回“站点设置对象”对话框,即可看到服务器列表出现新添加的服务器,选中“测试”选项。单击[保存]按钮,完成Dreamweaver站点的定义。
4.连接数据库
Dreamweaver提供了多种连接数据库的方法,最常用的是使用ASP进行连接,具体连接到数据库的方式又分为“数据源名称(DSN)”和“自定义连接字符串方式”两种。本网站采用的是“数据源名称(DSN)”方式连接到数据库,选择[窗口]|[数据库]命令,打开“数据库”面板,单击“数据库”面板上的[添加]按钮,从菜单中选[择数据源名称(DSN)]选项,出现“数据源名称(DSN)”对话框后,单击[定义]按钮,打开“ODBC数据源管理器”对话框,利用其中的选项,即可定义一个数据源,如图6所示。
三、资源下载模块登录页面设计
在用户访问资源下载模块时,首先要进行身份验证,这个功能是靠登录页面来实现的,如图7所示。该界面设计先执行[插入]|[表单]|[表单]命令,然后将鼠标放置在该表单中,执行菜单[插入]|[表格]命令,插入3行2列的表格,在表格的第1行,第2列执行[插入]|[表单]|[文本域]命令,插入一个单行文本域表单对象,并定义文本域名为“username”,在表格的第2行,第2列执行[插入]|[表单]|[文本域]命令,插入一个单行文本域表单对象,并定义文本域名为“password”,在表格的第3行,执行[插入]|[表单]|[按钮]命令,插入两个按钮,一个是登录时用的“提交表单”,值为“登录”,另一个为“重设表单”,值为“重置”。表单编辑完成后,下面编辑该网页的动态内容,使用户可以通过该网页中表单的提交实现登录功能。打开“服务器行为”面板,单击该面板上按钮,执行菜单[用户身份验证]|[登录用户]命令,向该页面添加“登录用户”的服务器行为。执行[文件]|[保存]命令,将该文档保存到本地站点中,完成登录网页的制作。
四、结语
随着网络教育的发展,校园文化网站的风格设计显得尤为重要,设计独特、新颖、让人回味无穷的网站,给人以智慧、启迪的网络文化。同时,网站系统的建设与维护是个长期的过程,需要不断地与使用者沟通,不断地增加新的功能、美化界面,从而使网站不断地注入新的活力。
作者：高平 单位：北京信息科技大学公共管理与传媒学院