视觉流程及版式类型

（一）在视觉心理学家的研究中，视觉运动规律是其成果之一。一条垂直线在页面上，会引导视线作上下的视觉流动；水平线会引导视线向左右的视觉流动;斜线比垂直线、水平线有更强的视觉诉求力;矩形的视线流动是向四方发射的；圆形的视线流动是辐射状的；三角形则随着顶角之方向使视线产生流动；各种图形从大到小渐层排列时，视线会强烈地按照排列方向流动。视觉流程，是视线在观赏物上的移动过程，是二维或三维空间中的运动。这种视觉的流动线极为重要,同时又是很容易被网页设计者忽视的因素.经验丰富的设计者都对此非常重视，他们善于运用这条贯穿页面的主线，设计易于浏览的页面。从某个角度讲，视觉流程的设计结果就是版式。本章也将对网页设计的版式设计进行总结和阐述1。视觉流程的筹划视觉流程是网页版式设计的重要内容，可以说，视觉流程运用的好坏，是设计者技巧成熟与否的表现。视觉流程的筹划包括几个重要的因素下面就对它们作具体的归纳与分析。页面中不同的视域，注目程度不同，给人心理上的感受也不同。一般而言,上部给人轻快、漂浮、积极、高昂之感;下部给人压抑、沉重、限制、稳定的印象;左侧，感觉轻便、自由、舒展，富于活力；右侧,感觉局促却显得庄重.网页中最重要的信息，应安排在注目率最高的页面位置，这个位置便是页面的最佳视域。A-imwn«ni«inCl:fqq*ygfli*i*I#ffeiigtfiratii.K^a--inii.ar-d^n«l"VFFfWWF4A-imwn«ni«inCl:fqq*ygfli*i*I#ffeiigtfiratii.K^a--inii.ar-d^n«l"VFFfWWF4W-tB.bm-pL•"■ddtgpti」vidvqO .,■，■』fuipiA<l*idi-aniJrfedIABljEjOL^liHJ.1™EehfldLK>h>nMidTfij^frrtiQ>|?>4iptdhrji,Efi^ki卜+iJ-iFFtt* ii词JMr(2Ji>nMCfomedlaCVfn<OvET™-lq^.ri|JSn-HFvl••■">ir^iix->■AdslaAMHiii-T*H・ce[fAnonuaiccr*sn^nrinwrTB0dH-ttainia..*同g*b3 *g5■ .卜祐圳寺!^jj 力卜*"Pm5t匾时*5»HplOdvQijOAAf9^aM^iiv*4uilHpri-iv^LiCteTicHm— 左*4ph~c<wiixNchhi ft•■辨，dA«ph3itH*4wtmI啪■»pro-Lfafj|w+Ad4b»^wtajftapiII»rr.w*trTryAcrobat7.0Professional—freefor30days!IDMWoMlilrtf>>*a.JCMdigtrvgtatiekMicfA£j^t”而切S7.^hh9«tlJ^tbr*■«>：vr1■图1页面的设计轻松而具均衡的形式感，把最佳视域留给了横贯页面的大banner图2作为个性化的视觉元素，拼贴剪纸式的文字分别占据了三个点，吸引视线在它们之间流动人们阅读材料时习惯按照从左到右，从上到下的顺序进行.浏览者的眼睛首先看到的是页面的左上角，然后逐渐往下看。根据这一习惯，设计时可以把重要信息放在页面的左上角或页面顶部，如公司的标志、最新消息等，然后按重要性依次放置其他内容。重要的信息应该让浏览者最容易发现，而不是深藏在多层链接之后。

DemandtheBestDemand2V\'ir^.Pfir■1■字MmSTt^^Wr1!TWCmY时。j^^hrf'j纳曾bjMk^tB^iiKWM"**4*+<^4*'*A.^Mwh"rtt* r«-nsbW-TELMEX.MFEica-»i*T7JC*E3'^zfa-jJ-V4*P|5*r«i-ijiunv»Onimowrtamks⑶mrai-TELMEX.MFEica-»i*T7JC*E3'^zfa-jJ-V4*P|5*r«i-ijiunv»Onimowrtamks⑶mraiUHiBdvin^dEflM-idTr^meisrKJUiUJk^HjHUBLdhdindiur-iiMMJiril土iqi^Jw-*jJL_tklmwr・U\S^ihrMfluridmi<3wwHfrw--aPil中*5^15mIjL.TIEMI-图3浏览者的眼睛首先看到的是页面的左上角（二）2视觉流程类型视觉流程主要包括以下几种类型：线型视觉流程、曲线视觉流程、焦点视觉流程、反复视觉流程、导向视觉流程、散点视觉流程等。2.1线型视觉流程线型视觉流程，分为直线视觉流程和曲线视觉流程两类。E>DihmEiuiabxitoJin■«*Clr*"!RF<-<i,南言颤|!**1kii—■aY^IWnliEUMBtrndiM*iBm*3V5ri«^hE9WrTrBE>DihmEiuiabxitoJin■«*Clr*"!RF<-<i,南言颤|!**1kii—■aY^IWnliEUMBtrndiM*iBm*3V5ri«^hE9WrTrB'EnwCd-rcM^tJ'riHW'u«4niW4dhlBHNrnti-b1*"■S4CC-v*riCd-reH-iliali-UMi&皿*屁-IMHiPUPWEf■JIQUIII—1隅一图4视觉流程明确，形成清晰易读的页面设计图5自由的视觉流程形成生动活泼的页面设计1、直线视觉流程使页面的流动线更为简明，直接地诉求主题内容，有简洁而强烈的视觉效果。直线视觉流程表现为三种形式：竖向视觉流程:给人坚定、直观的感觉.图6明确、简洁的竖向视觉流程

