项目 6 政府门户网站的建设 — 主页的规划

1. 项目6 政府门户网站的建设—主页的规划 任务1 政府门户规划网站 任务2 建站准备 任务3 制作网站主页 任务4 添加主页特效

2. 任务1 政府门户规划网站 任务1.1  政府门户网站设计和制作中注意的问题 （1）作为政府网站，应该大方、庄重、美观，切记花哨和笨重，格调要明朗。 （2）政府网站信息必须积极配合党和国家当时的政治形势，网站发布的内容必须具备严谨性和准确性。 （3） 一般情况下主页的大小最好控制在80KB以下，其他页的非重复部分在50KB以下。 （4）政府网站首页的导航应该力求简单和高效率，以便于网站的信息更新和维护。 （5）为了加强政府网站的视觉识别效果，建议各级政府网站在首页上增加该政府部门所属部、委、行、署的网站徽标。 （6）政府网站如没有自己的专用徽标，可以使用国徽、红旗等标志。 （7）在设计中应该注意网站结构、文件命名、导航、常用文件等多方面的规范性和统一性。

3. 任务1 政府门户规划网站 任务1.2 政府门户网站主要功能 （1）后台动态信息发布功能：旨在实现公告栏、政府新闻等动态信息的录入、审核、查询等功能。 如图所示为后台文章发 布管理页面 admin/index.asp。

4. 任务1 政府门户规划网站 任务1.2 政府门户网站主要功能 （2）搜索功能：对于信息量大的网站是一种有效的检索工具。

5. 任务1 政府门户规划网站 任务1.2 政府门户网站主要功能 （3）新闻信息浏览功能：网站中的一些新闻、政策、信息等通过程序调用数据库中的内容直接在前台显示 。 （4）在线调查功能：获得公众意见作为政务工作的参考数据，通过开展问卷调查，可以迅速了解社会不同层次、不同行业的 人员需求，客观地收集需求信息，调整修改政府策略，满足不同的需求，促进政府的办事效率。

6. 任务2 建站准备 任务2.1 创建本地站点   建设站点前利用Dreamweaver CS3创建一个本地站点。

7. 任务2 建站准备 任务2.2  搭建IIS平台   启动IIS在【默认网站属性】 对话框中设置【主目录】选项卡 。

8. 任务2 建站准备 任务2.3 创建数据库 数据库是“11”文件夹下admin\data中的mynews.mdb文件。如表所示是新闻信息news中的字段。

9. 任务3 制作网站主页 任务3.1  制作网站主页 步骤1  创建一个空白的ASP网页文档，将文件命名为index.asp。 步骤2 将光标置于页面中，选择【修改】|【页面属性】命令，弹出【页面属性】对话框，在对话框中，【页面字体】设置为【宋体】，【大小】设置为12像素，在【背景图像】文本框中输入images/bg.gif,【左边距】设置为0像素，【上边距】设置为0像素。

10. 任务3 制作网站主页 任务3.1  制作网站主页 步骤3  将光标置于页面中，在代码视图中，在HTML前边输入以下代码： <%@ language=VBScript%>      //包含数据库连接文件conn.asp, 此文件在本地站点中的include文件夹下 <!--#include file=include/conn.asp -->      <!--#include file=include/function.asp -->//包含函数文件function.asp      <!--#include file=include/config.asp -->//包含网站信息设置文件config.asp

11. 任务3 制作网站主页 任务3.1  制作网站主页 步骤4   将光标置于页面中，选择【插入记录】|【表格】命令，弹出【表格】对话框，在对话框中，【行  数】设置为1，【列数】设置为1，【表格宽度】设置为780像素，【边框粗细】设置为0像素，【单元格边距】设置为0，【单元格间距】设置为0。

