网页艺术设计课程设计报告书

《网页艺术设计课程设计报告书》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、网页设计课程设计计算机科学系课程设计报告书课程名称：　　　网页艺术设计　　课程设计题目：　　　爱心希望小学网站　　14网页设计课程设计一、课程设计目的：《网页设计与制作课程设计》是在我们学习《网页设计与制作》课程后，结合HTML语言、Photoshop图像处理、Flash动画制作以及Dreamwaver网页制作等进行的实践性教学，通过课程设计，可以帮助我们巩固所学的知识，加强HTML语言的基本概念和网页的设计与实现，还可以让我们对布局、表格、以及APDIV的使用。从而进一步提高我们的网页设计与制作能力，熟悉图像的

2、处理、动画制作的设计和实现，为以后的课设的学习和实践打下了基础。二、课程设计内容此网站主要体现希望网站的特色，网站的网名为：“爱心希望小学”主要体现小学的特色，颜色以绿色为背景，象征着朝气蓬勃，健康快乐的孩子，网站的设计主要以有文字，图片。以及Flash动画相结合，使网站更加的大方、协调。整个网站的模块分为：“学校首页”、“学校概况”“校园动态”、“师生互动”、“教学教研”、“后勤情况”、“教学课程”、“学生报刊”、“学生园地”从而是整个网站更加的合理和美观！更能体现出希望小学的特色。三、网站的艺术设计及特色1.

3、该网站主要以两大板块构成，上部分为校园动态和校园活动相结合，体现出校园的特色。第二个板块主要以教务公开和经验交流为主题。在两个板块之间插入一个flash动画使其不矢单调，能为整体的网站增加大方美观的效果。2.学校的logo设计以爱心为主，两个人用手围成一个爱心，颜色为主要以白和黄色为主，象征着孩子们的纯真的笑脸和纯洁的心灵。更能为主题增添色彩力和感染力。3.网站主要采用绿色布局，更能体现出孩子们朝气蓬勃向上的一面，并用常用的宋体字，使网站看起来比较正规。4.网站插入的flash动画中跳动的字分别以红色和绿色为其校

4、训，目的是让孩子们善于思考，善于动脑，开发他们的想象力，让他们更加的优秀，坚持不懈的精神。更加的努力和做一个诚实的孩子，让他们不仅在学习上优秀，在做人这方面更加的优秀！四、网站结构和整体布局1、网站结构图14网页设计课程设计BannerFlash动画Logo学校首页浏览者学校概况校园动态教学教研页面排版后勤情况教学课程学校报刊学生园地2、页面布局图LogoBanner导航条网页内容（各子页内容）14网页设计课程设计页面布局图3、网站文件夹目录网站的文件夹目录五、主页制作步骤1.新建HTML网页，命名为“index

5、”并打开14网页设计课程设计2.打开常用工具栏，选择“表格”对话框，在表格大小中选择行数为15，列数为1，表格宽度为800Px,边框粗细为0像素，单元格边距为0，单元格间距为0。3.选择表格对话框，绘制宽和高分别为：800x100的像素，选择插入—flash，在flash文件夹中找到“Banner”文件，如图:14网页设计课程设计4.在在表格中，输入“学校首页”、“学校概况”、“校园动态”、“师生互动”“教学教研”、“后勤情况”、“教学课程”、“学校报刊 ”、“学生园地”。分别设置链接颜色，变换图像链接、已访问后

6、的链接。如图所示：5.在公告栏的右边设置一个宽和高分别为：320x350px，选择插入--媒体—图像查看器，在对话框中保存该文件，在右面flash元素中进行相关设置，插入图片。6.紧接着在后面绘制一个校园新闻，宽和高分别为：248x350px，如图：14网页设计课程设计5.再在下面插入一个Flash动画，绘制宽和高分别为：800x100px，在插入—Flash，打开Flash文件夹下所在的位置，然后选择“flash1”（选择导出的文件，后缀名为：Swf的类型的），如图：6.下一步在下面绘制三个分别为“政务公开”、

7、“经验交流”、“平安校园”三个框架。7.下一步就是绘制一个用户名注册登陆界面，然后再在后面绘制一个滚动的图片，紧接着就是友情链接及版权商标等，对它们进行链接即可！14网页设计课程设计六、子页制作步骤一、学校首页1.新建xxgk页面，利用表格分别插入Banner和导航条，在绘制一个宽和高分别为：800x400px，插入背景，然后把对应的文字输入进去，然后选中学校首页，将其链接到新建的xxgk的页面中即可，并对其保存运行，运行后的界面如图：二、校园动态1.新建一个xydt的页面，利用表格分别插入导航条和Banner，

8、在绘制一个宽和高：800x400px，插入背景，然后把对应的文字输入进去，再选中校园动态，将其链接到新建的xydt的页面中，对其保存bong运行，其结果如图所示：14网页设计课程设计三、师生互动1.同理依次重复上面的步骤，新建一个新的页面为ssdt，然后插入相应的背景图，并将其相应的文字输入进去，然后选中师生互动，将其链接到新的ssdtd的页面，保存并运行，其结果为：14