网页设计与制作
---个人网站设计报告
指导老师：盛加林
学号：20082809
姓名：杜才伟
班级：信管0802
概述
随着网络技术的迅速发展，网络应用越来越趋于平凡化，无论是企业还是其他组织机构或者是个人，都希望利用计算机网络技术开发对自己有价值的东西。关于个人网站，现在越来越多的人通过个人网站记录自己的故事，与朋友分享生活的点滴，同时还可以通过个人网站广交朋友。
本次的个人网站设计是网页设计与制作的期末检测，同时也是对自己学台是windows，运用的工具是Macromedia Dreamweaver 8，主要语言是html语言和javascript，样式设计采用的是css样式。
在个人网站的设计中，我采用了通常iframe网页框架，风格源于自己浏览其他网站的灵感，网页flash的设计借鉴了网上优秀flash动画，首页还采用了网页音乐播放器控件。照片的处理用到了photoshop和Macromedia Fireworks 8。
设计结构图
设计主题
岁月如梭，年华似水。默默流逝的青春给我们每个人留下了不同的回忆，我的个人空间的设计主要是记录大学生活。有学校的剪影，有寝室的合影……每一张记录都是未来的我最美好的回忆。
设计的主要以怀念为主题。曾经的那些花儿，曾经的那些故事都是生命里美的转弯。
模块介绍
（一）、首页介绍
首页是个人网站的入口，大概的设计框架是头是一个部分、头以下分为左右两个部分。
头部如下图：
导航条：
导航条主要是“我们的故事”、“相册”、“关于我”三个模块的超链接点击三个连接即可跳转到不同页面。
头部以下部分：
这部分的设计主要有图片处理、文字从下往上滚动、音乐播放器、时钟的设计、flash设计
(二)、我们的故事
我们的故事主要是文字描述，整体样式如下：
这个部分主要是记录一些故事，每一段故事中都会存在一些悲伤的插曲，背景漂浮的flash动画加上背景音乐，还有略带伤感的文字，整体呈现淡淡的伤感而又不失积极向上。
(三)、相册
相册主要是展示大学四年中的记录，有关于学校的，有我们寝室的，有自己的：整天样式如下图：
相册页面上面是大学里照片的轮换，中间是自己处理后的照片，下面是文字大概描述照片的故事：
(四)、关于我
主要设计
(一)、首页主体框架
<body onLoad="InitialiseAutoScrollArea();">
<EMBED style="POSITION: absolute; WIDTH: 980px; HEIGHT: 541px; TOP: 1px; LEFT: 1px" height=541 type=application/x-shockwave-flash align=right width=967 src= quality="high" wmode="transparent">
<center>
<div class="body">
<div class="top">
<img src="../image/" width="980px;" height="130px;" />
</div>
<div class="daohang">
<div class="gongneng">
<a href="">我们的故事</a> |
<a href="">相片采集</a> |
<a href="">关于我</a>
</div>
</div>
<div class="c1">
<div style="margin-left:0px;margin-top:-10px;width:250px;">
<img src="../image/"/>
</div>
<div style="width:300px;height:200px; float:left;margin-left:280px;margin-top:20px;background-color: #CCCCCC">
<iframe src="../music/" frameborder="0" height="220px" width="310px;"></iframe>
网页设计与制作期末设计报告 来自淘豆网m.daumloan.com转载请标明出处.