12. 任务3 制作网站主页 任务3.1  制作网站主页 步骤5  单击【确定】按钮，插入1行1列的表格，此表格极为“表格1”，在属性检查器中将【对齐】设置为  【居中对齐】。 步骤6 将光标置于表格1的单元格中，选择【插入记录】|【图像】命令，弹出【选择图像源文件】对话框   ，从对话框中复制的文件选择 images/top1.jpg。 步骤7 将光标置于表格1的右边，选择【插入记录】|【表格】命令，弹出【表格】对话框，在对话框中,【行数】设置为2，【列数】设置为1，【表格宽度】设置为780像素，【边框粗细】设置为0像素 ,【单元格边距】设置为0，【单元格间距】设置为0，单击【确定】按钮，插入表格，此表格记为“表   格2”，将【对齐】设置为【居中对齐】。 步骤8 将光标置于表格2的第1行单元格中，选择【插入记录】|【表格】命令，插入1行4列的表格，此表  格记为“表格3”.

13. 任务3 制作网站主页 任务3.1  制作网站主页 步骤9 将光标置于表格3的第1列单元格中，选择【插入记录】|【图像】命令，弹出【选择图像源文件】对话框，从对话框中选择图ages/top_3_1.gif . 步骤10  将光标置于表格3的 第2列单元格中，单击属性检 查器中【背景】文本框右边 的浏览文件图标，弹出【选 择图像源文件】对话框，在 对话框选择背景图像images /top_3_2.gif.

14. 任务3 制作网站主页 任务3.1  制作网站主页 步骤11  将光标置于表格3的第3列单元格中，选择【插入记录】|【图像】命令，弹出【选择图像源文件】对话框，从对话框中选择图images/top_3_3.gif插入. 步骤12 将光标置于表格3的第4列单元格中，选择【插入记录】|【图像】命令，弹出【选择图像源文件】对话框，从对话框中选择图images/top_3_4.gif插入.

15. 任务3 制作网站主页 任务3.1  制作网站主页 步骤13  将光标置于表格2的第2行单元格中，选择【插入记录】|【表格】命令，插入1行1列的表格，此表格记为“表格4”. 步骤14 选中表格4，单击属性检查器中【背景图像】文本框右边的浏览文件图标，弹出【选择图像源文件】对话框，从对话框中选择images/top_4.gif插入 步骤15 将光标置于表格4的单元格中，将【高】设置为29，输入相应的导航文字，然后在属性检查器中【链接】文本框中输入相应的链接文件名。

16. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤1  将光标置于表格2的右边，在代码试图中输入以下代码： <% dim typeid // 定义变量     dim typename // 定义变量     dim typecontent // 定义变量 set rs=server.CreateObject("ADODB.RecordSet") // 创建记录集 rs.Source="select * from type order by typeorder"     rs.Open rs.Source,conn,1,1     i=1     Dim ArraytypeID(10000),ArraytypeName(10000)     rs.close     set rs=nothing     set rs=server.CreateObject("ADODB.RecordSet")     rs.Source="select * from type where typeview=1 order by typeorder“     rs.Open rs.Source,conn,1,1     i=1     Dim ArraytyID(10000),ArraytyName(10000),Arraytyview(10000)     if not rs.EOF then     rseof=1     while not rs.EOF     RecordCount=rs.RecordCount     tyID=rs("typeID")     tyName=trim(rs("typeName"))     tycontent=rs("typecontent")     tyview=trim(rs("typeview"))     ArrayID(i)=tyID     ArrayName(i)=tyName     Arrayview(i)=tyview     i=i+1     rs.MoveNext     wend     rs.close%>

17. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤2  返回设计视图，将光标置于代码的右边，插入2行3列的表格，此表格记为“表格5”，在属性检查器   中，将【对齐】设置为【居中对齐】，【背景颜色】设置为#f4f4f4。

18. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤3  将光标置于表格5的第1行第1列单元格中，选择【插入记录】|【表格】命令，插入3行1列的表格， 此表格记为“表格6”。 步骤4 将光标置于表格6的第2行单元格，选择【插入】|【表格】命令，插入2行1列的表格，此表格记为     “表格7”，在属性检查器中，将【对齐】设置为【居中对齐】，【背景颜色】设置为#FFFFFF。 步骤5 将光标置于表格7的第1行单元格中，在代码视图中，在上面<tr>与<td>之间输入以下代码从新闻公   告表board中读取新闻公告信息 ， <%  set rs=server.CreateObject("ADODB.RecordSet") //创建记录集 rs.Source="select * from board where inuse=1" //从公告表board中读取记录 rs.Open rs.Source,conn,1,1    if not rs.EOF then // 循环直到记录结束   %>

19. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤6  将光标置于表格7的第1行单元格中，选择【插入记录】|【图像】命令，弹出【选择图像源文件】对话框，选择图像images/left_notice.gif插入. 步骤7将光标置于表格7的第2行单元格中，将【对齐】设置为【居中对齐】，选择【插入记录】|【标签   】命令，弹出【标签选择器】对话框，选择【HTML标签】|【页元素】|marquee 选项.

20. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤8  单击【插入】按钮，在文档中切换到拆分视图状态下，可以看到在代码中了<marquee></marquee>标 签. 步骤9 在<marquee></marquee>标签中间输入“<%=rs("content")%>“. 步骤10 将光标置于<marquee>中的“>”前面，按空格键以显示该标签允许属性的列表，从中选择属性   behavior,如图所示，这个属性是用来设置动态效果。

21. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤11  双击behavior插入，从其属性中选择scroll. 步骤12 双击scroll插入，按空格键选择属性direction. 步骤13 双击选择direction插入，从其属性中选择up并插入.

22. 任务3 制作网站主页 任务3.2  制作滚动公告部分 步骤14  在表格6的第2行单元格中，在代码视图</table>与</td>之间输入以下代码: <%else    rs.close //关闭数据库    set rs=nothing //清除内存中的记录对象    end if%>

23. 任务3 制作网站主页 任务3.3  制作便民服务部分 步骤1  将光标置于“制作滚动公告部分”表格6的右边，选择【插入记录】|【表格】命令，插入2行1列的表格，次表格记为“表格8”。

24. 任务3 制作网站主页 任务3.3  制作便民服务部分 步骤2  将光标置于表格8的第1行单元格中，插入1行1列的表格，此表格记为“表格9”，在属性检查器中， 将【对齐】设置为【居中对齐】。 步骤3 将光标置于表格9的单元格中，选择【插入记录】|【图像】命令，弹出【选择图像源文件】对话框  ，从对话框中选择图像images/index_shi.gif插入。 步骤4 将光标置于表格8的第2行单元格中，插入3行2列的表格，此表格记为“表格10”，单击属性检查器中  【背景图像】文本框右边的 图标，弹出【选择图像源文件】对话框，从对话框中选择背景图像   images/biangb.gif插入。 步骤05 选中表格10的第1行单元格，合并第1行单元格，将光标置于合并后的单元格中，选择【插入记录|  |【图像】命令，插入图像images/left1.gif,将【对齐】设置为【居中对齐】。

25. 任务3 制作网站主页 任务3.3  制作便民服务部分 步骤6 将光标置于表格10的第2行第1列单元格中，插入图像images/1.gif,在属性检查器中，将【水平】设置   为【居中对齐】，【垂直】设置为【居中】。 步骤7 将光标置于表格10的第2行第2列单元格中，插入图像images/2.gif,在属性检查器中，将【水平】设置为【居中对齐】，【垂直】设置为【居中】。 步骤8 将光标置于表格10的第3行第1列单元格，插入图像images/3.gif,在属性检查器中，将【水平】设置【 居中对齐】，【垂直】设置为【居中】。

