《网页设计与制作》

大作业报告

学院:**学院

姓名:

学号:

专业:

摘要:宫崎骏(Miyazaki Hayao,1941年1月5日-),日本知名动画导演、动画师及漫画家, 出生于东京都文京区,1963年进入东映动画公司,1985年与高烟勋共同创立古卜力工作案,其出品的动漫电影以精湛的技术、动人的故事和温暖的风格在世界动漫界独树一帜,能与美国迪士尼、 梦工厂的作品相比肩,受到全世界不分种族、不分国籍、不分文化的各类观众的一致好评。其动国作品大多涉及人类与自然之间的关系、和平主义及女权运动。宫崎骏在日本动画界占有超重里级 的地位,更在全球动画界具有无可替代的地位,迪士尼称他为“动画界的黑泽明,《时代周刊》评价他为全球最具影响力的人物。

下面是我对web简单的一个应用,利用dreamwave工具,和photoshop软件设计了一个具有个人风格的个人网站,首先我先从网站设计的方向和目的、网站设计中涉及的知识点、网站设计的整个流程出发,然后通过自己设计的这个个人网站作品来说明并演示一个完整的网站制作过程。本论文详细的介绍了整个网站设计的全过程。虽然还有一些不足之处,但页面整体比较美观大方,具有线上店铺风格,效果良好。

设计主要包括以下几个版块:

1.人物介绍板块

2.采访视频板块

3.手稿欣赏板块

4.主要作品模块

网站规划思想

宫崎骏(Miyazaki Hayao,1941年1月5日-),日本知名动画导演、动画师及漫画家, 出生于东京都文京区,1963年进入东映动画公司,1985年与高烟勋共同创立古卜力工作案,其出品的动漫电影以精湛的技术、动人的故事和温暖的风格在世界动漫界独树一帜,能与美国迪士尼、 梦工厂的作品相比肩,受到全世界不分种族、不分国籍、不分文化的各类观众的一致好评。其动国作品大多涉及人类与自然之间的关系、和平主义及女权运动。宫崎骏在日本动画界占有超重里级 的地位,更在全球动画界具有无可替代的地位,迪士尼称他为“动画界的黑泽明,《时代周刊》评价他为全球最具影响力的人物。

作为宫崎骏的动画迷,我结合课上所需的HTML网页知识设计一个介绍宫崎骏的网页,包含图文、视频等多种素材可以选择。

网站的目录结构如下:

css ------存放CSS文件

imgs ------存放图片文件

js -------存放js文件

index.html -----------人物介绍页面

yinyue.html -----------采访视频页面

shougao.html ---------手稿欣赏页面

liuyan.html---------主要作品页面

综合知识的运用情况

  1. 层的使用:在这次网页设计过程中,使用了大量表格网格布局,便于有规则得排列尺寸相近的图片

2、使用链接:为方便读者的查阅,在各页面nav导航栏都设置了页面链接。

3、插入跳转菜单为了使读者能快捷的回到自己感兴趣的页面,于是在各个页面都插入了跳转菜单。

网页中涉及的知识点

1、可视化网站设计制作软件dreamweaver的熟练使用,站点的创建、导入以及管理;

  2、主页的创建和设置,模块的保存与应用和子网页的创建、完成;

  3、用photoshop软件对图片素材进行必要的处理;

  4、网站整体布局和超链接的添加;

遇到的问题及解决办法

难点:

1.body背景图片显示问题

2.页面美观度不够高,Dreamewver CS6软件应用不够熟练,软件中所涉及得制作方法以及工具没有更好的应用。

解决办法:

1.配色原则:避免网页杂、乱,有时候单一色彩不为也是一种独特,用色柔和,减少视觉混乱,对比度强的色彩不能应用于一般网站。

2.字体问题:字体是整个网页最醒目的部分,若字体不协调会给人一种枯燥的感觉,避免用杂色字体,防止浏览者眼花缭乱。

3.制作习惯:制作一个网页首要的是完美的构思,应该先构思好再动手制作,素材搜集完整,根据主题选材,不能脱离主题,确保所用材料与主题相关。

4.完整性:网站的基本格式完整,相关链接,友情链接必不可少,这也增加了网页的方便性

5.合适选取适当尺寸的背景图片非常重要

网页截图

首页(index.html):使用了 <header><nav><footer>HTML5结构标签,对宫崎骏的事迹进行了高度概括。

头部:(一个顶部图片和nav导航)

中间:

尾部:

2 采访视频:使用video标签嵌入一个本地mp4视频

