|
|
1网站的概述
1.1 网站的背景
现今，网络的规模越来越大，网络里面的各种元素也变得越来越多。这都要归根于今年来计算机技术和各大通信技术的发展迅速。由于这两项技术的发展迅猛，从而使得现在网络用途越来越广，有的用网络对公司，物品，等紧行宣传，销售或者收购等，有的利用网络进行交流，信息资源的共享等。现在网络已经成为现今社会必不可少的元素。其中网站就是网络元素重要的一种。
网站(Website)是指在因特网上，根据一定的规则，使用HTML等工具制作的用于展示特定内容的相关网页的集合。简单地说，网站是一种通讯工具，就像布告栏一样，人们可以通过网站来发布自己想要公开的资讯，或者利用网站来提供相关的网络服务。人们可以通过网页浏览器来访问网站，获取自己需要的资讯或者享受网络服务。
1.2 网站的目标
设计本网站是因为本人比较喜欢动漫，同样的也想寻找一些同样喜欢动漫的伙伴们，希望伙伴们可以通过本网站观看到一些动漫的小视频，图片动漫的最新资料等。而且伙伴们还可以通过留言板发表各自对动漫的意见，同时也可以互相认识交流。而我本人也希望通过制作本网站掌握网站制作的技术，需要的软件硬件等。并在制作过程中遇到的问题，通过书本网络等渠道逐一解决从而提高自己对网站制作技术的认识。使的自己在日后制作别的网站中能更加的熟练。
1.3 网站分类
在现今网络飞速发展中，各种各样的网站层出不穷，不过在其中有几种类型的网站在现今是比较多比较突出的。
1.3.1 资源共享类
这个类别的网站一般就是游客通过网站进行一些资源信息的共享，例如各大视频下载或者新闻类别的如论坛，社区，迅雷等。游客们通过上去浏览他们的网站，有选择的进行资源的下载，各种信息的浏览。
1.3.2 专题类
这一类的网站根据性质可分为两类：
企业商品类，这一类的网站主要是围绕一个商品或一个企业而产生的专题网站。这类网站有助于企业形象的树立，有助于各单位之间的交流合作[]。
个人专题类，这一类的网站主要是由一些有一定网站设计基础的人员，设计出来的一些无商业涉
及的专题网站。而设计这一类网站的人员基本上都是按自己的喜好来设计的。（本网站就属于这个类型）
1.3.3 搜索类
这一类的网站是最为普遍的，而且商业用途也很广泛。无论对于一般网民，或者办公人员都是必不可少的网站。本人认为这一个类型的也是现今网络上比较主流比较重要的。因为现在很多人都喜欢用搜索引擎去搜查一些东西，也可以通过搜索引擎搜索自己想要的网站，假设网络是一本书，那么搜索引擎就是这本书得一个目录，人们可以通过这个目录找到自己需要的资料，网站等。
1.3.4 其它类
其实这一类时候本人不知道这种类型的网站属于哪个类型但是现今社会又比较流行的，就是电子商务，这种类型的网站再现在社会已经非常的流行基本上现在已经是一种比较主流的购物方式，因为人们平时上班比较忙碌，休息时间又不多，一般休息都会选择在家休息，所以网购就逐渐成为主流。
2网站的分析设计构想
2.1 技术的可行性分析
在制作文章网网站的过程中需要考虑到技术可行性的问题，对制作人员一般都要求掌握计算机技术，具有一定的数据库基础，至少熟悉运用一个网页制作的软件（如：Dreamweaver），并对多媒体软件具有一定的熟悉（如：Photoshop、Flash等等）。
2.2 操作可能性分析
这个网站操作非常简单、界面简洁清晰, 对于那些有一般的计算机知识的人员就可以轻松上手。并兼容与所有网页浏览的软件(如： Internet Explorer)
由此可见，该网站的操作是可行的，有必要开发这个网站。
综合以上方面，这个网站具有很高的开发可行性，无论是从技术上，或者社会因素方面还是操作上都是可行的。
2.3 网站的大致设计构想
本人制作这个网站的大致构想是想制作一个可以用于分享，交流的网站。由于现在社会上有很多素质低下的人，他们会在网站留言或者评论等地方恶意散播广告，不好的留言等，基于这个本人还在网站上添加了管理功能用于删除这些不好的留言。基本设计有用于查询浏览的主页面，视频，资料和用于交流的页面。
3网站的开发环境
3.1 软件环境
1.数据库： Microsoft Access 2010
2.网页脚本：ASP VBScript
3.网页编辑工具：Macromedia Dreamweaver 8
4.操作系统：Microsoft Windows 7 64位
3.2 软件工具
3.2.1网站设计工具
Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的所见即所得网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。同时这个本人认为也是一个学习起来比较简单的。因为使用这个软件基本可以不使用代码。里面的编辑工具也很多。
3.2.2媒体工具
Flash是美国Macromedia公司所设计的一种二维矢量动画软件（现Adobe公司产品），用于设计和编辑Flash文档，最新版本为：Adobe Flash CS5。Flash通常也指Macromedia Flash Player（现Adobe Flash Player），用于播放Flash文档，也是现在比较普及的一个网页视频插件。
3.2.3数据库
Microsoft Office Access（前名 Microsoft Access）是由微软发布的关联式数据库管理系统。它结合了 Microsoft Jet Database Engine 和图形用户界面两项特点，是 Microsoft Office的成员之一。其实Access 也是微软公司另一个通讯程序的名字，想与 ProComm 以及其他类似程序来竞争。可是事后微软证实这是个失败计划，并且将它中止。数年后他们把名字重新命名于数据库软件。另外，Access还是c语言的一个函数名和一种交换机的主干道模式。
3.2.4网页脚本
VBScript是微软开发的一种脚本语言，可以看作是VB语言的简化版，与VBA的关系也非常密切。它具有原语言容易学习的特性。目前这种语言广泛应用于网页和ASP程序制作，同时还可以直接作为一个可执行程序。用于调试简单的VB语句非常方便。不过现在最常用普遍的还是C语言C++，JAVA等。
3.2.5测试工具
Internet Information Services（IIS，互联网信息服务），是由微软公司提供的基于运行Microsoft Windows的互联网基本服务。最初是Windows NT版本的可选包，随后内置在Windows 2000、Windows XP Professional和Windows Server 2003一起发行，但在普遍使用的Windows XP Home版本上并没有IIS。
Mozilla Firefox，中文名通常称为“火狐”或“火狐浏览器”（正式缩写为 Fx，非正式缩写为FF），是一个开源网页浏览器，使用Gecko引擎，支持多种操作系统，如Windows、Mac和Linux。Firefox由Mozilla基金会与社区数百个志愿者以GPL/LGPL/MPL三种授权方式发布，2012年1月3日起改用兼容GPL的MPL 2。
4网站的测试运行
4.1 安装IIS浏览网站
安装IIS：
1.通过用户界面安装 1.单击“开始”/“控制面板”/“程序”，选择“打开或关闭Windows功能”。
2.在Windows 功能对话框中，选中“Internet信息服务”
3.单击“确定”，这时就会启动IIS的安装过程;这时注意啦，如果你用上述步骤安装，得到的是默认的安装，也就是最少的功能。如果你需要额外的IIS功能，如应用程序开发功能或者Web管理工具，就要在Windows功能对话框中，保证选中这些功能的相关复选框。
1）进入Windows功能窗口，然后看到internet信息服务选项，然后按照图中设置即可[]，Ps：打√的选项下面为全选，方圈的下面按照图中打√的选择即可。如下：（图4.4）
2）安装成功后，窗口会消失，然后回到控制面板，选择系统和安全.进入系统和安全窗口，然后选择左下角的管理工具。进入管理工具窗口，此时就可以看到internet信息服务了，不过此时需注意，因为有两个大致相同的，需要选择的是internet信息服务（IIS）管理器。
3）双击internet信息服务（IIS）管理器，进入到管理窗口，看上去很复杂，有三大主要功能:FTP,IIS,管理，现在需要设置都在IIS这个里面。点击左边的倒三角，就会看到网站下面的default web site，然后双击IIS下面的ASP.进入ASP设置窗口，行为下面的启用父路径，点击后面，修改为true，默认为false。然后再来设置高级设置，步骤：先点击default web site ，然后点击最下面的内容视图，再点击右边的高级设置。进入高级设置，需要修改的是物理路径，即本地站点文件程序存放的位置。再来设置端口问题，步骤：点击default web site 再点击最下面的内容视图，然后点击右边的编辑绑定。进入网址绑定窗口，也就是端口设置窗口，一般80端口很容易被占用，这里我们可以设置添加一个端口即可，如8080端口。此时，基本完成IIS的设置，不过有时候，可能还是不能顺利完成本地安装，此时需要注意一个问题，那就是默认文档中的选项是否含有default.html这个选项，没有就需要添加，才能顺利完成安装，步骤：回到主界面，然后点击IIS下面的默认文档。然后在右上角选择添加，输入default.html即可。
做完以上的设置应该就可以在IIS上登陆自己制作的动态网站以便完成测试。
有些asp程序搭建可能还会存在一些问题，可能会涉及到数据库的问题，因为我家电脑是用WIN7 64位系统这个系统版本所以现在这里讲的是win7旗舰版64位系统的，有一些程序的数据库需求是32位的，这个就需要另外设置了，设置的的时候可以注意一下。
5网站的设计
5.1 网站站点的建设
打开Dreamweaver 8→站点→新建站点；
进入【站点定义】窗口，点击【高级】选项卡
进入【本地信息】分类窗口分别输入：
站点名称： MYWANG
本地根文件夹： C:\inetpub\wwwroot\wangzhan
进入【测试服务器】窗口，分别选择
服务器模型： ASP VBScript
访问： 本地/网络
点击【确定】按钮完成站点设置。
完成后右下角的站点窗口会显示一个新的站点。（如图3.1）
（图3.1）
5.2 网站板块的设计
这个网站主要是让一些喜欢动漫的用户，对动漫有更深入的了解并且了解一下现在动漫最新的相关资讯。而且用户们可以不用注册直接浏览本网站，也不需要注册可以跟志同道合的漫友们交流。
本网站主要内容包括：首页，小视频，人物介绍么，留言板等主要版块。
（图3.2)
5.2.1 首页板块的设计
网站首页是一个网站的入口网页，故往往会被编辑得易于了解该网站，并引导互联网用户浏览网站其他部分的内容[]。 所以作为整个网站的首页，为了让用户浏览方便，在进行版面设计时，将本作品的几个主要版块的内容都浓缩在首页的界面里，从而令用户可以快速的看到用户所感兴趣的内容，节省用户浏览的时间。另外由于本网站新增留言板。其中自然带有可以把恶意留言删除的管理员功能。
首页（图3.3)
由于以上是版面只用了(Dreamweaver 8)一些比较简单的插入图片和插入FLASH功能所以详细就不在本文介绍而且由于Dreamweaver操作起来比较简单图3.3里面的FLASH按钮直接在Dreamweaver选择插入FLASH里面就可以根据个人喜好选择自己喜欢的FLASH按钮。
5.2.2 视频板块的设计
这个板块用于动漫视频的播放，为了方便用户此板块也没有制作更多的修饰，只是简单的插入了FLASH小视频，图片，文字等进行排版。利用Dreamweaver插入功能插入FLASH视频可以同时调整播放界面的大小，视频是否自动播放，是否自动循环播放。如（图3.5）
视频板块（图3.4）(图3.5）
5.2.3 人物介绍板块的设计
这个板块是为了让用户了解动漫的一些人物情况而设计的，内容比较简单就是用文字和动漫人物的图片，水平线把这些材料排版整理好。
人物介绍板块（图3.6)
5.2.4 留言板板块的设计
这个板块是整个网站比较重要的一个内容,制作的难度也相比较其它页面大。留言板页面属于动态页面。留言板是用于用户们留言，既然要把用户们的留言显示在页面上，这个页面就需要有一个数据库的支持，数据库用于把用户们的留言内容信息保存再通过页面和数据库的连接显示出来。下面是我制作留言板页面的过程结果:
制作动态页面首先需要建立一个数据库：
打开Microsoft Access 2010新建一个空白的数据库制作2个表如下：
漫友： 文本域 123
留言内容: 文本区域 232
留言时间: 隐藏
回复内容: 文本区域
回复时间: 数字
用户名: 文本区域
密码 文本区域
在建立以上数据库后我在漫友和内容那里输入了留言，以便后面测试删除功能。
在建造完数据库以后打开（Dreamweaver 8）新建一个动态也ASP VBScript 到这里因为我是新建一个留言主页面所以首先连接数据库：在右面打开服务器行为面板，看那四项中的前三项前是否有勾号，如果没有就是相应项在定义站点是没设置好，重新编辑Dreamweaver的站点，如果有就开始创建记录集，在服务器行为面板上单击"+"号，定义连接数据库字符串。按数据库弹出的菜单点：自定义连接字符串"按钮，如图(3.7)
(图3.7）
在"自定义连接字符串"对话框中填写连接名称gbook，连接字符串："DRIVER={Microsoft Access Driver (*.mdb)};DBQ=C:guestbook.mdb" 然后按测试，软件自动的生成和数据库的连接的conn.asp文件(Connections文件夹内)其实还可以使用另外一种语句：
"Provider=Microsoft.Jet.OLEDB.4.0;DataSource="&Server.MapPath("/inetpub/wwwroot/wangzhan/guestbook.mdb")
（图3.8）
创建记录集，点绑定出来菜单，点记录集按如下图选择，这样就完成了连接数据库的工作。
完成以上步骤后，在页面上插入一个表格要来把记录集的内容拉过去表格的相应单元格里面去，并且在空白地方输入留言，管理按钮然后把这2个按钮分别连接在post.asp admin.asp
上面，然后可以测试一下效果了。测试应该看可以看到我之前在数据库里面输入的漫友123 留言内容232。这里有个地方需要说一下因为留言显示页面需要做到多条显示出来，这个时候就要全选表格选择重复区域。在这个地方容易产生一个细节我做的时候也遇到过，就是全选表格重复区域的时候显示错误，因为现在是用Dreamweaver所以我们可以转换到代码视图按照（图3.9）修改代码就可以完成
（图3.9)
接下来就是制作一个留言页面同样新建ASP网页保存post 然后使用插入表单在表单里面选择插入记录分别插入文本域，文本区域和按钮。然后把之前的记录集分别绑定上去就可以了。最后把提交显示转为之前那个留言显示页面、这里的文本域就是数据库的漫友，文本区域绑定的就是内容按钮其实就是一个提交按钮。到这里就可以测试一下留言页面的功能，在里面输入内容就可以在留言显示页面看到。
以上就是一个最基本的留言板页面制作及测试。因为要把多余的留言或者不雅的留言删除所以需要增加一个可以把留言板管理的页面。下面制作管理页面的一些简单情况介绍。其实本网站基本操作都在Dreamweaver8这个网页开发软件的环境里操作，基本不需要接触代码。
首先新建一个页面作为管理员登陆的页面.。
1.新建一个页面，保存为login.asp，首先插入一个表单，在表单内插入表格，在表格加入2个文字区域一个用来做登陆的用户名输入另外一个要来做密码输入，然后就如（图4.0）在行为面板选择。
（图4.0)
用户登录设置：首先在使用链接验证里选择数据源admin，然后在“如果登陆成功，转到”后面的输入框里输入manage.asp（管理页面），最后在“如果登录失败，转到”后面的输入框里输入login.asp，使登录不成功时就转到管理员登录页面。如图4.1
（图4.1)
用户登录设置保存login.asp，然后打开站点文件夹下的的数据库，打开里面的admin数据库表，然后就可以保存打开测试一下效果。
删除页面：
新建一个页面，保存为delete.asp，首先插入一个表单，在表单内添加单元格与表单域。大概也就和之前显示留言的页面差不多。如果嫌麻烦可以直接把之前的留言显示页面另存。再加一点修改就可以了，然后也和之间的留言显示的页面一样打开记录集把里面的留言人和内容分别拉过去相对应的表单域如图4.2
（图4.2）
另外由于这个页面属于管理员页面所以我们必须设置这个页面在登陆以后才可以打开显示。打开服务器行为面板，单击“+”按钮选择用户身份验证下的“限制对页面的访问”，打开限制对页的访问对话框然后设置。最后一步就是打开服务器行为面板，单击“+”按钮选择删除记录。设置入图4.3这样就可以完成。把设置最后那一行删除后转到之前的留言显示页面。
（图4.3）
最后就是回复的页面了，这个页面制作起来也是相对简单的。
新建一个页面，保存为huifu.asp作为回复页面，首先插入表单，在表单内添加表格与表单域绑定记录集：在绑定面板单“+”按钮，选择添加记录集；添加动态数据：留言人、留言内容、回复内容选中姓名对应的文本字段，在属性面板里改名为name，然后点击按钮，打开动态数据对话框，为留言人文本字段添加动态数据，选取记录集中的name字段。其他内容动态数据绑定的方法与留言人绑定的方法相同，按照上面的方法一一对应绑定即可。添加限制访问页行为：打开服务器行为面板，单击“+”按钮选择用户身份验证下的限制对页面的访问，打开限制对页的访问对话框按照之间删除页面一样设置。最后就是按照之前留言页面设置插入记录。
以上就是留言板的全部页面了，整个留言板系统也就可以使用了，使用Access数据库和Dreamweaver 8.0制作的这个留言板系统，结合了前后台的设计环境，采用了ASP VBScript服务器端脚本技术，功能丰富，充满个性而且制作难度也不大，我觉得对喔这种新人学习制作比较好的一种。
6网站的测试运行
6.1 留言页面的测试
首先打开留言页面在页面在留言人那里输入213，在留言内容那里输入123然后点击留言.如（图1.2）
（图1.2）
然后页面自动转跳至留言显示页面，留言显示成功。测试成功。（图1.3）
（图1.3）
6.2 登陆页面测试
打开登陆页面在页面上输入在预设的账号密码测试是否可以登陆，然后再测试登录失败结果。（图1.5）
（图1.5）
经过测试输入正确密码以后自动转跳至管理页面，登陆失败则转跳回登陆界面。
6.3 删除页面测试
因为在制作过程中删除页面选择登陆后才可以登陆删除页面所以首先通过登陆页面进行登陆。然后再留言显示右下角选择删除，测试是否删除成功。（图1.9）
（图1.9）
7网站的使用介绍
1.网站首页使用
用户可以通过网站的首页进行对网站各种页面的选择连接，网站首页相当于一个网站的目录。可以通过（图5.1）点击连接人物介绍页面等进行访问。
（图5.1)
2.人物介绍页面
人物介绍页面比较简单，用户通过网站首页点击人物介绍进行连接就会转到人物介绍页面。（图5.2)
（图5.2)
3.视频页面
视频页面比较简单，用户通过网站首页点击人物介绍进行连接就会转到视频页面。点击视频页面里面的视频进行播放。（图5.3）
（图5.3）
4.留言板页面
用户点击网站首页留言板进行连接，连接后转跳的是留言板的留言显示页面。（图5.4）
（图5.4）
然后通过留言显示页面点击留言自动转跳去留言页面，在留言页面上输入名字，留言内容。然后提交，提交后会显示跳回去留言显示页面并且显示之前输入的留言。（图5.5）（图5.6）
（图5.5）
（图5.6）
5.管理留言页面
通过网站首页点击留言板进入留言显示页面，在留言显示页面左上角点击管理按钮可以进入管理页面的管理员登陆界面。（图6.0）
（图6.0）
输入登陆用户名和密码以后可以连接到管理页面。（图6.1）如果用户名密码输入错误则会自动跳回登陆界面。
（图6.2）
在管理员页面可以在右下角看到，回复，删除，编辑功能点击进去可以进行对留言的各种管理。不过由于在制作这些页面时候已经设置好这些页面必须通过登陆才可以进行访问。所以这些功能只有进行管理员的登陆才可以对留言进行编辑删除等功能。
8网站的管理与维护
1. 网站更新
网站发布到网络之后，经常需要更新一些漫友们需要的内容，例如更新一些动漫的新资讯，动漫的周边最新消息等。这样可以使得更多的漫友们知道更多的最新资讯，同时也可以使得更多的人浏览自己的网站从而提高自己网站的知名度，认识更多的人。这样就可以再搜索引擎上面排名靠前一点。当然现在搜索引擎网站排最前的通常都是给钱的。总之多更新网站是一个网站发布到网络上之后一个必须的。
2.网站优化
合理的网站结构、程序编写和简洁明了的网站导航，能够大大提高网站的访问速度，节约有限的服务器资源，有利于保持网站的流畅，有利于人们的浏览习惯，从而让漫友们爱上我的网站[]。但在现在的大多数网络公司和网站制作人员并不是很清楚这点，或在这方面经验不足，对这方面缺乏足够的认识，造成网站的访问速度缓慢、信息查询繁锁，对网站的浏览造成很大的不便。
3.网站推广
如果网站发布后任何推广工作都不做那基本就不会有人找到你的网站，所以推广这些工作也是一个必须的哪怕你自己的网站不是用作商业用途，像我的制作这个网站的用途是想跟朋友们分享喜爱的动漫，但是如果不做推广的话根本不会有人知道，就更别说认识更多的朋友，所以现在网站推广已经是网络发布后必不可少的环节。
4.网站安全维护
通过安全检测平台进行网站的安全扫描，如利用亿思安全检测平台进行漏洞扫描；还有对网站的权限设置好，把发现漏洞及时修补好！同时我觉得现在网络的流氓越来越多，垃圾留言或者污秽留言也越来越多，所以我觉得现在网站的安全，应该可以加上这个。把一些无用的不雅的留言，资源等等删除管理好。综合网站的维护是对自己网站的负责，同时也是对浏览网站的人们的一种负责。
总结
以上就是本人制作这个动漫网站的基本过程和制作的时候遇到的一些问题已经解决的方法，我在制作这个网站是在11月才开始的，之前由于工作一直的忙碌没什么时间去研究。在我搜集素材的同时我也越发感觉到现在网络技术提升对人们生活作用越来越大，还记得以前的街上很多的人在逛街的同时都会去逛商场，买东西的人也很多，但是现在因为网络技术提升了，各大网络营销网站提供给人们一种生活上的便利，但是同时也对实体店铺的运营产生极大的负面影响。因为网络上可以免去一些实体店铺的一些成本。说的简单一点，本人觉得预计未来商场超市除了食品类别的，其它商品可能以后再商场上只等于是一个展览位置。不过网络发展势头已经是一个不可改变的事实在生活质量提高的同时我也希望未来网络技术肯定是人们生活的主导。
致谢
11月开始制作一直到现在12月，在中间遇到各种各样的问题就像之前IIS设置那里，因为自己本来基本功就差设置了很多次才成功。不过，我也通过这次的制作学习到的东西可以让我更加容易的掌握这个方面的技术。在这里我很想感谢一下我的朋友，同学和老师。因为在我的基本功差上网搜索解决方法的时候很多时候还是搞不懂，最后还是老师和同学们的解答帮助了我完成了最后的网站设计。
参考文献
[1]王楠、李岭松，网站设计教程与上机指导，清华大学出版社,2006
[2]DW 8视频教程，http://v.ku6.com/playlist/index_3914770.html，酷六网
[3]李军、黄宪通、李慧 ，ASP动态网页制作教程(第2版) ，人民邮电出版社教材，2012
[4]陈向阳，网络工程规划与设计，清华大学出版社，2007
