《江西师范大学本科生毕业论文-个人网页制作.doc》由会员分享,可在线阅读,更多相关《江西师范大学本科生毕业论文-个人网页制作.doc(43页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、江西师范大学科学技术学院学士论文 个人主页设计论文江西师范大学本科生毕业论文题目:个人网页制作Individual homepage manufacture学院名称: 江西师大科学技术学院 专业名称: 06计算机科学与技术 姓 名: 张虎 学 号: 0608069048 指导教师: 万芳 完成日期: 2010.04 声 明本人郑重声明:所呈交的学位论文,是本人在指导教师指导下,独立进行研究工作所取得的成果。除文中已经注明引用的内容外,本论文不含任何其他个人或集体已经发表或撰写过的作品或成果。对本文的研究做出重要贡献的个人和集体,均已在文中以明确的方式标明。本声明的法律结果由本人承担。本毕业设计
2、(论文)成果是本人在江西师范大学科学技术学院读书期间在指导教师指导下取得的,成果归江西师范大学科学技术学院所有。特此声明。声明人(毕业设计(论文)作者)学号:声明人(毕业设计(论文)作者)签名:摘 要本文就个人网站的规划与建设,以软件工程的方法对全过程进行了分析与研究。本文的主要工作集中在:1. 对Web页进行概述,主要是对Internet的历史和发展作了回顾,并对Web页的定义和特性进行阐述。并对网站开发过程中使用的开发工具和技术作了简要的介绍。2. 对网站建设中提及到的术语进行了解释,并对个人网站的由来和发展进行了讨论。3. 对自己的个人网站从规划到建设进行了详细的分析。4. 使用ASPI
3、ISSQL技术实现了我的网站的各种功能,其中和数据库的连接使用到了ODBC技术。5. 就网站建设提出了自己的观点与建议。6. 给出了用户操作手册。关键词:网站ASPSQL Server风格创意AbstractAnalyze and study the whole course with the method of the soft project on the planning and construction of the personal Web site in this text.The groundwork of this text is concentrated on: 1. go
4、on because it sum up, whose name is mainly act as and review at developments of history against Internets, for Web the definitions of pages go on and explain at characteristics. And has done brief introduction to the developing instrument and technology that are used in the course of developping of
5、Web site. 2. the getting under more construction about Web site mention go on and explain for personal the origins of the Web site go on and discuss at developments at term that get. 3. the getting Web site personal planning to building detailed more analysis about the one ones own.4. use ASP of + I
6、IS + SQL technologies of it realize the various kinds of function in Web sites of me of,among them and join and use and for ODBC technology at data bases .5. from Web site build and propose ones own view and suggestions.6. give and publish by user service manual . Keyword: ASPs SQLs Servers style in
7、tention of Web site目 录第一章 概述71.1 Web页概述71.1.1 Internet的历史和发展71.1.2 Web页定义81.1.3 Web页特性91.1.4 Web页的地址91.2 开发平台简介91.2.1 Dreamweaver简介91.2.2 ASP和IIS简介111.2.3 SQL简介131.2.4 PhotoShop简介13第二章 网站需求分析142.1 相关术语及解释142.2 个人网站的由来和发展142.3 我的个人网站的设计与规划152.3.1 明确架设网站的目的及客户要求。152.3.2 我的个人网站概貌:15第三章 详细设计213.1 静态页面的设
8、计213.2 动态页面的设计213.2.2 BBS个人论坛223.2.3 文摘223.2.4 图库223.2.5 在线视听233.2.6 Flash欣赏233.2.7 网络资源233.2.8留言本24第四章 编码、测试与维护264.1主要页面程序代码264.1.1 与数据库建立连接264.1.2 站内及站外的搜索引擎的实现264.1.3 流媒体技术的使用284.1.4 层样式表294.2 测试与维护304.2.1 网页测试304.2.2 网页测试法314.2.3 测试项目324.3 关于网站建设的几点思索334.3.1 如何设计一个成功的网站334.3.2 网站的版面设计36第五章 用户手册3
9、75.1系统特性375.2运行环境375.2.1硬件环境375.2.2 软件环境375.3 安装与初始化375.3.2 初始化数据库39结束语41第一章 概述1.1 Web页概述1.1.1 Internet的历史和发展Internet最早来源于美国国防部高级研究计划局DARPA(Defense advanced Research Projects Agency)的前身ARPA建立的ARPAnet,该网于年投入使用。从年 代开始,ARPA就开始向美国国内大学的计算机系和一些私人有限公司提供经费,以促 进基于分组交换技术的计算机网络的研究。年,ARPA为ARPAnet网络项目立项, 这个项目基于这
10、样一种主导思想:网络必须能够经受住故障的考验而维持正常工作,一 旦发生战争,当网络的某一部分因遭受攻击而失去工作能力时,网络的其它部分应当能够维持正常通信。最初,ARPAnet主要用于军事研究目的,它有五大特点:(1)支持资源共享;(2)采用分布式控制技术;(3)采用分组交换技术;(4)使用通信控制处理机;(5)采用分层的网络通信协议。 年,ARPAnet在首届计算机后台通信国际会议上首次与公众见面,并验证了分组交换技术的可行性,由此,ARPAnet成为现代计算机网络诞生的标志。ARPAnet在技术上的另一个重大贡献是TCP/IP协议簇的开发和使用。1980年,ARPA投资把TCP/IP加进U
11、NIX(BSD4.1版本)的内核中,在BSD4.2版本以后,TCP/IP协议即成为UNIX操作系统的标准通信模块。年,Internet由ARPAnet,MILNET等几个计算机网络合并而成,作为Internet的早期骨干网,ARPAnet试验并奠定了Internet存在和发展的基础,较好地解决了异种机网络互联的一系列理论和技术问题。 年,ARPAnet分裂为两部分:ARPAnet和纯军事用的MILNET。该年月,ARPA把TCP/IP协议作为ARPAnet的标准协议,其后,人们称呼这个以ARPAnet为主干网的网际互联网为Internet,TCP/IP协议簇便在Internet中进行研究,试验
12、,并改进成为使用方便,效率极好的协议簇。与此同时,局域网和其它广域网的产生和蓬勃发展对Internet的进一步发展起了重要的作用。其中,最为引人注目的就是美国国家科学基金会NSF(National Science Foundation)建立的美国国家科学基金网NSFnet,年,NSF建立起了六大超级计算机中心,为了使全国的科学家、工程师能够共享这些超级计算机设施,NSF建立了自己的基于TCP/IP协议簇的计算机网络NSFnet。NSF在全国建立了按地区划分的计算机广域网,并将这些地区网络和超级计算中心相联,最后将各超级计算中心互联起来。地区网的构成一般是由一批在地理上局限于某一地域,在管理上隶
13、属于某一机构或在经济上有共同利益的用户的计算机互联而成,连接各地区网上主通信结点计算机的高速数据专线构成了NSFnet的主干网,这样,当一个用户的计算机与某一地区相联以后,它除了可以使用任一超级计算中心的设施,可以同网上任一用户通信,还可以获得网络提供的大量信息和数据。这一成功使得NSFnet于年月彻底取代了ARPAnet而成为Internet的主干网。 NSFnet对Internet的最大贡献是使Internet向全社会开放,而不象以前那样仅仅借计算机研究人员、政府职员和政府承包商使用。然而,随着网上通信量的迅猛增长,NSF不得不采用更新的网络技术来适应发展的需要。年月,由Merit、IBM
14、和MCI公司联合建立了一个非赢利性的组织先进网络和科学公司ANS(Advanced Network&Science,Inc)。ANS的目的是建立一个全美范围的T3级主干网,它能以45Mb/s的速率传送数据,相当于每秒传送页文本信息。到年底,NSFnet的全部主干网都已同ANS提供的T3级主干网相通。 中国早在年就由中国科学院高能物理研究所首先通过X.25租用线实现了国际远 程联网,并于年实现了与欧洲和北美地区的E-MAIL通信。年月经电 信部门的大力配合,开通了由北京高能所到美国Stanford直线加速中心的高速计算机通 信专线。年月高能物理研究所的计算机正式进入了Internet网,与此同时
15、, 以清华大学为网络中心的中国教育与科研网也于年月正式联通Internet网, 年月,中国最大的Internet互联子网CHINAnet也正式开通并投入营运,在中 国兴起了一种研究,学习和使用Internet的浪潮,中国的用户已经越来越走进Internet,而Internet则已经越来越成为中国人科研工作甚至日常生活的一个重要组成部分。1.1.2 Web页定义到底什么是Web页,如何定义Web呢?一种比较简单说法是,Web页是包含了超文本标记语言(HTML)格式标记的一种文本文件,其中还包含了与图形文件和其他Web页的链接。这种文本文件保存于一台Web服务器中,可由网上其他电脑访问,访问时需要
16、使用一个Web浏览器,它的功能是将文件下载到访问者的电脑,解释其中包含的HTML标记及链接的含义,并将最终的结果在屏幕上显示出来,或者换一种定义,Web页是一种以电脑网络为媒介的交互式通信方式。1.1.3 Web页特性Web页有两大特性:一个是Web页能使用多媒体技术,另一个是Web页是交互式的,所谓多媒体是指用文本、声音、动画以及影音图像文件组合来表达信息。这类在网上传输的多媒体文件通常被称为“超媒体”。正是这些超媒体的传输使网络声色并茂,充满生机。所谓交互式是指访问者不仅充当观众角色,还可以向Web站点发送信息或命令,控制Web服务器上的应用程序,比如留言板,在这里访问者可以留下信息给网站
17、主人。1.1.4 Web页的地址每个Web页都有自己的地址,这个地址叫统一资源定位符(URL),例如中国矿业大学主页的地址是http:/WWW 它由三部分组成:l http:/ :表示超文本传输协议l WWW :表示服务器或主机名l :表示域名及后缀、cumt 是中国矿业大学校名简称, edu 是教育机构后缀, cn 表示中国。1.2 开发平台简介工欲善其事必先利其器。在开始动手前要选择一种适当的开发工具,在这里我选择用Macromedia公司 Dreamweaver。作为主要开发工具Microsoft公司的Frontpage为辅助开发工具。后台采用MS SQLServer数据库,使用ASP技
18、术结合IIS进行开发。1.2.1 Dreamweaver简介Dreamweaver是美国Macromedia公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。其特点有以下几方面:(1) 制作效率高Dreamweaver可以用最快速的方式将Fireworks,FreeHand,或Photoshop等档案移至网页上。使用检色吸管工具选择屏幕上的颜色可设定最接近的网页安全色。对于菜单、快捷键与格式控制,都只要一个简单步骤便可完成。Dremweaver能与你喜爱的
19、设计工具,如Playback Flash,Shockwave和外挂模块等搭配,不需离开Dremweaver便可完成,整体运用流程自然顺畅。除此之外,只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。(2) 网站管理方便使用网站地图可以快速制作网站雏形,设计,更新和重组网页。改变网页位置或文件名称,Dreamweaver会自动更新所有链接。使用支持文字、HTM代码、HTML属性标签和一般语法的搜索及置换功能,使得复杂的网站更新变得迅速又简单。(3) 控制能力强Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与源代
20、码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令你无法想像。高级表格编辑功能使你可以简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组,Dreamweaver支持精准定位,利用可轻易转换成表格的图层以拖拉置放的方式进行版面布局。(4)所见即所得Dreamweaver成功地集成了动态出版视觉编辑及电子商务功能,提供超强的支持能力给Third-party厂商,包含ASP、Apache,BroadVision、Cold Fusion、iCAT、Tango与自行开发的应用软体。当你正使用Dreamweaver在设计动
21、态网页时,它的所见即所得的功能,让你不需要透过浏览器就能预览网页。(5)梦幻样版和XMLDreamweaver将内容与设计分开,应用于快速网页更新和团队合作网页编辑。建立网页外观的样版,指定可编辑或不可编辑的部份,内容提供者可直接编辑以样式为主的内容,却不会因不小心改变既定之样式。你也可以使用样版正确地导入或导出XML的内容。(6)全方位的呈现利用Dreamweaver设计的网页,可以全方位的呈现在任何平台的热门浏览器上。对于CSS(cascading style sheets)的动态HTML支持和鼠标换图效果、声音和动画的DHTML效果数据库可在Netscape和Microsoft浏览器上执
22、行。使用不同浏览器检查功能,Dreamweaver可以告知你在不同浏览器上执行的效果如何。当有新的浏览器上市时,只要从Dreamweaver的网站下载它的描述文件,便可得到详尽的报告。1.2.2 ASP和IIS简介 Microsoft Active Server Pages 即我们所称的ASP,其实是一套微软开发的服务器端脚本环境,通过 ASP我们可以结合HTML网页、ASP指令和ActiveX元件建立动态、交互且高效的Web服务器应用程序。有了ASP 你就不必担心客户的浏览器是否能运行你所编写的代码,因为所有的程序都将在服务器端执行,包括所有嵌在普通 HTML 中的脚本程序。当程序执行完毕后
23、,服务器仅将执行的结果返回给客户浏览器,这样也就减轻了客户端浏览器的负担,大大提高了交互的速度。以下罗列了 Active Server Pages 所独具的一些特点: 1. 使用 VBScript 、 JScript 等简单易懂的脚本语言,结合 HTML 代码,即可快速地完成网站的应用程序。 2. 无须 compile 编译,容易编写,可在服务器端直接执行。 3. 使用普通的文本编辑器,如 Windows 的记事本,即可进行编辑设计。 4.Active Server Pages 能与任何 ActiveX scripting 语言相容。除了可使用 VBScript 或 JScript 语言来设计
24、外,还通过plug-in的方式,使用由第三方所提供的其他脚本语言,譬如 REXX 、 Perl 、 Tcl 等。脚本引擎是处理脚本程序的 COM(Component Object Model) 物件。 5.Active Server Pages 的源程序,不会被传到客户浏览器,因而可以避免所写的源程序被他人剽窃,也提高了程序的安全性。6.可使用服务器端的脚本来产生客户端的脚本。 7.ActiveX Server Components(ActiveX 服务器元件 ) 具有无限可扩充性。可以使用 Visual Basic 、 Java 、 Visual C+ 、 COBOL 等编程语言来编写你所需
25、要的 ActiveX Server Component 。 ASP 本身并不是一种脚本语言,它只是提供了一种使镶嵌在 HTML 页面中的脚本程序得以运行的环境。但是,要学好 ASP 又必须掌握它的语法和规则。ASP 程序其实是以扩展名为 .asp 的纯文本形式存在于 WEB 服务器上的,你可以用任何文本编辑器打开它, ASP 程序中可以包含纯文本、 HTML 标记以及脚本命令。你只需将 .asp 程序放在 WEB 服务器的虚拟目录下(该目录必须要有可执行权限),就可以通过 WWW 的方式访问 ASP 程序了。要学好 ASP 程序的设计,必须掌握脚本的编写,那么究竟什么是脚本呢?其实脚本是由一系
26、列的脚本命令所组成的,如同一般的程序,脚本可以将一个值赋给一个变量,可以命令 WEB 服务器发送一个值到客户浏览器,还可以将一系列命令定义成一个过程。要编写脚本,你必须要熟悉至少一门脚本语言,如 VBScript 。脚本语言是一种介乎于 HTML 和诸如 JAVA 、 Visual Basic 、 C+ 等编程语言之间的一种特殊的语言,尽管它更接近后者,但它却不具有编程语言复杂、严谨的语法和规则。如前所述 ASP 所提供的脚本运行环境可支持多种脚本语言,譬如: JScript 、 REXX 、 PERL 等等,这无疑给 ASP 程序设计者提供了广泛的发挥余地。ASP 的出现使得广大 WEB 设
27、计者不必在为客户浏览器是否支持而担心,实际上就算你在同一个 .asp文件中使用不同的脚本语言,你都无须为此担忧,因为所有的一切都将在服务器端进行,客户浏览器得到的只是一个程序执行的结果,而你也只需在.asp 中声明使用不同的脚本语言即可。通过ASP,可以结合HTML网页、ASP指令和ActiveX组件建立动态、交互且高效的Web服务器应用程序。有了ASP就不必担心客户的浏览器是否能运行程序员所编写的代码,因为所有程序都将在服务器端执行,包括所有嵌在普通HTML中的脚本程序。当程序执行完毕后,服务器公将执行的结果返回给客户浏览器,这样也就减轻了客户端浏览器的负担,大大提高了交互速度。ASP使用V
28、BScript、JavaScript等简单易懂的脚本语言,结合HTML代码,即可快速完成网站的应用程序。它无须编译,容易编写,可在服务器端直接执行。使用普通的广西编辑器,如Windows的记事本,即可进行编辑设计。ASP浏览器无关,用户端只要使用可执行HTML码的浏览器,即可浏览Active Server Pages的设计的网页内容。Active Server Pages所使用的脚本语言(VBScript、Javascript)均在Web服务器端执行,用户端的浏览器不需要能够执行这些脚本语言。Active Server Pages能与任何ActiveX脚本编程语言相容。除了可使用VBScrip
29、t或JavaScript脚本语言来设计外,还通过插件的方式,使用由第三方提供的其他脚本语言,譬如REXX、Perl、Tcl等。脚本引擎是处理脚本程序的COM(Component Object Model)对象。ASP的源程序不会被传到客户浏览器,因而可以避免所写的源程序被他人剽窃,也提高了程序的安全性。ActiveXServer Components(ActiveX服务器组件)具有无限可扩充性。可以使用Visual Basic、Java、Visual C+、COBOL等编程语言来编写所需要的ActiveX服务器组件。ASP属于 ActiveX技术中的服务器端技术。与常见的在客户端实现动态主页的
30、技术如Java applet、ActiveX Control、VBScript、JavaScript等不同,ASP中的命令和脚本语句都是由服务器来解释执行的,执行结果产生动态生成的Web页面并送到浏览器;而客户端技术的Script命令则是由浏览器来解释执行。由于ASP是在服务器解释执行,开发者可以不必考虑浏览器是否支持ASP:时由于它在服务器端执行,开发者也不必担心别人下载程序从而窃取编程逻辑。1.2.3 SQL简介SQL Server是由Microsoft 开发和推广的关系数据库管理系统(DBMS),最初由Microsoft、Sybase和Ashton-Tate三家公司共同开发,1988年推
31、出第一个版本。90年,Ashton-Tate公司退出开发,92年,SQL Server移植到NT上,94年两家公司分别开发,Microsoft专注于开发和推广SQL Server的Windows NT版,而Sybase则专注于SQL Server在UNIX操作系统上的应用。1.2.4 PhotoShop简介Adobe公司出品的photoshopCS4,photoshop是图像处理领域中的佼佼者,被广泛地应用于图像的制作,修改以及广告创意设计,其功能强大,它无需任何原始资料即可制作出蓝天、白云、水波、山石等几乎能乱真图像;用它能制作出木纹、金属、大理石等材质贴图以及五彩缤纷的幻想效果;它能将图像
32、转换成多种图像模式,并可以以多种常用图像格式存储;利用photoshop的各种不同插件,可以生成多种效果的图像,在我的个人主页上,大量的图片用到了photoshop作处理,经过处理后,更能符合我的要求和设计主题。第二章 网站需求分析随着网络技术的不断发展,网络应用已经渗透到人类社会的各个角落。作为网络世界的支撑点的网站,更是人们关注的热点:政府利用网站宣传自己的施政纲领,日益成为与百姓交流的直通车;企业利用网站宣传自己的形象,挖掘无限商机;个人利用网站展示个性风采,创建彼此沟通的桥梁。越来越多的人希望拥有网站,开辟网络世界里的一片天地。面对缤纷灿烂的网络世界,一直以来都想拥有一个属于自己的网站
33、,于是在万芳老师的指导下,我严格按照软件工程的思想,一步步实现我的梦想,搭起我自己的个人网站。2.1 相关术语及解释css:中文翻译为样式表! 它的作用简单的说:就是可以使你在同一页面里使用不同的超链接样式。风格:风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI(标志,色彩,字体,标语),版面布局,浏览方式,交互性,文字,语气,内容价值,存在意义,站点荣誉等等诸多因素。创意:这里说的创意是指站点的整体创意,(因为这个创意而产生这个站点,或者相同的内容,推出的创意不同),网页的平面设计创意与此处所说的概念不同。Asp: ASP是Active Ser
34、ver Pages的英文缩写,即动态服务器主页,Active表示可以根据用户的请求动态地生成网页,Server表示这是一种后台服务器端的技术,Page则表示网页的概念。 流媒体:从前,多媒体文件需要从服务器上下载后才能播放,一个1分钟的较小的视频文件,在56K的窄带网络上至少需要30分钟时间进行下载,这限制了人们在互联网上大量使用音频和视频信息进行交流。“流媒体”不同于传统的多媒体,它的主要特点就是运用可变带宽技术,以“流”(Stream)的形式进行数字媒体的传送,使人们在从28K到1200K的带宽环境下都可以在线欣赏到连续不断的高品质的音频和视频节目。2.2 个人网站的由来和发展互联网在中国
35、的出现只有短短七年时间,1994年中国科学院高能物理研究所设立了国内第一个Web服务器,推出一个叫做“中国之窗”的网页,这可能是国内Internet上出现的第一个Web网页,1995年开始,中国教育科研网,中国科技网,中国公用计算机互联网以及中国金桥网这构成中国数字神经系统的四大互联网络相继建成,使互联网在中国开始真正进入社会生活之中。这时期,个人网站出现的条件还很不成熟,国内上网的人数很少,也缺乏支持个人建站的环境,用户很难找到理想的个人主页存放地。个人网站发展的第二阶段是从1997年初到1998年,这段时间,中国网民数量飞速增长,个人网站日渐繁荣,个人主页的数量急剧增加。同时,越来越多的商
36、业网站开始免费提供个人主页空间,这些良好的外部极大地促进了个人网站的发展,涌现了一批很著名的个人网页,从1998年下半年开始,随着互联网应用的深入的普及,随着众多主页制作工具的出现,使得建站成为一件非常容易的事,创建一个能充分体现自我风格和特色的个人网站已经成为互联网用户的新追求。2.3 我的个人网站的设计与规划2.3.1 明确架设网站的目的及客户要求。通常情况下,架设个人网站主要是为了通过互联网表达个人在商业、科技、交际、生活等方面的信息需求或者进行信息的交流,具有较强的目的性,我的个人网站一般体现在:为了展示自己的风采,让大家和我一起分享我的心得与经验,让和我有共同爱好的朋友有一个倾诉的地
37、方。2.3.2 我的个人网站概貌:因为是个人网站,所以只是选择了自己擅长和喜爱的内容,在突出自己的风格和特点的同时,还应用了现在流行的网站设计技术和数据库技术。因此将网站设计分为前台页面展示平台和后台在线管理平台。2.3.3.1 功能划分网站设计有搜索引擎,浏览者可以在网内搜索自己喜欢的资料,并且可以在留言板和大家交流,在后台管理页面中,通过身份认证,管理员我,可以对网站信息进行管理。站内的其它页面均是我自己的精心收藏,与大家一起分享。搜索引擎:根据浏览者的条件,使用搜索引擎在站内或整个Internet上进行搜索,完成信息的优化与提取。留言板:是一个我与大家谈心交流的地方,在留言板中,我们可以
38、畅所欲言,和大家进行交流。就我们感兴趣的话题展开讨论。和大家进行沟通。后台管理页面:是我管理和添加到新内容的地方,为了方便实现信息的经常更新,我设计了这个管理页面,经过身份认证后我可以进入网站对其中的信息进行管理。精品收藏:在其中展示我喜爱的东西,包括电影、歌曲和一些优美的文章。奇文共欣赏,疑义相与析。我只想起到抛砖引玉的作用,让大家从中认识我和了解我,让一些美好的东西我们大家共同来欣赏。 其中在歌曲栏目下,朋友们可以在里面加入自己喜欢的歌,但为了防止有人恶意加入非法的歌曲,我增加了管理权限,我以管理员的身份可以对加入的歌曲进行管理,即允许加入和对其进行删除。2.3.3.2 页面组织和数据库设
39、计在明确了我的个人网站的风格和定位后,就是网站的材料组织以及网站的页面设计和数据库设计。建立一个网站好比写一篇文章,首先要拟好提纲,文章才能主题明确,层次清晰。如果网站结构不清晰,目录庞杂,内容东一块西一块。结果不但浏览者看得糊涂,自己扩充和维护网站也相当困难。网站的题材确定后,并且收集和组织了许多相关的资料内容,但如何组织内容才能吸引网友们来浏览网站呢?栏目的实质是一个网站的大纲索引,索引应该将网 站的主体明确显示出来。因此我将自己的个人网站分为五个栏目,分别是ABOUT ME(关于我)、MEMORY(怀念往昔)、HEART(心情故事)、GBOOK(留言板)、COOLSTATION(网站欣赏
40、)。 根据前面的设计思想进行分析,按照系统开发的基本观点对网站进行分解,从内容上可对网站作如下划分: BBS个人论坛 收集网上论坛里的精品文章。 文摘 连接到其他网站上的文章。 图库 由站长收集的大量精美图片。 在线电影 电影音乐在线视听。 Flash欣赏 精品Flash 在线播放。 网络资源 网络资源站点地址收集,可通过链接直接访问。 留言本 凡是访问本站的网友都可在此留言。我选择PhotoShop作为我的页面设计工具。只所以选择PhotoShop不仅因其强大的功能,还因为我对PhotoShop的应用已有了一定的基础。主页面2.3.3.3 网站的目录结构网站的目录是指你建立网站时创建的目录。
41、例如:在用frontpage2000建立网站时都默认建立了根目录和Images(存放图片)子目录。目录结构的好坏,对浏览者来说并没有什么太大的感觉,但是对于站点本身的上传维护,内容未来的扩充和移植有着重要的影响。因此我按网站的栏目建立各个子目录,并且为每个子栏目建立独立的Images目录,以便于以后的管理,根目录下的Images目录只是用来放首页和一些其它不太重要页面背景图片。2.3.3.4 确定网站的链接结构网站的链接结构是指页面之间相互链接的拓扑结构。它建立在目录结构基础之上,但可以跨越目录。建立网站的链接结构有两种基本方式:1、树状链接结构类似DOS的目录结构,首页链接指向一级页面,一级
42、页面链接指向二级页面。这样的链接结构浏览时,一级级进入,一级级退出。优点是条理清晰,访问者明确知道自己在什么位置,不会迷路。缺点是浏览效率低,一个栏目下的子页面到另一个栏目下的子页面,必须绕经首页。2、星状链接结构类似网络服务器的链接,每个页面相互之间都建立有链接。这种链接结构的优点是浏览方便,随时可以到达自己喜欢的页面。缺点是链接太多,容易使浏览者迷路,搞不清自己在什么位置,看了多少内容。这两种基本结构都只是理想方式,在实际的网站设计中,总是将这两种结构混合起来使用,达到比较理想的效果。比较好的方案是:首页和一级页面之间用星状链接结构,一级和以下各级页面之间用树状链接结构。在我的网站中即采用
43、这种方案2.3.3.5 网站所用到的数据库的建立结合网站的栏目,设置将网站的数据大部分存于数据文件,通过ASP技术将数据库中的内部提取到页面。根据各栏目的需要,设计数据库的结构。1.数据库的ER:书 籍管 理 员技术文件日 记电影类别属于电 影类别增加音乐类别音 乐属于增加属于属于增加增加M M 1 1 M 1 1 1 1 M M M 1 1 M M 电 影类型编号电影类型电影产地演 员图片路径片 长电影类型演 员类别编号技 巧内 容标 题类别编号管理员ID 号姓 名姓 名涉及到的实体有:电影实体集 具体属性: 类型编号,电影类型,电影产地,片长,演员.图片路径电影类型实体集 具体属性: 类别
44、编号,类别名技巧实体集 具体属性: 技巧编号,标题,内容管理员实体集 具体属性: ID号,姓名,密码2. 将概念模型转换为关系模型电影实体集可以转换为关系:tblfilm(ftypeid,ftype,fsource,ftime,facter,fpath)电影类型实体集可以转换为关系:tblfilmtype(ftypeid,ftypename)管理员实体集可以转换为关系:tbladmin(flid,fldname,fldpwd)3. 数据库表结构的设计表: tblfilm (电影)字段字段名类型长度必填默认说 明ftypeid类型编号Int4外键fid电影编号Int4自动增一fsource电影产地Char20ftime片长Char20facter演员Char50fpath图片路径Char20