网页设计报告

目目 录录 一 设计题目 1 二 设计性质 目的和任务 1 1 设计性质 1 2 设计目的和任务 1 三 设计内容 2 四 设计说明 3 一 网站标题的创意和设计 4 二 站标的创意和设计 4 三 栏目的创意和设计 5 四 网页的设计 6 1 毛遂自荐 二级页 6 2 天真烂漫 二级页 7 1 如梦年华 三级页 8 2 在水一方 三级页 9 3 朝气蓬勃 二级页 11 4 菁色岁月 二级页 12 1 书声琅琅 三级页 13 2 同舟共济 三级页 14 5 斗志昂扬 二级页 15 五 设计总结 17 辽源职业技术学院课程设计用纸 1 NO 一 一 设计题设计题目目 白驹过隙 岁月静好 二 二 设计设计性性质质 目的和任 目的和任务务 1 设计设计性性质质 本课程设计是学生在学习网页设计软件 Dreaweaver 和 Flash 动画设计 课程后的实践性很强的专业课课程设计 是对所学 Dreaweaver 和 Flash 知识 的综合运用 为培养职业核心能力与素质奠定基础 在专业人才培养方案中 起重要作用 2 设计设计目的和任目的和任务务 一 内容 综合利用 Dreamweaver 和 Flash 设计制作一个网站 设计题目 在线购物网站或个人网站 任选其一 具体名称和栏目自定 二 要求 1 网站和素材制作要有自己的创意 2 通过设计熟练掌握网页设计和 Flash 素材制作的基本流程和各种常用 工具的使用方法和技巧 3 Dreamweaver 的内容要求 有图文的混合排版 要有自己设计的图像素材 可是静态或 Flash 动 画 要有自己设计的站标 静态或 Flash 动画任选 网页要求体现不同布局 表格布局 层布局 框架布局 要有 CSS 样式 模板和库的使用 要有鼠标经过图像 制作弹出信息对话框 辽源职业技术学院课程设计用纸 2 NO 随主页弹出的广告窗口 要有项目列表或编号列表 多种超链接的设置 有插入的声音文件或背景音乐 4 Flash 的内容要求 熟练掌握 Flash 的基本操作方法 设计网站的 Flash 标题文字动画 或 Flash 的 TOP 文件 做到动画 新颖且与主题风格一致 根据网站风格 内容的需要制作相应的动画广告或其它动画素材 要有形状补间动画 运动补间动画 蒙版动画 动画中可根据需要加入声音 或音乐 注意 以上要求为设计的基本要求 各项均是必须有的 缺少某项将影响 成绩 三 三 设计设计内容内容 网站类型 个人网站 网站结构 辽源职业技术学院课程设计用纸 3 NO 我 我制作的是个人网站 这个网站介绍的是我的成长过程 主要 包括我的家乡 个人信息 以及同窗好友的友情和到现在的大学生活的感悟 四 四 设计说设计说明明 进入网站 映入眼联的是 白驹过隙 岁月静好 的一种时光的沉淀 舞 动的蝴蝶 伴随着音乐的旋律蝴蝶轻轻的挥舞着翅膀 整个网页给人一种心 辽源职业技术学院课程设计用纸 4 NO 灵得到放松 精神得到舒缓的感觉 背景采用淡雅的颜色 突出了温情 使色 彩显得更加的协调 因为蝴蝶以其身美 形美 色美 情美被人们欣赏 历代咏诵 蝴蝶是最 美丽的昆虫 被人们誉为 会飞的花朵 是一种高雅的象征 可以令人体会 到回归大自然的赏心悦目 所以我采用了 Flash 做出蝴蝶翩翩起舞的效果 与主题的 白驹过隙 岁月静好 相结合 使主题更加的鲜明 一 网站 一 网站标题标题的的创创意和意和设计设计 辽源职业技术学院课程设计用纸 5 NO 网站标题构思 以 白驹过隙 岁月静好 为中心来讲述从童年 少年到青 年的成长过程等一系列的回忆碎片 表达对未来的憧憬 通过学习过的 Photoshop 对文字进行变形和修饰 达到自己想要的这种 炫彩效果 突显出一种与众不同的岁月感 二 站 二 站标标的的创创意和意和设计设计 站标构思 伴随着时光飞快的流逝 人生有各种不同的经历 而能体现时 光流逝的最好象征就是风 就像一匹白驹奔跑时带动的风 风可以轻柔 可 以平静 亦可以怒吼 就像我们伴随着时光的流逝慢慢成长经历情感的过程 而我们则是其中的主角 以自我为中心体验独无二的的生活 每个人都有自 己的任知和对生活的感触 我很平凡 但是却依旧有属于自己的成长 无论 开心与否 都是对自己足迹的一种见证 世界很大 属于我们的并不多 可是 生活是一种态度 我乐与在自己所拥有的天地中尽情享受时光带来的酸甜苦 辣 为了与标题 白驹过隙 岁月静好 相呼应 通过 Photoshop 把所需要的文 字和英文进行输入和对字体的变换 然后一系列的工具完成所需要的文字效 果 三 三 栏栏目的目的创创意和意和设计设计 网站导航 我用 Photoshop 输入的文字 然后经过字体变换 颜色搭配 最后通过特效描边进行最后的加工 形成了导航的最终样式 虽然导航字体 没有经过太多的加工和修饰 但是却与网站的页面整体相互辉映 给人一种 很协调的画面感 辽源职业技术学院课程设计用纸 6 NO 网站包括五个栏目 分别是 毛遂自荐 这个页面介绍的是我自己的个人信息 毛遂自荐是形容一个 人自告奋勇 善于介绍自己 所以我用这个成语作为这一页的标题 天真烂漫 这个页面介绍的是孩童时代 它有两个下级页面 分别是 如 梦年华 和 在水一方 天真烂漫是形容儿童心地单纯善良 坦率自然 所以 我用这个成语作为这一页的标题 朝气蓬勃 这页介绍的是少年时代 青涩而又腼腆 菁色岁月 这个页面介绍的是学生时代 它有两个下级页面 分别是 书 声琅琅 和 同舟共济 菁代表的是华丽 精华 事物最纯粹 最美好的部分 而我们的学生时代则是我们记忆中最美好的一部分 所以我用菁色岁月作为 这一页的标题 斗志昂扬 这个页面介绍的是大学时代 大学时代的我们意气风发 像一 只雄鹰欲展翅翱翔于蓝天 于是我用了斗志昂扬这个有代表性的成语当做该 页面的标题 表达了对未来最美好的憧憬 辽源职业技术学院课程设计用纸 7 NO 四 网 四 网页页的的设计设计 1 毛遂自荐 二 毛遂自荐 二级页级页 背景采用海滩 贝壳 和书本相结合 常年的海浪将沙粒冲刷成平整细 腻的肌肤 平整有序 自然恬静 沙粒虽然微小 但是平凡之中却彰显出一份 坚韧 微小的沙粒仿佛诉说着美好固然存在 可却需要千百个日日夜夜的不 断冲刷才能破茧成蝶 绽放光芒 辽源职业技术学院课程设计用纸 8 NO 背景上放着一张书的图片 书代表知识的财富 人类进步的阶梯 书 中自有黄金屋 书中自有颜如玉 我们在书中成长 增长见识 我的灵感就 是从中而来 在书本上用书写文字的方式记录了我的个人信息 通过 Photoshop 对文字进行修改 书本形式的文字与自然恬静的海滩贝壳巧妙结 合 使之形成一种充满书卷气息的氛围 2 天真 天真烂烂漫 二漫 二级页级页 就像标题说的一样 天真烂漫 用 Flash 动画展示了孩童时代最美的 瞬间 绿色是自然界中常见的颜色 它既不是冷色 也不是暖色 代表着清新 希望 平静和舒适之感 因此在梦幻般气泡的背景图片搭配 flash 枫叶动画动 静结合 很自然的与标题 天真烂漫 关联到了一起 气泡在阳光下散发出彩 虹般的微笑 气泡虽然是瞬间的美丽 却也是永恒的刹那 而枫叶的轻轻飘 舞也体现了对儿时的怀念与向往 辽源职业技术学院课程设计用纸 9 NO 梦幻般的文字 采用绿色字体与背景相结合通过鼠标经过图像的修饰后 别有一番趣味 众所周知 童年是大多数人一生中最美的时光 可当我们长 大之后才发觉童年的美好 因此 童年对我们来说是一段如梦一般的年华 在水一方 这次我引用了 诗经 蒹葭 的一句诗 所谓伊人 在水一方 古 人用这句诗表达了对伊人的深刻思念 而我则借古人的感情抒发了对家乡的 热爱和思念之情 所以 如梦年华 和 在水一方 理所当然的被我用为了这一 页的标题 返回主页的标志则是采用了英文与形状的搭配 也做成了绿色 意在与背景相结合 1 如梦年 如梦年华华 三 三级页级页 这一页的背景依旧延续 天真烂漫 的气泡风格 不过确是粉色系调的泡 泡作为背景 因为粉色象征着清纯 美好 给人一种淡雅脱俗的美感 梦之所 以被称之为梦 是因为它不可触碰却又真是的存在 所以气泡无疑是对如梦 幻般年华的最好诠释 辽源职业技术学院课程设计用纸 10 NO 世间有许多微笑 有蒙娜丽莎动人的微笑 有父母那亲切地微笑 而最 能打动每个人心灵深处却是孩子们发自内心的微笑 我们可以拒绝平庸 可 以拒绝风雨 但我们却无法拒绝孩子们那一朵朵发自内心深处的微笑 我希 望孩子的微笑可以散播在世间的每一个角落 所以我只用了这一幅插图和一 段描述孩子内心世界的文章作为这一页的主要内容 使图片和文学综合起来 更加的生动形象 2 在水一方 三 在水一方 三级页级页 在水一方 这一页我介绍的是我的家乡东北 采用了朝阳初升的海边沙滩作 辽源职业技术学院课程设计用纸 11 NO 为背景 晴空万里的天气会令人的情绪在无形之中达到最好的状态 图片则 是选择了三张具有代表性的碧草蓝天 白雪皑皑和美食 然后搭配了一段对 家乡赞美的文章 天苍苍 野茫茫 风吹草地见牛羊 晴朗湛蓝的天空 像碧玉一样澄澈 房屋错落有序的格调与这碧草蓝天相连接 绿树成荫仰望蓝天 那些变幻莫 测的云 或流动 或停驻 有意无意地为蓝天添了装饰 在这样的时刻 除了 纯净和安祥 你几乎再找不到合适的词语来描绘 辽源职业技术学院课程设计用纸 12 NO 雪后的景象 银白覆满大地 天地连成一线 模糊了边界 模糊了天地 只有那一串脚印 如细碎的花 缀在地的一角 成为静谧的注释 整个村子好 像变成了一个粉妆玉砌 充满了诗情画意的童话世界 美食不仅仅是简单地味觉感受 更是一种精神享受 所以我用了一段描 写家乡的文字和东北特有的美食 使之更加凸显 在水一方 这一页面对家乡 的诠释 3 朝气蓬勃 二 朝气蓬勃 二级页级页 这个页面我没有太多的描述 而是会采用了窗口弹出的方式显示为 对 不起 该网站正在建设中 辽源职业技术学院课程设计用纸 13 NO 4 菁色 菁色岁岁月 二月 二级页级页 这个页面我用了沙滩作为背景 沙滩上的沙粒在日日夜夜海水的冲刷 下 不断的磨砺着自身 一颗沙粒也许不算什么 可是数以万计的沙粒聚在 一起却能绽放出奇异的光芒 而沙粒也代表了学生时代的我们 每天通过学 习知识充实自身 而那些年我们也在同窗好友的陪伴下一起度过那段快乐的 时光 辽源职业技术学院课程设计用纸 14 NO 这个页面我运用了广告弹出窗口 窗口里的背景是一个小纸人难过的 表情 更形象的表达出网络出错的难过之情 也为这个弹出窗口增加了一丝 趣味 而文字则是自己通过 Photoshop 实现的特效文字 使之与背景相互结 合 1 书书声琅琅 三声琅琅 三级页级页 书声琅琅 这个页面我想表达的是高中生活 所以主题是我的高中学校 背景则是采用了一片绿油油的田野 而田野中的乡间小路则是代表着希望 恢弘大气的校园一角和诙谐有趣的师生趣事与背景相得益彰 映入眼帘的学校和课间体操 师生之间的欢乐 无一不在体现着学生时 代的学习氛围 辽源职业技术学院课程设计用纸 15 NO 2 同舟共 同舟共济济 三 三级页级页 这一页的背景我采用的是天蓝色的海面 海面上漂着一艘小船 有几只 海鸥在自由的飞翔 而我们的成长岁月就像这海鸥一样 迎着风浪翱翔的同 时 身边一定有朋友和你风雨不误 同舟共济 正是那看不见摸不到却无比 珍贵的友情支持着我们奋不顾身的前行着 我在 同舟共济 这个页面还用了几幅图片和文字的描述 诙谐而又唯美 的图片与背景相互协调 令人看对友情的珍贵更加的珍惜 辽源职业技术学院课程设计用纸 16 NO 5 斗志昂 斗志昂扬扬 二 二级页级页 这一页我想表达的是对大学生活和未来的勇往直前 我特别喜欢蓝色 蓝色代表沉稳干净 而主题是一种斗志昂扬的精神 所以选用海边朝阳初升 作为背景 我们则是八九点的太阳 迎接未来 成语斗志昂扬的意思是情绪 高涨 斗争的意志旺盛 因此我采用斗志昂扬作为这一页的标题 辽源职业技术学院课程设计用纸 17 NO 除了背景与图片的搭配 我还运用了文字的一些特效和鼠标经过图像 的功能 乘风破浪的勇气和斗志昂扬的精神正是我们大学生所需要的特质去 迎接未来出现在我们生活中的挑战 这个区域用了一段优美的文章 让你欣赏页面的同时扩展阅历 增强学 习的乐趣 辽源职业技术学院课程设计用纸 18 NO 五 五 设计总结设计总结 两周的实训时间说长不长 说短不短 但从中我学到了很多知识 更加 巩固了 Dreamweaver 和 flash 中基本工具的使用和制作网页所要考虑的一系 列问题 受益匪浅 这次实训让我明白制作网页应该先定位网页的方向 确定网站的标题 标题在个人主页中起了很重要的作用 他很大部分的决定了你整套个人主页 的定位是否正确 一个好的名字必须有概括性的 简短的 有特色的 容易记 得还要符合自己主页的主题和风格 选好标题后 开始采集内容 内容必须 紧随着标题 在采集内容过程中 很重要的一个 特 色 个人主页中的特色 应该突出自己独特的个性 把自己的兴趣 爱好尽情的发挥 在制作网页过程中 需要配合 flash 动画的适时加入 更要明白做此类动 画所