《网页设计的准则》PPT课件

《网页设计的准则》PPT课件

ID:36919554

大小:6.00 MB

页数:40页

时间:2019-05-10

《网页设计的准则》PPT课件_第1页
《网页设计的准则》PPT课件_第2页
《网页设计的准则》PPT课件_第3页
《网页设计的准则》PPT课件_第4页
《网页设计的准则》PPT课件_第5页
资源描述:

《《网页设计的准则》PPT课件》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库

1、第5节网页设计的准则5.1网页的基本元素5.2网页布局5.3配色原则第5节网页设计的准则确定网站的题材,并且收集和组织了许多相关的资料内容后,按照以下方面组织内容来吸引浏览者浏览网站。1.站点结构图2.导航栏3.精美的图片4.引人入胜的内容5.反馈表6.联系方式页面7.搜索工具8.常见问题解答网页设计的准则5.1.1网页的基本元素网页是网站提供信息服务的主要形式,一般包含文字、图像和表格等内容,以及实现信息块之间跳转的超链接。网页通常以网页文件及其附属文件形式存在。常见的网页元素包括文本、图片、超链接、表格、导航栏、动

2、画和交互表单。1.文本2.图片和动画3.声音和视频4.超链接5.导航栏6.表格7.表单8.其他常见元素网页的设计5.2网页布局网页是网站构成的基本元素。当浏览者移动鼠标,在网海中遨游,一个个精彩的网页会呈现在用户面前。网页是否精彩,能否吸引浏览者,除了色彩的搭配、文字的变化、图片的处理等因素外,还有一个非常重要的因素—网页的布局。1.网页布局的基本概念对于初学者,最好应先了解网页布局的基本概念。(1)页面尺寸一般在分辨率为1024*768像素的情况下,页面的显示尺寸为1007*600像素;在分辨率为800*600像素的

3、情况下,页面的显示尺寸为780*428像素;而在分辨率为640*480像素的情况下,页面的显示尺寸为620*311像素。在网页设计过程中,向下拖动页面是惟一给网页增加更多内容(尺寸)的方法。但应当注意的是,除非设计者肯定站点的内容很有吸引力,否则不要让浏览者拖动页面超过三个屏幕。网页的设计5.2网页布局(2)整体造型造型就是创造出来的物体形象。这里是指页面的整体形象,这种形象应该是一个整体,图形与文本的结合应该是层叠有序的。虽然显示器和浏览器都是矩形的,但对于页面的造型,设计者可以充分运用自然界中的各种形状及它们的组合

4、,如矩形、圆形、三角形、菱形等。虽然不同形状代表不同意义,但目前的网页制作大多结合多种图形加以设计,只是其中某一种图形的构图比例可能占得多一些。网页的设计5.2网页布局2.网页布局的一般步骤(1)构思根据网站内容的整体风格,设计版面布局。不要讲究细节,只要有一个轮廓就行。当然也可能有多种想法,尽量都把它们画出来,然后再比较,采用一种比较满意的方案。(2)初步填充内容这一步就要把一些主要的内容放到网页中,例如,网站的标志、广告条、菜单、导航条、计数器等。要注意重点突出,把网站的标志、广告条、菜单放在最突出、最醒目的位置,

5、然后再考虑其他元素的放置。(3)细化在这一步,设计者可以利用网页编辑工具把草案做成一个简略的网页,当然,对每一种元素所占的比例也要有一个详细的数字,以便以后修改。网页的设计5.2网页布局3.网页排版布局的原则上面简要介绍了设计网页布局的步骤,而事实上,在构思和设计的过程中,设计者还必须要掌握以下5项原则。(1)平衡性(2)对称性(3)对比性(4)疏密度(5)比例网页的设计5.2网页布局4.网页布局类型网页布局大致可分为“国”字型、拐角型、标题正文型、左右框架型、上下框架型、综合框架型、封面型、Flash型、变化型等。(

6、1)“国”字型布局“国”字型也可以称为“同”字型,是一些大型网站经常使用的类型。这种布局最上面是网站的标题及横幅广告条,接下来就是网站的主要内容,左右分列一些小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声明等。这种布局是网上最常见的一种布局类型。网页的设计5.2网页布局(2)拐角型布局拐角型布局与上一种布局只是形式上的区别,其实是很相似的。该布局上面是标题及广告横幅,接下来的左侧是一窄列链接等内容,右面是很宽的正文,最下面也有一些网站的辅助信息。在这种布局中,左侧一般是导航链

7、接。网页的设计(3)标题正文型布局标题正文型布局的最上面是标题或类似的一些东西,下面一般是正文,例如,一些文章页面或注册页面等就属于这种类型。(4)左右框架型布局采用左右框架型布局的网页分为左、右两部分,一般左面是导航链接,有时最上面会有一个小的标题或标志,右面是正文。大部分大型论坛和网页教程都使用这种布局,有一些个人网站和企业网站也喜欢采用这种布局。(5)上下框架型布局上下框架型布局与左右框架型布局类似,区别仅仅在于这种布局分为上、下两部分。网页的设计5.2网页布局5.网页布局的常用技术(1)CSS(层叠样式表)布局

8、CSS对于初学者来说显得有点复杂,但它的确是一种好的布局方法。目前,CSS运用的好坏是判断一个网站优秀与否的关键。(2)表格布局表格布局的优势在于它能对不同对象加以处理,而又不用担心不同对象之间的影响,而且表格在定位图片和文本上比用CSS更加方便。表格布局惟一的缺点是,当设计者使用了过多的表格时,会影响页面的下载速度。(3)框架布

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。