综合设计主题 | |
综合设计副题 | 我的学校所在地 |
网站设计思路： 利用Dreamweaver6.0制作一个关于“太谷介绍”的网站，利用表格、层和链接等网页设计技术设计页面。通过photoshop等对图片进行加工处理，对整个网站的风格进行总体规划。本网站属于简约大方的一类，通过展示出太谷不同的方面给大家以不同的体验。 | |
网站功能划分及实现： 机票预订 本网站共分为七个大块：如上图所示，历史沿革、行政区划、自然环境、人文景观、历史人物、地方特产、教学文化。各个模块之间通过导航栏来进行跳转。 ● 概要设计 所有的网页外围都具有一样的框架，只有中间的内容在改变，这样做更加直观。index.html的导航栏有首页、历史沿革、行政区划、自然环境、人文景观、历史人物、地方特产、教学文化。其中，“历史沿革”介绍太谷的历史发展，“行政区划”介绍了太谷现在的行政划分，“自然环境”介绍了太谷境内的山川河流，“人文景观”介绍了太谷境内的一些代表性的历史建筑，“历史人物”介绍了民国国民政府行政院长——孔祥熙的一生，“地方特产”介绍了太谷当地的一些特产名吃，“教学文化”制作了关于太谷地区各个学校的照片相册。 所用工具：dreamweaver、photoshop等。通过photoshop等对图片进行加工处理，将处理好的图片插入到dreamweaver中，并进行排版等工作，最后编辑文字内容格式，网页制作完毕。 ● 详细设计 本网站一共有11个页面，每一个页面顶部都有导航栏，能够相互跳转，而且在人文景观各页面底部设有“上一页”、“下一页”、“返回”等按钮，不必使用浏览器上的后退按钮。下面，介绍一下重点几个页面的设计： 1“首页” 在首页上，除了顶部的导航栏以外，左上角插入了一张图片，右上角则是一段太谷的简单介绍，下半部分则是以表格制作了一份关于太谷的简单名片介绍。同时页面还插入了一张背景图片。 2“历史沿革” 除导航栏以外，历史沿革页面分为上下两部分，上部分介绍了太谷的县界变迁，下部分介绍了太谷的行政隶属。以书页图片作为背景，整体简洁明了。黄山攻略一日游自由行 3“行政区划” 除导航栏以外，在页面的右上角以表格来制作了一份关于太谷一些行政知识的名片，周围是环绕报表格的具体的行政区划说明。夏茉是一份关于太谷3镇6乡的详细介绍，包括行政代码、面积以及下辖村落的名字。页面以严肃的浅灰为底，显示出官方行政的庄重严肃，令人肃然起敬。 4“自然环境” 除导航栏以外，页面自上而下依次介绍了太谷境内的山地、水文与气候。每段介绍都有一张相关图片插入其中，便于读者更加清楚的了解介绍内容。 5“人文景观” 除导航栏以外，开始先总体介绍了太谷的旅游景观的发展现状，下面又利用div标签制作了三块图文结合的块，每块的图片和文字都可以链接到相应的页面。 对于具体的介绍景点页面，顶部是以marquee制作的滚动标题，下面是景点的照片，照片在鼠标经过时会变换成另一幅照片，照片下面是关于景点的具体介绍，包括门票、开放时间、交通状况、景点简介等内容。之后是以marquee制作的滚动图片，每幅图片都可以跳转到所代表的景点的页面，最后是以表格制作的“上一页”“下一页”“返回首页”“返回人文景观”的四个跳转按钮，从而实现从页面跳转到首页、人文景观和其他景点介绍页的目的。 6“历史人物” 历史人物页面重点介绍了民国国民政府行政院长——孔祥熙，开始是一副孔祥熙的照片和他的人物简介。下面则从求学、致富、从政三方面介绍了孔祥熙的生平经历，每个版块都以div来实现，有报刊杂志的感觉。 7“地方特产” 地方特产页面以div将页面竖直等分成三部分，分别介绍壶瓶枣、太谷饼和定坤丹。每部分的头部是以marquee制作的特效标题，吸引眼球，下面是文字与图片的主体内容，简单明了。 8“教学文化” 教学文化页面，可分为上下两部分，上部分总体介绍了太谷境内的知名高校以及科研机构，列举了中小学的数量和外来学生的人数。下部分则是一个用js语言搭建的相框，相框的上部用来显示各大院校的图片，下部分是各相片的缩略图，用以选择想要观看的图片。 Js代码位于js/jquery.js中。 ● 制作步骤 1.素材的准备 网站的排版格式是用Dreamweaver表格画出来的。所使用图片来源有自己在锡林浩特拍摄和网上下载两种途径。由Photoshop处理后插入到Dreamweaver中。还有一些个性化按钮，是经由Flash制作后在北京环球影城游客增加Dreamweaver中使用的。 2.现在去九寨沟穿什么衣服合适网站页面制作 使用DW6制作网页。 先把素材整理好，把图片整理好放在新建的“图片素材”文件夹下，个性按钮放在新建的“按钮”文件夹中。然后定义站点，选择这个目录，然后就可以方便的使用和处理。 制作步骤： （1）启动Dreamweaver。 （2）打开“站点”菜单，选择“新建站点”命令，选择“高级”编辑站点并确定。 （3） 选件“文件”新建html基本页，并保存为“index.html长隆酒店”文件。 （4）建立表格。由于将所要介绍内容分为九部分，因此建立一行九列的表格。 （5）在表格内输入文字内容，并分别创立与子网页的超链接。 （6）表格嵌套完成后开始添加内容： a）点击插入图片，在最上层的表格中插入用Photoshop所裁剪制成的图片。 b）添加关于网站主题的文字内容、flash内容以及添加站内索引等相关链接内容。 （7）设置页尾。 （8）为所有输入的文字内容进行排版，并最后校对网页内容。 | |
网站设计总结 本次网页设计中，我不仅学到了很多关于网页设计方面的知识，也从中学会了关于网络、编程等方面的知识。我学会了运用Dreamweaver软件设计网页，完善网页。在这个过程中，我通过自学教材、上网查询，学习了很多知识，包括网站的排版等等。 在设计过程中也出现了很多的问题，但通过看书，上网查询，请教老师等方式，不断的学习、解决、提高，设计出的网页不论是外观还是内容，都在不断的进步、改善。可以说在自己动手，不断实践的过程中，网页设计水平得到了很大的提高。 在网页设计中出现问题是免不了的，但是出现问题后一定需要自己想办法解决，通过询问同学，查书籍或者在网页上搜索都可以，但一定要自己主动地去寻答案才能解决问题。 在网页设计过程中，很多问题的出现都是因为在细微之处出现了错误，要想较为顺利的完成网页制作，按照程序一步步来是十分重要的。同时也要细心，不能凭主观臆断来进行制作。切不可急功近利，应根据自己的能力进行网页设计，否则，画虎不成反类犬。 通过这次网站设计，学会了Dreamweaver的使用，同时还对上学期的Photoshop有了一定的应用和巩固。很感谢老师能给我们这次机会，我想我应该更加努力，抓住机会把它学通学精。 | |
本文发布于:2023-06-14 00:34:48，感谢您对本站的认可！
本文链接：http://www.035400.com/whly/2/472665.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
| 留言与评论（共有 0 条评论） |