信息系毕业论文-网站建设
长江大学工程技术学院信息系毕业论文长江大学工程技术学院毕业设计(论文)学生工作手册系 （部）： 专业班级： 学 号： 姓 名： 指导教师： 辅导教师： _2008_2011_学年_年_月 至 _年_月教 学 事 务 部 编 制论文摘要：网页的内容通常是由图片和文字组成。由文字构成网页的主体，而图片则能够美化和增色你的网页。那些包含了设计精美图片的网站，往往能让浏览者流连忘返。因此，有漂亮的图片是你的网页能吸引人的一个有力保证。 目 录摘要I第1章 选题背景11.1来源21.2目的21.3意义21.4应解决的主要问题21.5应达到的技术要求31.6国内外现状及发展趋势31.7所用各技术特点31.8网页制作优缺点41.9 PS页面样式5第2章 方案论证92.1设计原理102.2方案选择152.3方案的特点162.4 css代码17第3章 后台291 后台页面292 页面代码303 运行环境333 小结34第4章 总 结35致谢35第1章 引言一、介绍超链接是网页中最活泼、最有吸引力的一种元素。表单用于特殊的信息，使用户和网站进行交互，使你找到用户的详细信息。表格在许多工作中有着广泛的应用。框架网页是一种特殊的HTML网页，使用框架网页可以同时浏览几个不同的Web页面，使用Web页面显示一致的用户界面和灵活的页面内容。网页制作的高级技术包括：在网页中插入FLASH动画利用Java或者JavaScript制作网页的动态效果。网页中使用插件，视频等Web组件以及创建、发布和管理站点等技术。Web页面往往是具有各种各样的页面元素、丰富的内容和复杂的布局。因此仅仅使用到一种或者两种网页制作技术，不可能创作出一个优秀的Web页面，一个美观而实用的Web页面往往需要综合利用各种技术。二、概述1. 网站名称：“JONY的天空”2. 步骤： (1) 确立主题 (2) 收集资料 (3) 创建网站 (4) 编辑网页 (5) 美化网页三、目的运用已经掌握的知识完成一个环境保护企业网站。通过此次设计可以达到全面理解、运用网页制作的知识，并使之得以融会贯通，在掌握运用Dreamweaver制作网页的基础上再加以实践，进一步提高、加强自身的综合能力。四、要求根据公司的要求，设计一个网站，以达到宣传该公司及其产品的目的。有整体框架结构，表格定位等，布局合理，色彩搭配协调统一，内容丰富多彩，页面风格独特。五、设计工具Dreamweaver、Flash、Photoshop等。六、站点构思1.整体构思：本网站主题为：JONY的天空个人网站。总共有主网页7个，外加后台网页及程序。主页是一个总目录的网页，里面加有网页动画效果“相册浏览”及Flash动画，本站几个主要分网页分别为：首页、展示时刻、心情日志、随笔感悟、温馨相册、关于我们。还有许多子网页。2.页面构思：下面介绍一下网站中的几个网页的制作。背景色采用跟主页一样的蓝色，淡蓝色的背景给人以干净大方的感觉，上方为Flash动画与导航部分，全部网站均是用Photoshop制作的图片PSD图片，每个内页色调均不相同。左边的LOGO是用Photoshop制作的图片。每个页面都有一个内置的播放器，不同的页面有不同风格的音乐，让浏览者有身临其境的感觉，播放器支持点击播放/停止的功能，更加人性话。七 所用各技术的特点1.Dreamweaver : Dreamweaver是美国MACROMEDIA公司开发的集网页制作和管理网站于一身的网页编辑器，它是第一套针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。Dreamweaver是当前主流的站点和网页编辑器，其代码简洁、兼容性和整体功能都很强。Dreamweaver的介入，使得网页一些部分的实现变得更加直观简便。Dreamweaver的主要特点：最佳的制作效率Dreamweaver可以用最快速的方式将Fireworks，FreeHand，或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单，快捷键与格式控制，都只要一个简单步骤便可完成。Dremweaver能与您喜爱的设计工具，如Playback Flash，Shockwave和外挂模组等搭配，不需离开Dremweaver便可完成，整体运用流程自然顺畅。除此之外，只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。网站管理使用网站地图可以快速制作网站雏形，设计，更新和重组网页。改变网页位置或档案名称，Dreamweaver会自动更新所有链接。使用支援文字，HTML码，HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。无可比拟的控制能力Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组，Dreamweaver支援精准定位，利用可轻易转换成表格的图层以拖拉置放的方式进行版面配置。所供即所得Dreamweaver成功整合动态式出版视觉编辑及电子商务功能，提供超强的支援能力给Third-party厂商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango与自行发展的应用软体。当您正使用Dreamweaver在设计动态网页时，所供即所得的功能，让您不需要透过浏览器就能预览网页。梦幻样版和XMLDreamweaver将内容与设计分开，应用于快速网页更新和团队合作网页编辑。建立网页外观的样版，指定可编辑或不可编辑的部分，内容提供者可直接编辑以样式为主的内容，却不会不小心改变既定之样式。您也可以使用样版正确地汇入或输出XML内容。全方位的呈现利用Dreamweaver设计的网页，可以全方位的呈现在任何平台的热门浏览器上。对于cascading style sheets的动态HTML支援和鼠标换图效果，声音和动画的DHTML效果资料库可在Netscape和Microsoft浏览器上执行。使用不同浏览器检示功能，Dreamweaver可以告知您在不同浏览器上执行的成效如何。当有新的浏览器上市时，只要从Dreamweaver的网站下载它的描述档，便可得知详尽的成效报告。2.Photoshop:Adobe photoshop 在绘图、色彩调整等诸多方面有着出色的功能，集成度高、适应面广和操作简便。他不仅提供强大的绘图工具，可以直接绘制艺术图形，还能直接从扫描仪，数码相机等设备中采集图像，并对他们进行编辑、修复、以及调整效果，同时可以改变图像的颜色模式，并能在图像中制作艺术文字等。Photoshop中的高级绘图工具，可自动生成背景纹理、图层效果，多种特殊效果滤镜，可创建多种艺术效果和绚丽的web图形并可直接在photoshop中定义和编辑切片的工具透明控制，包括用于混合到任意背景中的边缘的仿色透明度。强大的彩色校正工具修复画笔，可在消除瑕疵的同时保留色调和纹理图层。Photoshop的强大工具可以使操作者不管制作任何图像都游刃有余。对于设计网页，photoshop是不可或缺的工具，是强大的图片处理工具。3.FlashMX: Macromedia公司出品的Flash是制作网页动画的利器。严格来说， F1ash是网络多媒体制作工具而不是网页编辑工具。F1ash是制作动感网页的权威。对于使用者来说，只需很短时间的学习，就可以用它制作出美观的网页动画。可以让制作者随心所欲地实现各种创意，并且可以和JavaScript一起创作出具有强大交互性的网页动画。 Flash是一种绘制矢量图形和创作互动多媒体动画的软件。它可以用少量的矢量数据就可以描述相当复杂的对象，所以生成的文件尺寸小，便于在网上传输。Flash创建的动画集可以插入到html文档中，也可以单独制作网页。使网页的效果更加完美。八 网页制作的优缺点比较明确，风格统一。并运用了一些其它的设计软件加以辅助设计。使网页更加具有动感，形式丰富。就内容而言，比较丰富。大量运用了图片，并进行了文字说明，做到了图文并茂。但是由于我们刚接触网页制作，做出的效果还是有些稚嫩的，需要以后不断的实践。九 ps页面样式1 首页 2 展示时刻 3 心情日志4 随笔感悟5 温馨相册6 关于我们代码1.页面代码<!-#include file="conn.asp"-><html xmlns="http:/www.w3.org/1999/xhtml"><style type="text/css"><!-#apDiv1 position:absolute;width:46px;height:43px;z-index:1;-></style><head><meta http-equiv="Content-Type" content="text/html; charset=GB2312" /><title>懿jony天空</title><meta name="description" content=""><meta name="keywords" content=""><link href="Css/css.css" rel="stylesheet" type="text/css"><link rel="shortcut icon" href="favicon.ico" ><script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script></head><body><table width="1024" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td width="1024" height="110" valign="bottom" background="Images/in_01.jpg"><div
