視覺流程及版式類型

（一）在視覺心理學家的研究中，視覺運動規(guī)律是其成果之一。一條垂直線在頁面上，會引導視線作上下的視覺流動；水平線會引導視線向左右的視覺流動;斜線比垂直線、水平線有更強的視覺訴求力;矩形的視線流動是向四方發(fā)射的；圓形的視線流動是輻射狀的；三角形則隨著頂角之方向使視線產生流動；各種圖形從大到小漸層排列時，視線會強烈地按照排列方向流動。視覺流程，是視線在觀賞物上的移動過程，是二維或三維空間中的運動。這種視覺的流動線極為重要,同時又是很容易被網頁設計者忽視的因素.經驗豐富的設計者都對此非常重視，他們善于運用這條貫穿頁面的主線，設計易于瀏覽的頁面。從某個角度講，視覺流程的設計結果就是版式。本章也將對網頁設計的版式設計進行總結和闡述1。視覺流程的籌劃視覺流程是網頁版式設計的重要內容，可以說，視覺流程運用的好壞，是設計者技巧成熟與否的表現。視覺流程的籌劃包括幾個重要的因素下面就對它們作具體的歸納與分析。頁面中不同的視域，注目程度不同，給人心理上的感受也不同。一般而言,上部給人輕快、漂浮、積極、高昂之感;下部給人壓抑、沉重、限制、穩(wěn)定的印象;左側，感覺輕便、自由、舒展，富于活力；右側,感覺局促卻顯得莊重.網頁中最重要的信息，應安排在注目率最高的頁面位置，這個位置便是頁面的最佳視域。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作為個性化的視覺元素，拼貼剪紙式的文字分別占據了三個點，吸引視線在它們之間流動人們閱讀材料時習慣按照從左到右，從上到下的順序進行.瀏覽者的眼睛首先看到的是頁面的左上角，然后逐漸往下看。根據這一習慣，設計時可以把重要信息放在頁面的左上角或頁面頂部，如公司的標志、最新消息等，然后按重要性依次放置其他內容。重要的信息應該讓瀏覽者最容易發(fā)現，而不是深藏在多層鏈接之后。

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明確、簡潔的豎向視覺流程

橫向視覺流程：有穩(wěn)定、恬靜之感。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橫向的視覺流程，向人們傳達出穩(wěn)重、可信的視覺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橫向的視覺流程，使頁面穩(wěn)重直觀斜向視覺流程：以不穩(wěn)定的動勢引起注意。

三）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焦點視覺流程焦點，是指視覺心理的焦點。每個頁面中都有一個視覺焦點，這是需要重點處理的對象。焦點是否突出，和頁面版式編排、圖文的位置、色彩的運用有關，同時也與對“焦點”著力描寫有關。在視覺心理作用下，焦點視覺流程的運用使主題更為鮮明、強烈在具體的處理上，一般沿著視覺焦點的傾向與力度，來發(fā)展視線的進程。通常以鮮明的形象或文字占據頁面某個位置，或完全充斥整版，集合瀏覽者的視線，完成視覺心理上的焦點建造。另外，向心、離心的視覺運動，也是焦點視覺流程的運用形式。按照主從關系的順序，使放大