3手稿欣赏:使用无框线的三行两列的表格对手稿进行布局排列

4 主要作品:使用带有框线和背景色的表格对主要作品进行罗列,内部文字居中,超链接加蓝色下划线。

心得与体会:

建立一个网站就像盖一幢大楼一样,它是一个系统工程,有自己特定的工作流程,你只有遵循这个步骤,按部就班地一步步来,才能设计出一个满意的网站。首先,我们要确立网站主题。网站主题就是你建立的网站所要包含的主要内容,一个网站必须要有一个明确的主题。特别是对于像我这样的个人网站,你不可能像综合网站那样做得内容大而全,包罗万象。你没有这个能力,也没这个精力。网站的主题无定则,只要是你感兴趣的,任何内容都可以,但主题要鲜明,在你的主题范围内内容做到大而全、精而深。

然后,我们要找材料。明确了网站的主题以后,你就要围绕主题开始搜集材料了。常言道:“巧妇难为无米之炊”。要想让自己的网站有血有肉,能够吸引住用户,你就要尽量搜集材料,搜集得材料越多,以后制作网站就越容易。材料既可以从图书、报纸、光盘、多媒体上得来,也可以从互联网上搜集,然后把搜集的材料去粗取精,去伪存真,作为自己制作网页的素材。

找到材料后,我们还要规划网站。一个网站设计得成功与否,很大程度上决定于设计者的规划水平,规划网站就像设计师设计大楼一样,图纸设计好了,才能建成一座漂亮的楼房。网站规划包含的内容很多,如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等,你只有在制作网页之前把这些方面都考虑到了,才能在制作时驾轻就熟,胸有成竹。也只有如此制作出来的网页才能有个性、有特色,具有吸引力。如何规划网站的每一项具体内容,我们在下面会有详细介绍。

做好以上三步之后,我们就要选择合适的制作工具。尽管选择什么样的工具并不会影响你设计网页的好坏,但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。网页制作涉及的工具比较多,首先就是网页制作工具了,在这里,我们一般都是用有“网络三剑客”之称的Dreamweaver、Fireworks、flash来制作网页,对于图片部分的处理,个人觉得Photoshop比较好用。

最后,我们就需要按照规划一步步地把自己的想法变成现实了,这是一个复杂而细致的过程,一定要按照先大后小、先简单后复杂来进行制作。所谓先大后小,就是说在制作网页时,先把大的结构设计好,然后再逐步完善小的结构设计。所谓先简单后复杂,就是先设计出简单的内容,然后再设计复杂的内容,以便出现问题时好修改。在制作网页时要多灵活运用模板,这样可以大大提高制作效率。网页做好之后,就要发布到Web服务器上,才能够让全世界的朋友观看,还要不断地进行宣传,这样才能让更多的朋友认识它。

以上就是我对于网页制作的一些个人心得,由于本人的技术还不是很成熟,还存在很多的不足(如:背景过于单调和网页布置不合理)。选择学习这门课是很正确的选择,虽然在以后不会再有机会去上了,但我还是会通过各种方式继续页设计和制作的,同时很感谢带我入门的徐兵老师,让我有机会去学习有关网页的知识,谢谢!

