- 1、本文档共49页,可阅读全部内容。
- 2、有哪些信誉好的足球投注网站(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
查看更多
第六周网页版式设计要点
主要内容 4.导向 导向视觉流程主要是通过诱导元素,主动引导浏览者的视线按一定的方向或位置有序地运动,有主有次地把页面各构成要素依序串连起来,形成一个构成联系的有机整体,使主次分明、重点突出、结构紧凑、条理清晰流畅,最大程度地发挥视觉传达的功效。常运用手势导向、视线导向、形象导向、文字导向来传递信息。 4.导向 导向视觉流程主要是通过诱导元素,主动引导浏览者的视线按一定的方向或位置有序地运动,有主有次地把页面各构成要素依序串连起来,形成一个构成联系的有机整体,使主次分明、重点突出、结构紧凑、条理清晰流畅,最大程度地发挥视觉传达的功效。常运用手势导向、视线导向、形象导向、文字导向来传递信息。 5.散点 散点视觉流程是指没有固定的视觉流动线,在网页编排中形成图与图、图与文字之间自由分散状态的方式,视线随页面的组成要素做或上或下、或左或右的自由移动。散点排列强调感觉性原理,较注重自由、随机和偶然性的空间运动感。追求新奇、特别刺激的心态,能让人轻松随意、有趣和极具个性。 对不同类型的导航来说,所有导航的布置必须保持一致性。一致性是实用性的关键,考虑到快速点击导航按钮,导航的布置基本上相同,网站顶部的导航一直保持在每个网页,其位置、形态、色彩均保持一致。屏幕到屏幕间导航区域内元素的位置和数目也应保持一致。如果改变了导航按钮的位置和样式,读者不得不花时间寻找到和确认下一个导航按钮,或大幅度地移动鼠标点击导航。 2.5 一致导航 也可称为栏型,网页中的骨骼型版式是一种规范的、理性的设计形式,类似于报刊的版式。常见的骨骼有竖向通栏、双栏、三栏、四栏和横向的通栏、双栏、三栏和四栏等。一般以竖向分栏为多。这种版式给人以和谐、理性的美。几种分栏方式结合使用,显得网页既理性、条理,又活泼而富有弹性。这种版式常用于公司网站的设计。 3网页版式构成的类型 3.1 骨骼型 “口”字型、“同”字型、“回”字型也可归于此类,是一些大型网站所喜欢的类型,即最上面是网站的标题、导航以及横幅广告条,接下来就是网站的主要内容,左右分列一些两小条内容,中间是主要部分,与左右一起罗列到底,最下面是网站的一些基本信息、联系方式、版权声明等。这种布局的优点是充分利用版面,信息量大,缺点是页面拥挤,不够灵活。这种结构是我们在网上见到的差不多最多的一种结构类型,常用于门户网站的设计。 3.2 “国”字型 “匡”型布局或“T”型布局可归于此类,“匡”型布局中,常见的类型有上面是标题与导航,左侧是展示图片的类型和最上面是标题及广告,左侧是导航链接的类型。“T”布局就是指页面顶部为横条网站标志与广告条,下方左面为主菜单,右面显示内容的布局,因为菜单背景色彩较深,整体效果类似英文字母“T”,我们称之为“T”形布局。这种布局的优点是页面结构清晰,主次分明,是初学者最容易上手的布局方法。缺点是规矩呆板,如果细节色彩上不注意,很容易让人感觉枯燥无味。 3.3 拐角型 框架型版式常用于功能型的网站,如邮箱、论坛、博客等。 1.左右框架型 这是一种左右为分别两页的框架结构,一般左面是导航链接,有时最上面会有一个小的标题或标志,右面是正文。我们见到的大部分的大型论坛都是这种结构的,有一些企业网站也喜欢采用。这种类型结构非常清晰,一目了然。枯燥无味。 2.上下框架型 与上面类似,区别仅仅在于是一种上下分为两页的框架。 3.综合框架型 上页两种结构的结合,相对复杂的一种框架结构,较为常见的是类似于“拐角型”结构的,只是采用了框架结构。常见的邮箱的版式都是综合框架型。 3.4 框架型 POP布局属于此类。就是指页面布局像一张宣传海报,以一张精美图片作为页面的设计中心,页面以图像充满整版。主要以图像为诉求点,将少量文字压置于图像之上。满版型给人以舒展、大方的感觉,视觉传达效果直观而强烈,缺点就是速度慢。随着当今网络的带宽不断变大,因此这种版式在商业网站设计尤其是网络广告中比较常见。 3.5 满版型 把整个页面分成上下或左右两部分,分别安排图片和文案。两个部分形成对比:有图片的部分感性而具活力,文案部分则理性而平静。如果图片所占比例过大,文案使用的文字过于纤细,则造成视觉心理的不平衡,显得生硬、强烈。倘若通过文字或图片将分割线虚化处理,就会产生自然和谐的效果。水平、垂直的分割构成会把页面划分成若干视觉区域,促使浏览者的视线进行阶段性的流动,造成视线流程的节奏性和明显的顺序性。 3.6 分割型 中轴型版式,是沿页面的中轴将图片或文字作水平或垂直方向的排列。水平排列的页面,给人稳定、平静、含蓄的感觉。垂直排列的页面,给人以舒
您可能关注的文档
- 第六章 社会主义国家政府与市场的关系.ppt
- 第六章 汽车的操纵稳定性.ppt
- 第六章 旋转机械的故障诊断(第一讲)1.ppt
- 甲醛熏蒸——PFMEA试用于熏蒸行业.doc
- 甲醇合成工艺条件优化.doc
- 第六章 生理学 中职必威体育精装版版.ppt
- 申报内控鉴证报告格式模板.doc
- 第六章 近代德国史学.ppt
- 田蕴章书法作品欣赏.ppt
- 申报表风险.doc
- 10《那一年,面包飘香》教案.docx
- 13 花钟 教学设计-2023-2024学年三年级下册语文统编版.docx
- 2024-2025学年中职学校心理健康教育与霸凌预防的设计.docx
- 2024-2025学年中职生反思与行动的反霸凌教学设计.docx
- 2023-2024学年人教版小学数学一年级上册5.docx
- 4.1.1 线段、射线、直线 教学设计 2024-2025学年北师大版七年级数学上册.docx
- 川教版(2024)三年级上册 2.2在线导航选路线 教案.docx
- Unit 8 Dolls (教学设计)-2024-2025学年译林版(三起)英语四年级上册.docx
- 高一上学期体育与健康人教版 “贪吃蛇”耐久跑 教案.docx
- 第1课时 亿以内数的认识(教学设计)-2024-2025学年四年级上册数学人教版.docx
文档评论(0)