动物园网站设计初探毕业论文.doc

摘要摘 要随着社会的发展，网络越来越显得重要，人们更愿意呆在家里了解世界的变化而不愿意踏出家门。想要让人们离开这种乏味生活，商家发现开动物园是很好的选择，可以放松心情，还可以感受大自然的美好。为了使动物园发展的更好，商家必须对动物园进行宣传，将动物园信息通过网络传到千家万户，吸引客户踏出家门、前来参观，从而提高自己知名度。我将利用网络传播速度快的特点把动物园网站品牌打响，让客户了解动物园是做什么之余还可以看到动物园的物种的样子。同时，通过网络的推广和内部系统管理，可以实现成本低、效率高的管理模式。可以说建站不但是方便客户，而且方便动物园企业管理。关键字：网站；宣传；发展 AbstractWith the development of the society, the network is more and more important, people are more willing to stay at home and know the world of change and dont want to step out of the house. Want to let people leave this boring life, the businessman found open zoo is a good choice, can relax the mood, also can feel the beauty of nature. In order to make better the development of the zoo, the businessman must carry on the propaganda to the zoo, the zoo information through the network to families, step out of the house, to attract customers to visit, so as to improve their popularity. I will take advantage of the characteristics of the network transmission speed the zoo website brand, let the customer know the zoo is what to do and can see the look of the species of the zoo. At the same time, through the network marketing and internal management system, can realize low cost, high efficiency management mode. Can say site is not only convenient customer, enterprise management and convenient to the zoo. Key words：website;propaganda;development14目录目 录一、 网站设计背景3（一）网站设计背景3（二）目的与意义3二、客户需求3（一）内容3（二）排版3（三）功能3（四）通讯3三、建站环境4（一）硬件环境4（二）软件环境41、Dreamweaver42、PhotoShop43,Sqlserve数据库44、Fireworks5四、整体设计5 （一）网页开发流程5（二）网页结构流程6（三）各功能模块的介绍71、登陆界面72、首页设计93、公告部分104、企业介绍115、相册展示116、联系我们12参考文献14致谢14动物园网站设计初探一、 网站设计背景（一）网站设计背景随着城市化速度的加快，生活水平的提高，人们越来越希望回归大自然，感受大自然带给我们的自由与快乐，为此一种新型娱乐方式产生游逛动物园。而要让人们知道有这样一个让人心旷神怡的地方，就必须对动物园相关事项进行大力宣传。随着科技的发展，人们的生活水平得到显著提高，网络已然普及家家户户，设计一个好的网站吸引没有地域限制人们的目光那是最方便也是最能反应动物园情况的了。（二）目的与意义动物园网站是动物园内部向客户和网民提供信息的一种方式，是动物园开展电子商务信息的平台。动物园网站上宣传和反映动物形象的重要窗口设计就显得极其重要。通过网络将动物园的品牌知名度，用户的访问量以及在线交易的成交提升到更高的一个层面，将动物园网站存在的价值发挥到最大化，让它为动物园创造价值，创造出意义。本文将就动物园网站的设计寻求探索一些策略，让人们浏览网站后就想亲身体验动物世界的神奇。二、客户需求（一）内容网站宣传动物园概况、联系方式、联系信息、动物相片、动物介绍、票务信息、下单买票、动物园信箱、捐款献爱心等。（二）排版页面布局，风格设计，美术编辑要美观，以灰褐色为主。要能在三秒钟内抓住浏览者的眼球。（三）功能本站公告、资源上传、对客户的评论进行处理、收藏网站等模块尽可能的有。（四）通讯方便及时的信息传递，有信息发布系统，发布最新消息。三、建站环境（一）硬件环境Windows版本：Window 7 旗舰版处理器：Intel（R） Core(TM) i5 CPU M480 2.67GHz 2.67GHz安装内存（RAM）: 2.00GB系统类型：32位操作系统支持IE8.0以上版本浏览器（二）软件环境1、DreamweaverDreamweaver是梦想编织者，是一种专业网页制作软件，它提供了很多建站工具，具有强大的网页制作功能。Dreamweaver是本论文不可或缺的软件，可以说，没有它我就很难设计出一个完美的网站。还有利用Dreamweaver的编辑功能，可以快速创建Web页面而无需编写任何代码，不用繁琐的记录代码以及代码的意义，它在代码这一界面几乎完全可以自动生成代码和一些代码片段，图片方面也可以经过浏览或是插入进去。例如，我在动物园网站首页设计的时候要有一个框架，在设计界面就会有自动生成的代码，所有的代码均在body标签显示。当然，它还可以使用服务器技术。我将根据网站的货设计需求，给动物园网页一个良好的定位，完成整站的设计制作，让动物园网站达到很好的效果。2、PhotoShopPhotoshop是一个专业图像处理软件。相比于其他图片处理软件我更喜欢Photoshop，因为它功能更加强大，能经过简单处理就达到其他图片处理软件的效果。无论是哪个网站都需要有良好的文字与图片的组合，几乎每张能进入网页设计师眼的照片都要经过严格的图片处理，让图片的色调适合自己的网站。使用Photoshop众多的编修与绘图工具，可以更有效的进行动物图片编辑制作工作。对图片进行处理，合成、明暗修改、添加特殊效果等，让动物图片适合自己的个性。从功能上看，该软件可分为图像编辑、图像合成、校色调色及特效制作部分等。动物园网站设计中每张图像都有经过严格的处理。可以对图像做各种变换如放大缩小（Ctrl+t）、旋转（扭曲）、倾斜、镜像、透视等。也可进行复制、把动物图片从一个界面复制到另一个界面。还可去除动物图片上不小心留下的斑点、残损等。3、Sqlserve数据库数据库是计算机应用系统中的一种专门管理数据资源的系统。数据有多种形式，如文字、数码、符号、图形、图像以及声音等。数据是所有计算机系统所要处理的对象。人们所熟知的一种处理办法是制作文件，即将处理过程编成程序文件，将所涉及的数据按程序要求组织成数据文件，用程序文件来调用。数据文件与程序文件保持着一定的对应关系。这里的数据库的数据库名为Dbzoo，表为Animal。列 名类 型是否为空约 束说 明IDVARCHAR否主键IDAnimalIDVARCHAR否唯一种类AnimalNameVARCHAR否 名字AnimalRemakVARCHAR描述AddTimeDATETIM否入园时间DeathTimeDATETIME死亡时间SexINT性别 4、FireworksFireworks提供专业网络图形设计和制作方案。通过它，可以编辑网络图形和动画。动物园的网站中有很多模块需要切图，当我利用它来切图的时候就不用担心是否会留有空隙，因为只要划出它的网格，切刀就会紧贴网格线，不会留下任何缝隙，给图片排版带来方便。此外，网站上怎么可以少的了按钮，用Fireworks设计按钮元件，方便快捷，不用一把一划的处理每个部分，还可以直接导出软件自带的按钮，按钮的状态也可以设置，例如鼠标经过的状态、点击的状态、静止的状态等，这些状态都可以根据自己的爱好添加不同的特殊效果。它同时还要用到制作动画这方面。根据背景风格制作相应的二维动画。它支持位图和矢量图格式，我还要用它进行颜色取样。同时它与Dreamweaver、Flash能实现网页的无缝连接，与其它图形程序各HTML编辑也能密切配合，为用户一体化的网络设计方案提供支持。四、整体设计（一）网页开发流程我要在PhotoShop或Fireworks中设计图片以及框架，然后在Flash中设计动画，最后把图片和动画糅合到Dreamweaver当中。Dreamweaver的作用是一个整合器，把各种素材，包括声音、图片、一集动画、视频等都整合到软件当中，接下来就形成一个网站，通过客户端的浏览器来展示给最终的用户。我可以通过ASP/JSP/PHP这些服务器程序调用数据库，比如说SQL数据库来展示到用户端，就形成了动态页面，我随时可以更新数据库里面的内容，以动态显示到客户端。这样就可以大概了解到Dreamweaver在网页设计以及网站开发流程中的作用。Dreamweaver不但可以进行艺术的设计，还可以用来辅助程序的开发，例如在Dreamweaver中开发ASP以及JSP等程序，可以有一些代码提示以及一些片段代码，来更加简单的创建web程序，他在编程方面主要起到辅助作用。（2） 网页结构流程用户由相应身份登录进入网站界面，在网站首页搜索全部内容，其他功能模块查看详细内容。（三）各功能模块的介绍1、登陆界面后台用户登录，只有管理员权限的才可以登录。可以用admin给用户分配权限。protected void ImageButton1_Click(object sender, ImageClickEventArgs e) var code = WebUtility.InputText(TbUserID.Value, 10); var password = WebUtility.InputText(TbPassword.Value, 10); password = DESEncrypt.Encrypt(password, code); var employee = new BLL.Admin.Employee(); string errorMsg; if (!employee.Validate(code, password, out errorMsg) Page.ClientScript.RegisterStartupScript(Page.GetType(), null, alert( + errorMsg + );); return; SessionCurrentUser = employee.GetUserInfo(code); username = employee.GetUserInfo(code).Name; SendMail(); FormsAuthentication.Initialize(); var ticket = new FormsAuthenticationTicket( code, DateTime.Now, DateTime.Now.AddMinutes(120), false, ); var hashTicket = FormsAuthentication.Encrypt(ticket); Var cookie = new HttpCookie(FormsAuthentication.FormsCookieName, hashTicket); Response.Cookies.Add(cookie); var requestUrl = FormsAuthentication.GetRedirectUrl(FormsAuthentication.FormsCookieName, false); Response.Redirect(requestUrl); public bool Send(MailAddress MessageFrom, string MessageTo, string MessageSubject, string MessageBody) MailMessage message = new MailMessage(); message.From = MessageFrom; message.To.Add(MessageTo); message.Subject = MessageSubject; message.Body = MessageBody; message.IsBodyHtml = true; message.Priority = MailPriority.High; SmtpClient sc = new SmtpClient(); sc.Host = ; sc.Port = 25; sc.UseDefaultCredentials = true; sc.Credentials = new System.Net.NetworkCredential(2609287894, 111); try sc.Send(message); catch (Exception e) Response.Write(e.Message); return false; return true; 2、首页设计动物园网站首页涵盖了整个网站的基本内容（从导航栏读出），有视觉焦点和操作焦点，具有亲和力，能让浏览者很快嗅到自己需要的信息，表达传承整个页面的营销意图。页面整体稳定，结构模块清晰，对色彩的把握恰到好处，符合气质，个性，朝气，有霸气。整体有质感，美观大方。因为与动物息息相关，页面设计以棕色线条为背景，运用表格的嵌套和图片的插入技术以及函数的调用将图片的排列布局都布置的比较赏心悦目。企业标志悬挂于左上方，上有漂亮的蝴蝶最突出的部分是静卧的两头狮子。首页结构设计走向：主页动物园游客信息票务新闻联系我们导航栏部分设计代码：主页动物园游客信息 票务 新闻 相册 联系我们3、公告部分公告部分与整体撞色，且处于界面最中间位置，意在突出重点，让客户第一时间看见动物园发出的最新动态。公告部分红色背景的字必须可以很快的更改，即“我们的网站由李超玲同学设计，正式上线啦！”可以随时更换。公告设置代码：最新公告:我们的网站由李超玲同学设计，正式上线啦！4、企业介绍动物园主页是静态的页面，它是文字的组合，利用表格的嵌套将文字进行布局，插入文字，再运用文字的设置将它们的大小、位置等进行调整，而且此页面次背景颜色选的非常准确，让人觉得它与前面的页面一样舒服。文字的设置代码（仅示例一段文字的表达方式）：这里动物园，搜集饲养各种动物，进行科学研究和科学普及并供群众观赏游览的园地。分专设和附设于公园内的两种。园中有饲养各种动物的特殊建筑和展出设施，并按动物进化系统结合自然生态环境规划布局。 其他套用以上模板。5、相册展示动物园网站相册展示页面不含滚动条或是什么，而是一个静态的页面，完全是通过各种动物图片的排列和整体布局来诠释整个页面的。页面的动物图片通过PS进行加工后再插入，又经过表格嵌套的布局排列，更显的美观，其次它的背景衬托也是非常和谐的，还用超链接将此页面与首页相连接。相册设置（仅取部分做示范）：看看我们的动物 狮子海龟大象其他套用以上模板。6、联系我们网站能实现资源共享，动物园网站将自己要推广的东西全部战士出来，当然也要从客户这边得到回应，所以设计一个页面叫做“联系我们”，在这个页面写下动物园的联系方式，其排列布局和字体大小的设计仿照企业介绍。对我们动物园网站感兴趣的客户一定希望得到关于动物园的第一手资料，时时关注动物园新闻，在联系方式下面设计一个新闻的订阅，让感兴趣的客户留下自己的邮箱，我们将通过邮件的方式发送给