基于Dreamweaver的校园网站制作

0南京信息职业技术学院毕业设计论文作者 学号 41321P系部 计算机与软件学院_专业 计算机网络技术_题目 基于 Dreamweaver 的校园网站制作_指导教师 _ 史律_评阅教师_完成时间： 2016 年 4 月 20 日1毕业设计(论文)中文摘要(题目)：基于 Dreamweaver 的校园网站制作摘要：本人的毕业论文主要是使用了 Photoshop、Dreamweaver、DIV+CSS 制作了本网站的界面。论文阐述了我的网站的设计和制作的主要过程，其中包括设计规划、设计准备、设计过程、网站测试四个部分，其中设计规划主要是介绍了本网站的设计方向及目的、设计准备主要介绍设计网站所使用的Photoshop、Dreamweaver、DIV+CSS 三个主要软件、设计过程主要具体介绍了本网站建站具体步骤和设计思路、网站测试主要是介绍了网站制作中一些需要解决的问题。关键词：Dreamweaver 校园网站 div+css2毕业设计(论文)外文摘要Title : The production of campus website based on Dreamweaver Abstract: My graduation project is mainly the use of Photoshop, Dreamweaver, div + CSS created this website interface. Paper describes the main course of my website design and production, including design and planning, preparation design, process design, site testing of four parts, including design and planning of this website is to introduce the design direction and purpose, the design focuses on preparation website design used Photoshop, Dreamweaver, div + CSS three major software design mainly specifically describe the present website design and the specific steps and design ideas, web site testing is to introduce the production of some problems to be solved.keywords: Dreamweaver campus website div+css3目 录1 引 言.52 校园网站设计规划.62.1 校园网站的内容选取.63 网站设计的前期准备.83.1 软件准备.83.2 IIS 7 的安装与设置 .84 校园网站的制作过程.134.1 主页的制作过程.134.2 链接页面的制作.185 网站的测试与上传.205.1 网站的测试.205.2 网站的上传.21结论.22致谢.23参考文献.2441 引 言网站发展到今天，已经出现各种各样形态风格种类，有关于小说、新闻、游戏、微博等等，而制作网站的方法也多种多样，现在，只要愿意甚至你可以为自己做一个个人网站，越来越多的公司通过建设网站的方法来展示自己的公司环境、公司理念，而这些网站也就成为这些公司向外界展示自己的窗口，好的网站表现出一个公司的实力，从而吸引到更多实力强大的人加入到他们公司。而我做这个网站主要是向外界展示我们的学校，让我校的学生能更了解我们的学校，简单的结构，亮丽的风格，是我的网站吸引人的主要方法，丰富多样的内容是制胜的法宝。52 校园网站设计规划2.1 校园网站的内容选取我在制作这个网站时主要考虑了网站的定位，目标用户，网站内容以及网页的版面，因为制作网站前我们就应该明确我们的网站是做给谁看的，放些什么内容给人看，以及网站的样式方不方便让人观看，可以说只要知道这几点，就有人愿意来看你做的这个网站，这也是我们制作网站的核心。就比如我制作的这个网站，我是模仿我们学校的官网制作的，当然由于是个人制作看起来还是很粗超，我的网站定位是门户网站，主要是目标用户是本学校的学生，网页上的内容主要是学校的各类信息。从我的版面上来看我的网站主要分为四个部分：学校介绍主要介绍了我们学校的软硬件环境，学校新闻也就是学校一些比较大的活动，学校通告是关于学校发布的一些通知，最后是大学生活主要是关于我们大学生活中发生的一些事。其实，大部分网站都是这样，介绍公司文化理念，公司活动，公司安排等，这也是大部分公司向外界展示自己的窗口。网站要求不同则展示的方式也不同，一个小说网站和一个新闻网站，无论是从建站的目的，或者说网站内容都大不一样，小说网站主要是面向广大读者，越丰富种类越齐全那么吸引的人就越多，可新闻网站更加注重新闻的时效性，要是新闻网站上挂的最新一条新闻都是好几天前的，你说这样的网站还能吸引人吗？，所以作为模仿学校官网的网站，我主要选取的内容是和我们的大学生活息息相关的而且对于我的网站的浏览者我很明确，就是学校的学生群体，所以我最要的内容就是关于我们的大学生活，比如学校最近举办了什么活动，有什么重要的通知，发生了什么有趣的事，这都是我们大学生所关注的。而且网站的结构和风格也能反映一个网站的特色，一个好的网站，网站结构和风格足够吸引人，将会给这个网站加分不少，就比如我的网站结构简单，颜色亮丽，背景色主要是蓝色，而之所以这样设计是因为我们的对象是大学生，要是结构复杂，好几十个板块，那我们还有耐心看下去吗？或者网站的背景色是黑色，让人看起来就死气沉沉，同样没有大学生愿意看。6所以说鲜明的结构独特的风格起的是画龙点睛的作用，要是一个网站内容再丰富，结构不够鲜明，风格不够独特，那也是毫无价值的。所以设计网站前我们需要考虑多方面的因素，千万不能想到什么做什么，这样做出来的网站是无法长时间吸引人的。图 2.1 网站主页如图 2.1 所示，我的这个网站的结构主要由学校简介、南信新闻、学校展示等几大部分组成。这些部分组成了我的整个网站的结构，使得整个站点不会因为内容过多而显得杂乱无章。73 网站设计的前期准备3.1 软件准备制作网页的方式多种多样，也从来没人说过我们一定要拘泥于哪一种，对于我们这些初学者来说，最简单的、最方便的才是最适合我们的。网页制作中最出名的莫过于 Dreamweaver 和 Frontpage 这两款软件，我可以说只要是制作网页的人就没有不知道这两款软件的。我这里使用的是 Dreamweaver，我也向那些新手推荐这款软件，因为它真的很简单。还有和它同公司的另外两款软件 Fireworks 和 flash，他们并称Macromedia 公司的网页制作 “三剑客”，另外两款软件对我们制作更绚丽的网页有很大帮助。Dreamweaver 是由美国 Macromedia 公司推出的一个 “所见即所得”的可视化网站开发制作工具。 Fireworks 则被称为 Macromedia 公司网页设计“三剑客”之“火焰”，它最擅长处理网页图片，可以用来制作 GIF 动画。 Flash 则被称作 Macromedia 公司网页三剑客之中的“闪电”，它最擅长制作作网上动画为特长，可以用来做动画 小游戏。Dreamweaver 采用“所见即所得”的设计模式，你所制作出来是什么效果，展示出来就是什么效果。不用去考虑其他制作上的问题。它将网页设计中的实现与设计两个部分分离开来，这样我们的设计人员就可以将更多的精力放在设计页面上而不是花太多的时间来考虑如何将我们的网页实现，因为实现的部分将由软件来替我们完成，是不是很方便。在我设计我的个人网站的过程中，我选择了 Dreamweaver 8 和 Photoshop 两种软件。Photoshop 我在学校选修课学过，这个软件主要是负责用来帮我处理图片，对我来说，相对于其它的软件来说，这两个我还算是比较熟悉的。 3.2 IIS 7 的安装与设置在众多的基于浏览的开发方案中，微软的 IIS 是作为客户端与服务器端之间连接的8桥梁。当有人想要浏览你的网页时，在地址栏输入你网站的地址，这时请求将会从你的浏览器发送给服务器端，然后服务器端将你的请求交给 IIS 处理，然后 IIS 将检索你访问的页面，并通过你所请求的文件名对该网页进行处理，加入页面是以 HTML 为扩展名又或者页面是另外的格式，IIS 再对网页上的代码进行处理。IIS 是微软专为 Windows 系统设计的 WEB 服务器软件。 Windows 7 在安装系统时，就已经自带 IIS 7；但 Windows 7 不会主动安装它。下面就我就介绍一下在我制作网站过程中在 Windows 7 上安装 IIS 7 的过程。步骤 1 在 windows7 桌面上的左下角，点击“开始”，找到“控制面板”，并点击进去。步骤 2 进入控制面板后，首先将“查看方式”选择为“类别”,以缩小图标查找的范围，然后点击“程序”。步骤 3 进入“程序”显示页面后，找到“程序和功能”一栏，点击“打开或关闭 Windows 功能 ”。打开的界面如图 3.1 所示图 3.1 window 功能 图 3.2 添加 IIS 服务步骤 4 进入到“打开或关闭 Windows 功能”页面后，找到“Internet 信息服务”一栏，可以看到其前面的勾未勾上。单击“Internet 信息服务”前面的“加号”将目录全部展开，然后将 FTP、服务器、 web 管理工具、万维网服务目录下的所有选项进行勾选，最后点击“确定”按钮即可。如图 3.2 所示。步骤 5 IIS 7 功能打开完毕后，可以在开始-程序搜索框里面输入”IIS 7“,找到Internet 信息服务管理器，并打开，打开之后就可以进行 IIS 7 的一些配置，发布 html9网站了。当然我们也可以设置我们默认站点及主页，修改过程如下：步骤 6 打开“IIS”，弹出一个界面如图 3.3 所示。图 3.3 IIS 管理器步骤 7 右键单击“网站”按钮，在右键菜单里面选择“添加”选项，然后打开添加网