网页设计
书
电子商务学习网页设计
(XXX网站设计)
班级:XXX
姓名:XXX
学号:XXX
网站设计报告
一、设计目标:
通过电子商务网站设计的学习,学会用dreamweaver等软件来对一个网站进行系统的设计,从理论知识的掌握,转向操作技能的提高,进而提高个人总体计算机网络水平的提高。
二、理论知识的准备:
1.为了满足用户制作的目标,应该注意哪些问题?
A网页结构网页结构要清晰,易于导航,思路和脉络要符合访问者的想法。可采取的
有:采用框架结构表现主题,索影和正文;网页的大小一般控制在50KB以内;在网页的尾部放上联系方式,如E-MAIL,以方便访问者能建立联系,反馈必要的信息
B页面内容一般情况下,网页都要以内容为主,不必过分的追求复杂的表现形式,但必须写好简介,要有特色,避免太空,泛泛而谈。页面本身要简单,结构复杂的网页不仅要花费很多的精力,而且由于超连接复杂,让浏览者阅读时也感觉困难
C文字在以内容为主的前提下,应当尽量把形式与内容结合起来。既不要把页面弄的花哨,也不呀只讲内容完全不讲究文字和图片的安排,要容易阅读。要注意:网页的标题要简洁,明确,能反映整个文档的内容;在文本叙述部分使用水平线分割不同的部分;对重点的文章和段落要使用强调字体表达
D图形设计好图形并合理使用能给网页增色。网页中插入的图形尽量要小,网页中图形要附加文字说明,使人在图形出来之前了解相关内容;不要为图形加太长的交互文本,也不要把所有的超连接放在图上;控制页面中的图的数量,不要滥用图象GIF
2. 网站设计的过程中,最中要的一个原则是什么?为什么?
网站最重要的原则是创意。虽然网站的主要目的是传送给人们它的信息,但在传递信息的同时还把他的文化传递给获取信息的这些人。软件的掌握是短期就能速成的,而且新的软件成出不穷,功能越来越强大,但是使用这些软件必须要有良好的网站设计概念才能创造优秀的网站,这是网站制作的核心。网站的制作是按一定的步骤进行的,不同的网站设计着对网站有不同的见解和看法,但是有个共同观点:仅会输入文本,制作超级连接,排列图片不是真正意义上的网页制作,因为网页制作最重要的一个原则是创意。
3.动态网页的工作原理
动态网页是与静态网页相对应的,也就是说,网页 URL的后缀是类似.html的静态网页的常见形动态网页制作专家式,而是以.aspx.asp、.jsp、.php、.perl、.cgi等形式为后缀,并且在动态网页网址中有一个标志性的符号——“?”。动态网页的工作原理与静态网页比较类似,但是在服务器端有很大差别。服务器端接到客户端发出的请求后,首先会找到所要浏览的动态网页文件,然后解释执行其中的程序代码,将含有程序代码的动态网页转化为标准的静态网页,然后将静态网页发送给客户端。
三、软硬件需求准备
(1)计算机一台
(2)Dreamweaver开发工具和运行环境
(3)此网页用360安全浏览器IE浏览器进行预览
(4)图形处理工具,如photoshop、Macromedia Fireworks 8、美图秀秀等。
四、网站总体分析与设计
1.网站介绍
1.1网站主题:学校的网站,简洁大方
1.2网站风格:蓝色严肃绿色活力
1.3网站页面结构以及相关功能简介
本网页提供者学生老师领导可以在上面发表各种信息,方便学生,家长以及校外的有兴趣的人
本网站的设计结构包括导航栏、登录模块、新闻模块、学生模块、校外链接模块等。
具体设计:导航栏模块展示我们的学校的logo
登录模块:主要是为了学生老师能在内进行互动,方便各方面查询,还可以对各方面的最新信息进行了解,交流!
学生模块:提供者学生在校的各种生活照,供别人了解,其他学生也可以信息发上来,一起分享.
校外链接模块可以提供友情的链接,让学生找同学更方便
2.网站大概设计纲要:
1.首页
2.学校历史:告诉浏览者我们学校的基本内容方便了解
3.学生风采
把学生的风采弄成相册展示出来供浏览者欣赏,可以为新生提供方便。
4新闻更新
告诉大家学校的最新动态,方便了解。
5.学校注册
可以让大家进行互动,在后院可以更好交流学校心得主
代码设计:分时问候
8.网站CSS部分设计:
本站CSS部分的设计主要作用:利用相应代码来组织各模块之间的布局。提供一个整体上比较美观的网页设计。省去主页中药用代码写入才能改变的复杂工作。
主要代码:(1)margin主要用于控制模块之间的间距
(2)padding主要用于模块内部元素的漂移
(3)background用来控制模块的背景
(4)border主要控制块的边缘和图片等的边框
(5)font-family控制字体
(6)#主要用于CSS中,用来找到网页模块的位置,从
而进行控制
我自己都没怎么用CSS,因为力求简洁大方,个人觉得还
是很好用的,但是我怕麻烦。
五、网站的运行与实现
安装Dreamweaver后,打开软件,新建一个网站,将制作好的文件(后缀为html)包括建设好的css和需要添加的图片,全部复制放到一个文件夹中,用360安全或者IE浏览器进行预览。
六、网站建设心得体会
虽然之前有上过类似课程但是用dreamweaver制作还是第一次,可能刚开始会感觉很困难,但是其实只要多去琢磨一段时间,把课本上的知识和老师讲的知识结合起来,并进行多次实际操作,就能比较好的运用这门知识。通过对这个网页的设计,了解到自身还存在很多不足,希望能在今后的学习和生活中好好提高。在设计过程中,我了解到网页设计的一些布局,连接,还有一些图形处理的技术,了解到网页设计的一些基本规则,另外利用DW这个软件确实能提高许多工
作效率,比以往单纯的用html来做方便的多。不过还是因为时间、条件和个人能力有限,网页还存在不太完善的地方。最后,还是感谢老师能给我们一个机会让我们实践这一门知识,不管学到多少东西,但是至少我们能很好的对自己有一个认识,对这门课,这门知识有一个认识,而这些知识是可以对我们今后的工作和生活带来很多益处的。
姓名:杨涛
专业:08电商
学号:20081903