横向视觉流程：有稳定、恬静之感。ODIV/VP*1**".O1 1痛U«IW<j4fm^arArr iftfiTMimE官umnE藉W曲闭沱im#r.曜*mtmccwwi-IMTROWGIMGGOCHVASME^1IMTROWGIMGGOCHVASME^1LIMITEDECX1IMTHWFLES■3"时■:f«««mEMN*回5g* I制ITOHlITOHl四!OUWEXn 山此点取・心叫■UEEKgtfE-jSilJMS/ID/EAM4md：>m：NENLi.IUGh5•eVf*li*nniff~iflnri0Thn启 « “ «- Cifl1E43iQO4VA图7横向的视觉流程，向人们传达出稳重、可信的视觉00=8Prp，rl^$ffpTH'WiajrppH00=8Prp，rl^$ffpTH'WiajrppH《pmunrlTX响NF"h^w.TTii hX响NF"h^w.TTii h牌F^FM**F0t45b»te4ph(i^printsr<tdicPrinty*LHemivt>prfarewr.'上H；-T*ewN■nOipNXH]liWM^acdsea?IIkW^acdsea?IIkWriB-ww-1-tUA-ilhH-^Ewli'lr「p^.Wflyni^f,pju^..*|r4由刺.VW"WFEiiJifiaftnirtnMimirdb|midkAUiw.wiiAQcdseerrpoujerpackKir-LEL」・En1、JW±・I?.、・：：!』Ik1fl■H，J■II"-rf^fZ板[Pr■.it)Jij-r;.!>命「『Wm_i Ktihng.Thur$TEd心■atarmgriMi*nu.rnaiffwrnaiffwmjtIa.firv■IvuJti|bujp『心“书■•i『心“书■•i p^-mq1.MW<S 厦+■■■ InjrfiHia.>3E +■■TE5f«n冒cwl^rt<b»ckfeapnrMn-f■n»4»i.r-Ai*vJibr*F.EniVarAr-Lradbc-at日■惘c~^4j■ndcji^cfTiJ4d匚hoisMlbjHiriE.ran...WdKflVa*LKWMOfg^r*sdrr^3-i*—5—£<^eldU必0 WiVmiiiiMMtkof^ntc*M卜mit mdi*r*man...图8横向的视觉流程，使页面稳重直观斜向视觉流程：以不稳定的动势引起注意。

三）2。2曲线视觉流程曲线视觉流程，是由视觉要素随弧线或回旋线运动而形成的。它不如直线视觉流程直接简明，但更具流畅的美感.曲线视觉流程的形式微妙而复杂，可概括为两种形式：弧线形（c形）视觉流程：有扩张感和方向感.争IL立顼鬲1苗营口调jfBwj：.副加enoih|制*n口U。|I*雨1经wh。|廿*占1/晔|知?"电中|由里回也版珂现I魅旧判畚I垣顷I汕川hIHmrrNhF对Em虫J般颤或队届I 加询IIfcildiUhfe|l£HIC^nlitfUs|SihjCh・d<XiHf|CMf口湖Lgin图10弧线形视觉流程，使页面具有很强的扩张性回旋形（s形）视觉流程：两个相反的弧线则产生矛盾回旋在平面中增加深度和动感。图11回旋形视觉流程,使页面产生更多层次，空间感（四）2.3焦点视觉流程焦点，是指视觉心理的焦点。每个页面中都有一个视觉焦点，这是需要重点处理的对象。焦点是否突出，和页面版式编排、图文的位置、色彩的运用有关，同时也与对“焦点”着力描写有关。在视觉心理作用下，焦点视觉流程的运用使主题更为鲜明、强烈在具体的处理上，一般沿着视觉焦点的倾向与力度，来发展视线的进程。通常以鲜明的形象或文字占据页面某个位置，或完全充斥整版，集合浏览者的视线，完成视觉心理上的焦点建造。另外，向心、离心的视觉运动，也是焦点视觉流程的运用形式。按照主从关系的顺序，使放大