[网页设计]课程设计报告书

信息工程学院

《网页设计与制作》

课程设计报告书

指导教师： 汪强 专业班级： 11软件2班 姓 名： 苏 强 学 号： 1132104218 日 期： 2012年 6月 4日 — 2012年 6月 10日

一、设计目的

《网页设计与制作课程设计》是在学生学习《网页设计与制作》课程后，结合HTML语言、Photoshop图像处理、Flash动画制作及Dreamweaver网页制作等进行的实践性教学环节。通过课程设计，帮助学生巩固所学知识，强化HTML语言的基本概念及HTML网页的设计与实现，提高网页设计与制作的能力，熟悉图像处理、动画制作的设计与实现，为后续课程的学习和实践打下一定基础。 二、设计任务

1、设计题目：利用所学知识，制作个人Blog网站。 2、学生设计的内容与要求：

（1）以学习小组（2至3人左右为一组）为单位，查阅相关资料，共同探讨，相互交流，互帮互助，完成一个高质量的设计作品。

（2）网站不少于5个子网页，各网页具体内容为：“基站导航”主页、“个人简介”子页、“心情日志”子页、“作品展示”子页、“联系留言”子页； （3）“基站导航”主页界面美观，必须要有图片、flash等内容（且其中1个图片或flash必须含有“11软件1/2班”Loge设计或个人艺术签名设计），各导航条链接正确；

（4）“个人简介”子页界面美观，用表格或框架搭建页面布局；

（5）“心情日志”子页界面美观，要求心情日志内容不少于3篇，页面中设计锚点链接；

（6）“作品展示”子页界面美观，图片或flash必须为个人原创作品，数量不少于4件；

（7）“联系留言”子页界面美观，用表单设计页面。 3、设计报告的内容和要求

设计报告的内容应包括基于“个人Blog”的构成与实现方案，并提交作品成果。

三、设计内容（不少于8页）

1.个人Blog网站框架构成及综述

我的个人Blog网站是由一个主页和4个子页构成。主页是《博客》，子页是《个人简介》，《心情日志》，《作品展示》和《联系留言》。 2.各网页设计分析与说明（图、表及文字说明）

根据老师的要求，我是和赵玉祥一组的，所以我们使用的模块都是一样的。

个人主页篇：

首先讲解的是“个人主页”，在个人主页上首先使用Photoshop 制作了我们班级的Logo。

接下来的是一个个人博客的标题图标。

貌似有些卖萌。

再看下Logo和标题图的总体效果吧。

总体来看，颜色搭配的不是很好看，冲击感太强了。所以不是太满意。

自然，每个网页都有一个导航条，我的网页也不例外。

在网页中，我特地的开辟了一个版块，加入了滚动字，是我自己写的，想给全班同学看的一句话，我希望我们班的明天会更好。

在博客网页的，左下角。写了一句名言警句，摘自于互联网，先看下效果吧。

在博客网页的正中位置，我希望凸显出一些我自己的个性化的东西，于是乎就想到了前几年发布在

优酷网上的个人视频。

以上是我博客主页的一些主要内容，做的不好，请多多包涵。谢谢！

个人简介篇:

个人见解的页面，主体上和博客首页是一样的，只是稍微改了一点。

唯一改变的是，将个人的视频换成了个人的一些简介。

在网页中我配备了一首背景音乐

这首歌我觉得动感，符合我的个性，所以在个人网页中以这首歌为背景音乐。

心情日志篇：

在一个博客中个人的一些博文肯定是少不了的，在此就借取了网上的一些精彩文章。为了方便读者的阅读，就在顶部设置了一些锚点，极大的方便了读者的阅读。

以下是一些正文，我们一起欣赏一下。

①

②

③

以上是，我从互联网上的转载的一些的精美文章，这既是我的

作品展示篇：

根据老师上课所说的一些，PS、Flash的一些技法，我也慢慢的模仿了一些作品，也只

是粗糙的模仿，希望多多包涵。呵呵呵。以下是一些我的作品。

这是模仿老师上课时的直升机动画。（只改变了飞机的行动路线）

这个作品纯属是copy老师的作品，只是在原有基础上稍加改动了一些。

对于一些老师教给我们的技法来看，我觉得，学这些技术型的学科，必须有一个良好的积极动手以及勤记笔记的习惯，因为技法太多，学得多了就忘了前面的，所以好记性不如烂笔头，技术的东西一定要多练，才能熟练，才能做到游刃有余。

留言板篇：

作为一个博客，得有一个和浏览网页者的一个互动与交流，所以留言板就孕育而生了。

我的留言板网页做的很简单，也是和主页格式差不多，只有些许变化。

这是留言板页面的主要部分，主要运用到Dreamweaver中的文本域，和表单，按钮，等一些操作。技法简单，但是很实用。

以上就是我的整个博客所有网页的一些概况了，做的不好，还请多多包涵。

4.设计心得与体会

通过这一次的《网页设计》作业来说，我收获真的很大，不仅让我认识到

我现在的知识的局限性和有界性，更让我意识到了紧迫感，因为我们到现在学的只是一些皮毛而已，却让我们操作的如此费劲，那么在以后的社会上，一个弱肉强食，适者生存的社会，我们该如何去面对？？？所以说这次的作业不仅是在教育课程上给了我很大的教育外，也在面对以后的社会思想上给了我很大的警示。 这次的作业也给了我些许的安慰，因为我毕竟做出来了，不管做得怎么样，美观不美观，我最起码是做出来了，《Photoshop》、《Dreamweaver》、《Flash》，这些制作软件的三剑客，我还是会那么一点的，呵呵呵，也不白费我的老师交给我们的知识，难道不是吗？谢谢汪强老师！

以上是我的一些个人心得，说得不好，请多包涵。