本科毕业设计茂名市环境保护局公众服务网站建站方案Word下载.docx
《本科毕业设计茂名市环境保护局公众服务网站建站方案Word下载.docx》由会员分享，可在线阅读，更多相关《本科毕业设计茂名市环境保护局公众服务网站建站方案Word下载.docx（20页珍藏版）》请在冰豆网上搜索。
栏目设置
一级栏目
二级栏目
导航栏目
1、机构介绍
机构设置、职能介绍、领导致辞、领导成员、联系我们
2、政务信息
政务公开目录、政务新闻、工作动态、图片新闻、公示公告、环境状况公报
3、环保政务
建设项目环保管理、污染源管理、核安全与辐射管理、机动车排气管理、环境监测管理、排污费征收管理、水环境管理、大气环境管理、固体废物管理、噪声环境管理、环保责任考核、模范城市
4、法律法规
国家环境保护法律、最新环境保护法规、环境保护行政法规、环境保护部门规章、环境保护地方性法规、环境保护地方政府规章、环境保护规范性文件
5、办事指南
网上申报指南、办事指南
6、环境执法
行政执法与法制建设、专项行动、环境监察
7、环保科技
环境标准、环境技术
8、生态保护
自然生态保护、生态示范区镇、农村环境保护、ISO14000示范区
9、环保知识
环境知识、绿色学校、绿色社区
10、网站导航
专题栏目
1、党建与纪检
2、机关作风建设
动态栏目
1、网上办公
资料下载、建设项目环保审批、建设项目竣工环保验收申报、辐射安全许可证申请、环保专项资金申报、建设项目竣工环保验收申报、排污许可证管理、排污费征收管理
2、公众互动
公众监督、业务咨询、公众留言、环保投诉（包括投诉热线）、局长信箱、回复查询（包括常见问题回复）、网上调查、RSS政务信息订阅
3、环保服务
站内搜索、空气质量日报预报、饮用水源水质月报、江河自动站周报
资料来源：
由茂名市环保局提供
通过对茂名市环境保护局提供的地级市环境保护局公众服务网站功能需求进行分析归类，其中属于信息发布的模块有：
机构设置、政务信息、环保政务、法律法规、环境执法、环保科技、生态保护；
属于公众服务性质的模块有：
办事指南、网上办公、网上查询、公众互动；
属于网站的特色板块的有：
环保知识、环保专题、环保服务。
以下对茂名市环保局功能栏目进行简要分析：
1.机构介绍：
该栏目作用是介绍茂名市环保局的机构设置以及领导层人员，向群众公开市局工作人员的资料及形象，加深群众认识，做好政务公开工作。
所以该栏目适宜放在首页并设置链接，通过链接点击进入一个新打开的详细的机构介绍页面。
2.政务信息：
政务信息是整个网站最重要的信息发布模块，是政府所掌握的大量重要信息的广泛共享的平台，把政务信息的内容放在首页中显示，加入新闻图片能让市民能图文并茂的摄取信息内容。
3.环保政务：
环保政务模块涉及的信息量大，适合设计一个专题页面独立显示，在首页中设置一个链接，跳转到该页面即可。
4.法律法规：
法律法规模块是教育群众识法懂法，能方便群众查询相关法规的模块，通过首页导航可以跳转到该页面的专题页面。
鉴于法律法规的特殊性，所以在首页中规划一块区域，用于更新各系法律法规最新出台的信息，让市民一目了然知晓最新法律问题。
5.办事指南：
办事指南属于公共服务模块，由于办事指南涉及的分类很多，所以采用专题页面显示，在首页设置跳转链接，并在首页中设置一块区域用于动态更新“办事指南”栏目信息，便于群众查询或最需了解的办事指南或有变动的办事流程。
6.环境执法：
环境执法是环保网有关环境监察、行政执法后的相关工作的公示，用专题页面显示。
7.环保科技：
环保科技用于有关环境保护方面技术的公示，以及各界有关于环境保护技术的工作动态报道，是属于茂名环境保护网的一个专题栏目。
8.生态保护：
生态保护专题用于介绍各种各样的生态文化保护知识及相关工作汇报。
9.环保知识:
环保知识是用于是宣传介绍各种环境知识，介绍新兴的绿色学校或绿色社区等内容的特色模块，能让市民学习保护环境，加强市民环境保护意识。
10.专题栏目:
专题栏目是网站的重要模块之一，主要是介绍市环保局的党建与纪检，机关作风建设，用于政府向群众展示一个廉洁办事效率高效的政府形象。
同时也是用于群众监督政府的模块，将党建与纪检、机关作风建设的最新重点的内容放于首页，能让市民直击政府政绩进行监督。
11.网上办公：
网上办公是门户网站与群众的沟通桥梁，指导群众通过网站了解办事流程，网上办公的内容简明清晰化，将有利于群众更好的利用环境保护网这个平台，也有助政府办公“e纸化”和实现高效化。
12.公众互动栏目:
公众互动栏目是公众与政府交流的平台，注重公众与政府之间的交流信息即时反馈，通过对公众意见投诉等信息进行归类查询统计，排除无效信息，精简有效信息，能帮助政府了解最新公众投诉意见和即时解决问题。
13.环保服务:
环保服务模块主要是向市民报告城市最新的有关空气、水资源等检测数据。
以上栏目的共同特点是信息的动态性和实时性，群众浏览的前台页面信息是通过后台发布后从数据库即时调出的，确保信息传递的及时性。
通过使用环保局服务器上的TRS后台的管理中心，实现分板块信息动态管理。
这样环保局中的各类部门将可以管理发布其负责的信息模块，信息即时共享。
所有信息将保存在网站数据库中，利于信息资源整合。
图1信息前台与后台连接示意图
每一个独立的栏目信息板块均具有以下特点：
1.信息列表，自动排序——群众浏览的信息基于时间来管理，文章列表按发布时间排序显示，把热点信息用“
”加亮显示，最新更新信息用“
”加亮显示，让浏览者一目了然，阅读最新的信息动态。
2.重要信息，排序首页——在列表框中可以人工设定某些重要信息置顶。
3.图文并茂，强化主题——根据需要附带新闻图片，加深群众认知，增强新闻渲染效果。
4.信息发布，简单易行——信息可以根据需要通过TRS内容管理平台增加、修改、删除。
二、网站的规划设计方案
（一）环保局网站的风格定位
1.主题风格
“茂名市环境保护局公众服务网站”主题风格主要根据环保局的行业性质的来决定。
环保网其职能是宣传环境保护信息，为市民提供便利的网上办事服务。
为了方便浏览者在堆砌的信息中有效、快速进行目标选择，帮助群众体验到市环保局的全系列服务。
网站主题风格走清新自然风格，采用冷色系（如蓝、绿）为基调，使得页面整体倾向于清爽，简洁。
局部模块配上鲜艳的色彩，突出重点，让网站看上去更有立体感，预防了由于色彩搭配过于淡雅给市民没有重点、不够专业的感觉。
2.网站标志（LOGO）
LOGO是指网站的标志，标志可以是中文、英文字母，也可以是符号、图案等。
茂名市环保局是政府部门，所以标志的选择无需标新立异在设计，统一使用通用的环保局标志，一方面可以和其他环保局相呼应，另一方面也可以加强群众的认知感。
3.网页采用的字体
文字字型上的设计，使用网页默认的宋体。
为了使网站体现其美观和协调，但又不“千遍一律”，在栏目的标题部分则用其他字体表示，如导航采用黑体，特色栏目的标题部门采用简中圆字体。
把使用简中圆字体部分转化为图片的形式，利于没有安装该字体的用户浏览。
4.网页中加入的视听元素
网站的视听元素，主要包括：
文本、背景、按钮、图标、图像、表格、颜色、导航工具、背景音乐、动态影像等，多元化的视听元素，能够大大丰富网页的艺术设计表现力。
茂名市环保网设计中采用了多种元素，在网页中搭配与环境保护的主题相呼应的FLASH动画和GIF动画增强网站的活力，给人视觉上带来动感，增强网站的艺术感染力。
（二）界面的色彩搭配
1.网页主色调
网页的颜色选择，可以根据主页内容的需要，遵循色彩的“总体协调，局部对比”原则，主页的整体色彩和谐，局部使用一些强烈色彩加强对比。
环保网以清新为主调风格，适合采用给人宁静、清凉氛围的冷色调作为整体色调，如青色、绿色、蓝色，局部使用对比色调，如黄色、橙色，改善由于单一色彩给人的沉闷感。
2.网页中的图片选择
在环保网站的设计中，页面亮点在于banner部分，它对整个页面起着画龙点睛的作用。
在banner的制作上，选择和环境保护相符合的图片，在对图片用Photoshop加工处理，加入宣传标语，使banner切合网站主题，网页看起来更加美观。
3.网页的底色搭配
网页的底色是整个网站风格的重要指针，为了配合网页的整体色彩，选择具有渐变色彩的青蓝到浅蓝的过渡背景，作为首页的背景。
同时用浅灰色的底纹作为列表页面和内容页面的背景，用于区分与首页的不同，也能让网页整体视觉有所变化，避免呆板。
（三）网站整体站点地图
图2首页链接图
图3次级页面链接图
（四）前台页面版式布局
网页的版式布局，是指通过对网页页面结构的分割和造型空间的确立，将丰富的元素和多样的形式组织在一个统一的结构。
网页的版式布局结构主要分框架式和自由式两种类型。
框架式是一种理性的结构形式，是指利用各种不同的方形框架对网页进行分割。
茂名市环保网由于网站涉及的信息量大，为了增强网站的界面友好性和使用的便捷性，选用框架式的结构布局可使网站看起来更加沉稳大气。
1.首页的基础框架
茂名环保网站，属于信息罗列型网站，一般在首页中就要罗列出网站的主要内容分类、重点信息、网站导航、专题栏目等信息。
适合采用的“国”字型布局框架，它是一种适合信息量大的门户网站的常用的布局框架，在这个框架的基础上，根据具体专题栏目的内容进行不同程度的破格设计，可将将文字、图像、导航条等各要素纳入框架秩序中。
现在主流显示屏通用的分辨率是1024*768px，环保网页面宽度为960px，长度则根据内容的不同而变化。
图4首页基础框架图
从上图中可以看出，首页的整体布局结构划分为五行（从上到下），第一行是首页Banner的Flash动画，第二行是网站导航，第三行为内容板块，第四行用于网站的友情链接，第五行是制作版权信息。
然后在第三行又拆分为两列（从左到右），分别在左右两列中制作不同的内容。
2.专题列表页基础框架
环保网的专题列表页是网页的二级页面，通过对导航和栏目标题的链接可以调转到该页。
专题列表页面涉及的内容是具体的，是网站关于某一分类的具体显示页面，所以环保网的二级页面适合选择拐角型的布局框架，上面是Banner及导航，接下来的左侧是一窄列链接等，右列是主要内容，底部是一些网站的辅助信息。
图5专题列表基础框架图
3.内容页框架
内容页是环保网的最底层页面，用于网站相应文章页面显示，采用标题正文型的布局框架，能简洁明了的展示正文。
内容页框架基础框架如图6所示。
图6内容页面框架图
（五）网站具体页面设计
1.首页设计
首页banner设计：
以蓝色为主色调，用手呵护住的地球与树木象征着美好的环境需要我们用心动手去呵护；
飞翔的白鸽象征着环保局代领人民共建出符合可持续发展的绿色城市；
初升的太阳与茂名实景搭配，一片绿色欣欣向荣的画面能增加市民对网站的亲切感。
页面内容设计：
网页具体栏目设计如图7首页效果图所示，页面上部分用于展示环保局动态信息与相关图片，便于市民直观获取信息；
右栏是“机构简介”栏目和“空气质量日报”等栏目的数据显示区域，数据通过连接数据库实现动态更新；
网站中下部分区域的内容主要是政府便民利民与民互动的模块，在这些栏目的区域的设计上，加入了符合主题的小图标，能丰富网页的内容，去除单调，美化页面；
江河自动站周报和饮用水源水质月报、办事指南和法律法规使用tab将内容滑动切换显示，能节省网页篇幅。
页面底部采用一幅清新自然的图片做结尾，与网页Banner首尾呼应。
在图片的空白位置插入相关政府网站的友情链接，便于市民快速访问，最后附上网站版权。
图7首页效果图
2.专题页面设计
专题页面是用于显示二级分类栏目的列表页面，如一级栏目“环保科技”中的“环境标准”、“环境技术”这样的二级栏目，由于二级栏目的数量和标题具有不确定性，选择竖向的列表排列设计可以便于后台程序设计员的代码编写。
页面的设计加入了一些树叶形状的元素呼应网页主题，美化页面增加页面质感。
图8专题页面效果图
3.列表页面设计
列表页面是用于显示专题栏目下一级的子栏目或没有二级栏目的专题文章列表的页面。
该页面的设计与专题页面的设计风格和版式基本相同。
如果列表文章数目不多的话，则显示如图9右下角中的一片叶苗，填补空白感，达到首尾呼应的整体平衡效果。
图9列表页面效果图
4.内容页面设计
内容页面效果如图10所示，用于显示文章的详细内容，若想回到上一级菜单，可通过点击当前位置的超链接回到上一个专题。
相关新闻为该文章所属专题的其它文章的链接，方便用户浏览。
图10内容页面效果图
5.特色模块——场景式服务
随着“以人为本”的理念深入民心以及服务型政府建设的提出，为了体现政府网站的人性化服务加入场景式服务。
场景式服务模块根据政府所掌握的信息按照服务对象、办事流程、办事事由、业务主题等多个维度来重新组织资源，并以图文结合的展示导航方式，向市民提供了一个“傻瓜式”的服务指南，场景式服务能够有效避免访问者的阅读疲劳，而且场景服务页面形象的设计，模拟真实办事场景的方式，能够激发访问兴趣，让用户在访问政府网站的过程中得到温馨的体验,从而提高用户的满意度。
图11场景式服务页面1
图12场景式服务2
6.网页版头顶端的Banner
政府网站注重便于用户的浏览和对信息的摄取，为了使网站看上去饱满美观，网页版头顶端的图片就起了至关重要的作用。
笔者设计了多款的Banner图片，可用于不同的专题页面和列表页面之间，通过图片与符合环保主题的标语结合，呼应网站主题（如图13所示）。
图13Banner效果图
（六）后台应具备的功能
本方案主要阐述有关茂名市环保网站前台网页设计的内容，详细的后台技术实现，将由制作公司的后台程序员结合茂名市环保局所提供的TRS内容管理软件完成。
TRS内容协作平台（TRSWCM）是基于Java和浏览器技术的一套网站内容管理系统，能实现全浏览器界面的内容创建、编辑和基于模板的内容发布，具备强大的站点管理功能，并提供企业级的协作环境，实现信息资源的分类导航，并提供基于内容的全方位检索功能。
后台程序员能把设计好的页面通过模版技术提供灵活的页面编写后台程序。
在TRS平台中以内置的安全机制控制合法用户的访问内容，保证了网站的安全性。
下面将简要说明该网站应具备的后台功能：
1.信息发布管理功能：
具有新闻的添加、编辑、排序、删除等基本功能，能对发布的新闻信息自由设置固顶或推荐。
2.图片管理：
通过TRSWCM建立图片管理站点，对网站发布图片进行统一管理，也可以制作成某个图片专题。
后台人员可以对图片的进行包括添加、删除、修改。
3.交流资源信息系统：
收集公众留言，群众意见及投诉等信息，并能对留言及意见进行反馈发布，修改，删除功能。
4.用户管理功能：
整个系统中包含两部分用户管理内容，一是政府人员的权限管理，分别为不同的职能部门设置其负责的内容管理权限，方便部门管理发布信息；
另一部分是外部用户进入查询系统时进行的身份验证。
5.系统设置功能：
包括系统名称、权限管理、密码修改等基本设置。
6.网站后台对数据库实行动态管理，可随时更新数据库的压缩、备份和恢复功能。
三、网站的实现
（一）网站建设的实施步骤
1.开发工具和后台搭建
前台使用Dreamweaver、Flash、Photoshop、矢量画图Illustrator等软件进行界面设计，后台在安装有TRS内容管理协助平台的服务器上进行开发建设。
2.空间租用及信息备案
空间租用中资源网络服务有限公司的空间，空间大小为500M，保证网站的快速、正常运行。
向互联网信息中心提交申请备案，根据茂名市环保局提供相关的资料申请。
3.测试运行
网站建成后，用一个月进行系统的测试运行，主要是对网页上的图片、文字、连接进行检查，保证网页内容正确、完整、有效；
对网站的功能、运行进行测试，保证网站安全、稳定地在互联网上运行。
4.正式上线
测试运行无误后，网站正式上线。
市民可通过域名正式访问茂名环境保护门户网站。
（二）网站推广
政府建设门户网站是想通过网络这个平台，利用网络的交互性，让群众知晓这个网站，传播信息，因此网站制作完成后，还需管理人员对网站进行推广，可以选择以下几种方法进行网站的推广：
第一：
友情链接推广方式，与其他政府网站进行友情链接合作，进行友情链接推广。
第二：
网站内容合作推广方式，利用政府网站内容的特殊性，与其他的一些相关的站点进行内容资讯甚至是图片视频等等的媒体合作，这样做合作推广的效果非常好，而且立竿见影。
第三：
搜索引擎推广，通过优化网站关键字等内容，提高曝光率，同时也便于市民在打关键字搜索的时候，可以准确的找到该网站。
第四：
论坛推广方式，针对用户群的网络习惯，找一些相关的论坛，进行高质量文章软文的发布，推广效果非常不错，而且非常有针对性，成功率很高。
（三）投入费用列表
项目名称
说明
价格
域名
一个国际或国内英文域名（）
388元/年
虚拟主机空间
500M网站空间，支持asp、PHP、CGI、VBScript等程序语言；
支持MSSQLSEVER2000和Access数据库;
1680元/年
设计服务
首页设计
图文加频道组合内镶flash动画美观独特的综合首页
2560元
内页设计
文字和图片组合，独特的动态内页设计
2850元
网站协助
初始资料
初始资料录入，由客户提供电子文档给承办公司录入
1850元
操作培训
由承办公司对网站负责人进行后台操作培训及培训资料
1500元
网站维护
网站修改、数据备份、网站安全、资料更新等
3890元/年
网站费用合计
合计金额：
11868元
四、总结
目前，政府网站已经成为了公众日常生活中必不可少的一部分，同时也是政府服务公众的重要途径。
以上对茂名市环保局的门户网站的建设方案，已经被茂名市环保局采用。
本方案中的网站虽然已经建设完成，但由于本人知识水平有限，对方案的制作还存在一些不足之处，如对于网站一些功能栏目未能全面细致的分析，对某些栏目专题的用途并未深入了解。
利用Dreamweaver制作网页的水平有限，网页中部分地方有些粗糙等。
总之，通过本论文的写作，让我加深了网站的建设的步骤和方法的认识，把理论知识运用到实际之中，整个过程使我受益匪浅。
希望网站建设完成后，能够满足到市民的需求，网站实现搭起政府与群众沟通的桥梁作业，同时帮助政府加强政企互动，实现政府与市民、企业之间的信息交互。
升级会员 