26. 任务3 制作网站主页 任务3.4  制作热点导读部分 步骤1  将光标置于“制作便民服务 部分”表格8的右边，插入2行1列 的表格，此表格记为“表格11”， 在属性检查器中将【背景颜色】 设置为#FFFFFF。 步骤2 将光标置于表格11的第1行 单元格中，插入图像images/left_ hot.gif, 步骤3 将光标置于表格11的第2行单元格中，选择【插入记录】|HTML|【脚本对象】|【脚本】，弹出【脚  本】对话框，在对话框中单击【源】右侧的浏览按钮从站点中找到new.asp文件插入，并且在【源】 地址中修改为“new.asp?order=click&shu=8”，单击【确定】按钮即可插入脚本。

27. 任务3 制作网站主页 任务3.5  制作部门网站链接 步骤1  将光标置于“制作热点导读部分”的表格11的右边，插入2行1列的表格，此表格记为“表格12”，在属性检查器中将【对齐】设置为【居中对齐】，【背景颜色】设置为#FFFFFF。 步骤2 将光标置于表格12的第 1行单元格中，插入图像 images/left_links.gif。

28. 任务3 制作网站主页 任务3.5  制作部门网站链接 步骤3  将光标置于表格12的第2行单元格中，插入7行3列的表格，此表格记为“表格13”，在属性检查器中 将【背景颜色】设置为#f7fcf2。 步骤4　在表格13的每行单元格 中输入相应的文字。

29. 任务3 制作网站主页 任务3.6  制作牡丹市概况部分 步骤1　将光标置于表格5的第2列单元格中，将【垂直】设置为【顶端】，插入10行1列的表格，此表格记为“表格14”。 步骤2　将光标置于表格14的第2行1列的表格，此表格记为“表格15”，在属性检查器中将【背景颜色】设置 为#FFFFFF,【对齐】设置为 【居中对齐】。 步骤3　将光标置于表格15的 第1行单元格中，插入图像 images/middle1.jpg。

30. 任务3 制作网站主页 任务3.6  制作牡丹市概况部分 步骤4  将光标置于表格15的第2行单元格中，插入1行2列的表格，此表格记为“表格16” 设置【居中对齐】。 步骤５ 在表格16的第1列单元格中插入图像images/m_1.gif。 步骤６ 将光标置于背景图像上，选择【插入记录】|HTML|【脚本对象】|【脚本】，弹出【脚本】对话框，在对话框中单击【源】右侧的浏览按钮 从站点中找到new.asp文件插入，并且在【源】地址中 修改为“new.asp?typeid=10&shu =6"

31. 任务3 制作网站主页 任务3.7  制作政务信息部分 政务信息部分与牡丹概况部分相同，都是插入2行1列的表格，在第1行中插入导航图像，在第2行中分别插入图像和调用脚本文件new.asp。

32. 任务3 制作网站主页 任务3.8  制作政务信息部分 任务3.9  制作招商引资部分 任务3.10  制作旅游观光部分 任务3.11 制作本站专题部分 任务3.12   制作在线调查部分 任务3.13 制作底部版权部分  在此都不一一描述，最终效果 如图所示:

33. 任务4 添加主页特效 任务4.1   制作添加到收藏夹特效 步骤1： 将光标置于页面中相应的位置，在代码视图中输入如下代码： <span style="cursor:hand"      onclick="window.external.addFavorite（'http://www.mudan.com','牡丹政府网站'）"      title="牡丹政府网站">添加到收藏夹</span>

34. 任务4 添加主页特效 任务4.1   制作添加到收藏夹特效 步骤2： 按F12键保存网页在浏览器中浏览时，当单击“添加到收藏夹”文字时。效果如图所示：

35. 任务4 添加主页特效 任务4.2     制作设置为IE首页特效 步骤1： 将光标置于页面相应的位置，在代码视图中输入以下代码： <ahref=“#” class=“STYLE1” onclick=“this.style.behavior=‘ur1(#default#homepage)’;this.sethomepage(‘http://www.mudan.com’);” >设为首页</a> 步骤2：按F12键保存网页，在浏览器中浏览时，当单击“设为首页”文字时，效果如图所示。