网页设计与制作期末大作业报告——动画家宫崎骏相关推荐

  1. HTML+CSS+JS网页设计与制作期末大作业:网站——宏源山庄

    宏源山庄网站主要包括首页.山庄简介.新闻资讯.特色美食.山庄环境.人才招聘.联系我们等七个页面适合学生作业. 目录 部分效果图展示 index.html页面 about.html页面 news.htm ...

  2. java期末大作业设计_java程序设计-期末大作业报告模板.doc

    云南大学软件学院报告 Java programming – final Report School of Software, Yunnan University 个人成绩 序号学号姓名成绩12345 ...

  3. DW静态网页设计与制作 JavaScript大作业 HTML静态网页作业——海贼王主题网页设计制作6个页面(HTML+CSS)

    HTML静态网页作业--海贼王主题网页设计制作6个页面(HTML+CSS) 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大?HTML网页作业无从下手?网页要求的总数量太多?没有合 ...

  4. php网站开发期末大作业,网页设计期末大作业报告..doc

    网页设计期末大作业报告. 南开大学滨海学院 本 科 生 论 文(设 计) 中文题目:外文题目:Website design and implementation based on Web develo ...

  5. html网页设计代码作业——家乡介绍-长治(8页) HTML+CSS+JavaScript 学生DW网页设计作业成品 html网页制作期末大作业成品_网页设计期末作业

    HTML5期末大作业:家乡介绍网站设计--家乡介绍-长治(8页) HTML+CSS+JavaScript 学生DW网页设计作业成品 html网页制作期末大作业成品_网页设计期末作业 常见网页设计作业题 ...

  6. html期末作业代码网页设计——云南民族文化(8页) HTML+CSS+JavaScript html网页制作期末大作业成品_网页设计期末作业

    HTML5期末大作业:家乡文化网站设计--云南民族文化(8页) HTML+CSS+JavaScript html网页制作期末大作业成品_网页设计期末作业 常见网页设计作业题材有 个人. 美食. 公司. ...

  7. HTML5期末大作业:榆林子州网站设计——榆林子州-含论文(6页) 榆林子州旅游网页HTML代码 学生网页设计与制作期末作业下载 大学生网页设计与制作成品下载 DW旅行网页作业

    HTML5期末大作业:榆林子州网站设计--榆林子州-含论文(6页) 榆林子州旅游网页HTML代码 学生网页设计与制作期末作业下载 大学生网页设计与制作成品下载 DW旅行网页作业 常见网页设计作业题材有 ...

  8. 学生DW静态网页设计——代码质量好-家乡广州 (5页) HTML+CSS+JavaScript web网页制作期末大作业

    HTML5期末大作业:家乡广州网站设计--代码质量好-家乡广州 (5页) HTML+CSS+JavaScript web网页制作期末大作业 常见网页设计作业题材有 个人. 美食. 公司. 学校. 旅游 ...

  9. HTML网页设计期末课程大作业~旅游住宿酒店的HTML网页设计(14页) ~学生网页设计作业源码 旅游网页代码 学生网页设计与制作期末作业下载 DW旅游网页作业代码下载

    旅游住宿酒店的HTML网页设计14页 ~ 学生网页设计与制作期末作业下载~ 大学生网页设计与制作成品下载 ~DW旅游网页作业代码下载 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头 ...

  10. HTML5期末大作业:XXX 网站设计——电影请以你的名字呼唤我(4页)HTML+CSS+JavaScript html网页制作期末大作业成品_网页设计期末作业

    HTML5期末大作业:XXX 网站设计--电影请以你的名字呼唤我(4页)HTML+CSS+JavaScript html网页制作期末大作业成品_网页设计期末作业 常见网页设计作业题材有 个人. 美食. ...

最新文章

  1. 跟刘强东、雷军等大佬聊天后,我总结了:如何结交牛人,跟大咖做朋友!
  2. 从输入字段读取属性时,HTML编码丢失
  3. 编译过程中,termcap.h 文件找不到路径 licli.a终于生成
  4. 一文搞定深度优先搜索(DFS)与广度优先搜索(BFS)【含完整源码】
  5. tar 参数 m. linux,Linux tar命令参数详细说明
  6. android显示字符串,Android自定义View用切图显示字符串
  7. relative会脱离文档流吗_抖音投放你会吗?选Feed流还是Dou+?
  8. 5A通过PMP考试分享
  9. SecureCRT鼠标双击或拖成变成Ctrl+C的解决办法
  10. mysql源码解读——源码介绍
  11. Windows搭建kms服务器
  12. did双重差分法_二重差分法分析(DID)
  13. kafka学习七:kafka之集群篇
  14. 天才在左,疯子在右,我们在哪?
  15. 常用的文件后缀都有哪些?
  16. android 高德拖拽地图定位,拖拽选址-拖拽选址-示例中心-JS API UI 组件示例 | 高德地图API...
  17. GS108E+GS105E+TP-LINK TL-WDR5620实现联通家庭宽带IPTV单线复用教程
  18. 【Windows】能上QQ却打不开网页(提示未连接到互联网,代理服务器出现问题,或者地址有误。)的解决办法
  19. 苹果电脑mac系统运行卡顿 反应慢怎么办?
  20. SpringBoot——使用拦截器拦截未登录用户

热门文章

  1. C# 后台处理 webp图片
  2. 如何正确重新启动计算机,电脑突然重启,详细教您电脑忽然重启如何解决
  3. Ubuntu-图形界面和字符界面切换快捷键
  4. Android 复杂的列表视图新写法 MultiType (v3.1.0 修订版)
  5. 浏览器edge插件的安全与个人隐私
  6. Laravel 部署到阿里云 / 腾讯云
  7. css数字怎么换行,css实现连续的英文或数字自动换行的方法
  8. windows 豆沙绿参数
  9. java游戏服务器开发需要学习的技术
  10. ARM版本的IAR的下载和安装