網頁設計中的心理學(上)
標簽:
網頁設計
2017.04.11
wangyeshejigenxinlixueyoushenmeguanxi?renshiyizhonghenweimiaodedongwu,womenshoudaobiaoyishixingdongdekongzhi,danyetongshibeiqianyishideganshouyingxiang。wulunwangyeshejideruhemeilunmeihuan,womenbixujide,wangyezuizhongshigeirenkande。因此總是必須讓閱讀的人感到舒服,才能有效傳達你想表達的訊息。尤其以購物網站而言,若瀏覽者連看網頁都感到辛苦,那就更不可能下手購買了。所以在網頁設計上,除了美觀之外,我們也要注意閱讀者的觀感,兩全其美,才能稱為成功的網頁設計。
網頁讀取不可過久
wangyeshejizhekenenghuixiangzaiwangyeshangjiarugeshigeyangxuanlidetupian,danguoduodetupianhuiyanzhongyingxiangwangyeduqusudu。yibaneryan,liulanzhederennaijixiandayuezhiyouqimiao。kaoliangxiandairenpubianmeinaixindeqingkuang,zuihaonengkongzhizaisimiaozhixia。ruoshejishangzhendedeshiyongdaliangtupian,namejiubiewanglexianliyongtupianruantishuadipinzhi,yijiangditupiandaxiao。suiranshuadipinzhiwukehoufeidehuipohuaitupianpinzhi,danzhiyaobushishuadetaiguohuo,qishirouyanbuyidingfenbiandechulai。zailiangxiangquanhengdeqingkuangxia,haishigujiduqusuduweiyouxian。
不要放與主題偏離太遠的圖片
雖然網頁設計者可能會想發揮一些巧思,放置某些需要聯想再聯想、或huo過guo於yu抽chou象xiang的de圖tu片pian。盡jin管guan抽chou象xiang圖tu片pian也ye有you產chan生sheng妙miao用yong的de時shi候hou,但dan不bu一yi定ding所suo有you瀏liu覽lan者zhe都dou能neng跟gen上shang設she計ji者zhe的de脈mai絡luo,了le解jie圖tu片pian的de意yi思si。在zai這zhe種zhong情qing形xing下xia,圖tu片pian隻zhi會hui製zhi造zao不bu必bi要yao的de混hun亂luan。文wen字zi寫xie作zuo中zhong,有you一yi個ge詞ci叫jiao「預設錯誤」。它的意思是說,作者預設讀者了解某些知識,而使用了術語、專用名詞或冷僻用語,但實際上讀者並不了解。當這種現象發生時,通常全篇文章會讀來一頭霧水。網頁設計也是一樣,如果設計者「預設錯誤」放了不能理解的圖片,那隻會讓瀏覽者感到不明所以。
每一頁有一個焦點且隻有一個
無論你的網站內容或多或少,大概不會有瀏覽者願意一頁一頁全部看過。瀏覽者對網站的使用,近似於我們平常查字典的習慣:快(kuai)速(su)搜(sou)索(suo)到(dao)要(yao)的(de)資(zi)訊(xun),讀(du)完(wan),闔(he)上(shang)書(shu)。所(suo)以(yi)網(wang)頁(ye)焦(jiao)點(dian)必(bi)須(xu)足(zu)夠(gou)清(qing)晰(xi),讓(rang)瀏(liu)覽(lan)者(zhe)一(yi)眼(yan)就(jiu)知(zhi)道(dao)這(zhe)一(yi)頁(ye)有(you)沒(mei)有(you)他(ta)要(yao)的(de)東(dong)西(xi)。例(li)如(ru),本(ben)頁(ye)是(shi)公(gong)司(si)簡(jian)介(jie)、本頁是聯絡資訊,不要讓瀏覽者花時間在判斷頁麵資訊上。或許你會希望瀏覽者多停留在你的網站久一點,但此點應該建立在「花時間讀內容」,而非「花時間判斷內容」上(shang)。若(ruo)你(ni)的(de)網(wang)頁(ye)沒(mei)有(you)焦(jiao)點(dian),或(huo)將(jiang)兩(liang)三(san)件(jian)事(shi)全(quan)部(bu)塞(sai)在(zai)一(yi)個(ge)頁(ye)麵(mian)內(nei),甚(shen)至(zhi)放(fang)了(le)許(xu)多(duo)與(yu)標(biao)題(ti)無(wu)關(guan)的(de)內(nei)容(rong)。瀏(liu)覽(lan)者(zhe)隻(zhi)會(hui)在(zai)閱(yue)讀(du)時(shi)倍(bei)感(gan)痛(tong)苦(ku),自(zi)然(ran)就(jiu)不(bu)願(yuan)意(yi)光(guang)顧(gu)你(ni)的(de)網(wang)站(zhan)了(le)。
將瀏覽者期待的資訊放在一進站就能看到的位置
雖sui然ran說shuo對dui於yu任ren意yi一yi個ge網wang站zhan,會hui進jin來lai的de人ren形xing形xing色se色se。但dan身shen為wei一yi個ge網wang頁ye設she計ji者zhe,或huo管guan理li者zhe,實shi際ji上shang或huo多duo或huo少shao可ke以yi判pan斷duan來lai訪fang者zhe的de目mu的de。尤you其qi是shi當dang公gong司si在zai進jin行xing活huo動dong或huo宣xuan傳chuan時shi,這zhe種zhong取qu向xiang會hui更geng明ming顯xian。例li如ru某mou電dian信xin業ye者zhe在zai電dian視shi廣guang告gao大da打da「網內互打免費新方案」,那麼我們就可以推測,廣告期間多出來的流量,大部份是希望進一步了解新方案。而基於此目的而來的瀏覽者,心理會有一種預期:「廣告打那麼大,頁麵應該很好找吧」,對(dui)於(yu)搜(sou)索(suo)資(zi)訊(xun)的(de)耐(nai)心(xin)度(du)也(ye)會(hui)低(di)於(yu)平(ping)常(chang)。這(zhe)時(shi)網(wang)頁(ye)設(she)計(ji)上(shang)就(jiu)必(bi)須(xu)滿(man)足(zu)瀏(liu)覽(lan)者(zhe)的(de)期(qi)待(dai),將(jiang)資(zi)訊(xun)放(fang)在(zai)一(yi)進(jin)站(zhan)馬(ma)上(shang)可(ke)以(yi)找(zhao)到(dao)的(de)位(wei)置(zhi)。一(yi)但(dan)滿(man)足(zu)了(le)瀏(liu)覽(lan)者(zhe)的(de)心(xin)理(li)期(qi)待(dai),便(bian)能(neng)帶(dai)來(lai)「真是方便」這類的正麵觀感,進而提升形象。相反的,如果瀏覽者不能在極短時間找到想要的頁麵,就會對此活動喪失興趣 ,因而失去一次機會。關於這個主題,在本站的「網路行銷 - 為什麼客人來了留不住?」一文有更詳細的敘述,有興趣的讀者也可以參閱。
令人舒服的文字排版
這(zhe)是(shi)一(yi)個(ge)很(hen)簡(jian)單(dan)的(de)概(gai)念(nian)。為(wei)了(le)傳(chuan)達(da)想(xiang)要(yao)說(shuo)的(de)資(zi)訊(xun),在(zai)網(wang)頁(ye)中(zhong)文(wen)字(zi)是(shi)不(bu)可(ke)或(huo)缺(que)的(de),然(ran)而(er)過(guo)密(mi)或(huo)過(guo)小(xiao)的(de)文(wen)字(zi)會(hui)造(zao)成(cheng)閱(yue)讀(du)的(de)困(kun)難(nan)。當(dang)然(ran)對(dui)於(yu)網(wang)頁(ye)設(she)計(ji)者(zhe)而(er)言(yan),這(zhe)是(shi)很(hen)難(nan)取(qu)舍(she)的(de)問(wen)題(ti)。因(yin)為(wei)太(tai)大(da)文(wen)字(zi)顯(xian)的(de)很(hen)呆(dai)板(ban),排(pai)版(ban)上(shang)也(ye)較(jiao)不(bu)易(yi)。如(ru)何(he)在(zai)兩(liang)者(zhe)之(zhi)間(jian)取(qu)得(de)平(ping)衡(heng),形(xing)成(cheng)一(yi)個(ge)麻(ma)煩(fan)的(de)問(wen)題(ti)。嚴(yan)格(ge)說(shuo)來(lai),我(wo)們(men)無(wu)法(fa)製(zhi)定(ding)一(yi)個(ge)標(biao)準(zhun),畢(bi)竟(jing)文(wen)字(zi)必(bi)須(xu)配(pei)合(he)整(zheng)體(ti)才(cai)會(hui)是(shi)好(hao)的(de)設(she)計(ji)。但(dan)基(ji)本(ben)的(de)幾(ji)個(ge)重(zhong)點(dian)是(shi),要(yao)有(you)適(shi)當(dang)的(de)空(kong)白(bai),讓(rang)瀏(liu)覽(lan)者(zhe)有(you)喘(chuan)息(xi)的(de)空(kong)間(jian)。所(suo)謂(wei)的(de)「空白」可以是分段、行距、空行、分隔線、分頁等,總之要能有「告一段落,休息一下」deganjiao。rangliulanzhezhidaokeyizaizhelizantingyixia,zaijixuxiayigejieduan。qianwanbuyaojiangwenziduiqidemimimama,nazhihuirangrenyoukandaowenziqiangbideganjiao。
不要讓瀏覽者有永無止境的感覺
youmeiyouguoyizhongjingyan?yaodaoyigecongmeiquguodedifang,jishilaihuideshijianchabuduo,huichengzongshiganjiaobiquchengkuai。qishirenbuxihuanweizhideganjiao,yinweiweizhihuidailaibuanyukongju。ruguowangyeshejizhejianlileyongwuzhijingdexiayiye,liulanzhezaiyikaishishihuoxuhuihennaixindeyuedu,daner、三san頁ye過guo後hou,就jiu隻zhi會hui急ji切qie想xiang按an下xia一yi頁ye,找zhao到dao終zhong點dian在zai那na裏li。人ren的de耐nai心xin是shi有you限xian的de,當dang瀏liu覽lan者zhe發fa現xian自zi己ji處chu在zai漫man漫man長chang路lu上shang,不bu知zhi道dao終zhong點dian在zai那na。這zhe時shi就jiu會hui像xiang去qu一yi個ge陌mo生sheng的de地di方fang一yi樣yang,時shi間jian感gan變bian慢man,連lian帶dai產chan生sheng焦jiao燥zao和he不bu安an,他ta便bian無wu法fa閱yue讀du你ni想xiang傳chuan遞di的de資zi訊xun。因yin此ci盡jin量liang讓rang網wang頁ye內nei容rong在zai三san個ge分fen頁ye內nei可ke以yi告gao一yi段duan落luo,如ru果guo真zhen的de得de建jian立li三san個ge以yi上shang的de分fen頁ye,記ji得de一yi開kai始shi就jiu先xian提ti示shi總zong頁ye數shu,至zhi少shao瀏liu覽lan者zhe可ke以yi了le解jie自zi己ji還hai需xu要yao閱yue讀du多duo少shao內nei容rong。
不要使用令人有負麵情感的元素
除非你的預設對象一開始就很特殊,不然不要使用會令人產生負麵情感的元素。何謂負麵情感?就是恐懼、惡心、血腥、恐怖、baolideng,zheleilingrenbushufudeqingxu。renleiyouqujibixiongdebenneng,huibifumianqingganshiyizhongziwobaohucuoshi。ruowangyeshejizhezaiwangyezhongyunyonglehuitiaoqizheleiqingxudewenzi、設(she)計(ji)或(huo)圖(tu)片(pian),讓(rang)瀏(liu)覽(lan)者(zhe)進(jin)入(ru)時(shi),可(ke)能(neng)會(hui)立(li)即(ji)跳(tiao)出(chu),根(gen)本(ben)不(bu)願(yuan)意(yi)看(kan)你(ni)想(xiang)說(shuo)些(xie)什(shen)麼(me)。因(yin)此(ci)即(ji)使(shi)是(shi)為(wei)了(le)彰(zhang)顯(xian)個(ge)性(xing)化(hua)或(huo)特(te)殊(shu)化(hua),也(ye)不(bu)要(yao)用(yong)運(yun)用(yong)這(zhe)類(lei)的(de)元(yuan)素(su),否(fou)則(ze)就(jiu)失(shi)去(qu)「網頁是為了讓人閱讀」的de起qi始shi目mu的de。至zhi於yu驚jing悚song電dian影ying或huo恐kong怖bu遊you戲xi的de官guan方fang網wang站zhan不bu在zai討tao論lun之zhi列lie,因yin為wei會hui來lai看kan這zhe些xie站zhan的de人ren,本ben來lai就jiu是shi為wei了le被bei嚇xia而er來lai的de,請qing竭jie盡jin所suo能neng的de表biao現xian恐kong怖bu感gan吧ba。
網頁讀取不可過久
wangyeshejizhekenenghuixiangzaiwangyeshangjiarugeshigeyangxuanlidetupian,danguoduodetupianhuiyanzhongyingxiangwangyeduqusudu。yibaneryan,liulanzhederennaijixiandayuezhiyouqimiao。kaoliangxiandairenpubianmeinaixindeqingkuang,zuihaonengkongzhizaisimiaozhixia。ruoshejishangzhendedeshiyongdaliangtupian,namejiubiewanglexianliyongtupianruantishuadipinzhi,yijiangditupiandaxiao。suiranshuadipinzhiwukehoufeidehuipohuaitupianpinzhi,danzhiyaobushishuadetaiguohuo,qishirouyanbuyidingfenbiandechulai。zailiangxiangquanhengdeqingkuangxia,haishigujiduqusuduweiyouxian。
不要放與主題偏離太遠的圖片
雖然網頁設計者可能會想發揮一些巧思,放置某些需要聯想再聯想、或huo過guo於yu抽chou象xiang的de圖tu片pian。盡jin管guan抽chou象xiang圖tu片pian也ye有you產chan生sheng妙miao用yong的de時shi候hou,但dan不bu一yi定ding所suo有you瀏liu覽lan者zhe都dou能neng跟gen上shang設she計ji者zhe的de脈mai絡luo,了le解jie圖tu片pian的de意yi思si。在zai這zhe種zhong情qing形xing下xia,圖tu片pian隻zhi會hui製zhi造zao不bu必bi要yao的de混hun亂luan。文wen字zi寫xie作zuo中zhong,有you一yi個ge詞ci叫jiao「預設錯誤」。它的意思是說,作者預設讀者了解某些知識,而使用了術語、專用名詞或冷僻用語,但實際上讀者並不了解。當這種現象發生時,通常全篇文章會讀來一頭霧水。網頁設計也是一樣,如果設計者「預設錯誤」放了不能理解的圖片,那隻會讓瀏覽者感到不明所以。
每一頁有一個焦點且隻有一個
無論你的網站內容或多或少,大概不會有瀏覽者願意一頁一頁全部看過。瀏覽者對網站的使用,近似於我們平常查字典的習慣:快(kuai)速(su)搜(sou)索(suo)到(dao)要(yao)的(de)資(zi)訊(xun),讀(du)完(wan),闔(he)上(shang)書(shu)。所(suo)以(yi)網(wang)頁(ye)焦(jiao)點(dian)必(bi)須(xu)足(zu)夠(gou)清(qing)晰(xi),讓(rang)瀏(liu)覽(lan)者(zhe)一(yi)眼(yan)就(jiu)知(zhi)道(dao)這(zhe)一(yi)頁(ye)有(you)沒(mei)有(you)他(ta)要(yao)的(de)東(dong)西(xi)。例(li)如(ru),本(ben)頁(ye)是(shi)公(gong)司(si)簡(jian)介(jie)、本頁是聯絡資訊,不要讓瀏覽者花時間在判斷頁麵資訊上。或許你會希望瀏覽者多停留在你的網站久一點,但此點應該建立在「花時間讀內容」,而非「花時間判斷內容」上(shang)。若(ruo)你(ni)的(de)網(wang)頁(ye)沒(mei)有(you)焦(jiao)點(dian),或(huo)將(jiang)兩(liang)三(san)件(jian)事(shi)全(quan)部(bu)塞(sai)在(zai)一(yi)個(ge)頁(ye)麵(mian)內(nei),甚(shen)至(zhi)放(fang)了(le)許(xu)多(duo)與(yu)標(biao)題(ti)無(wu)關(guan)的(de)內(nei)容(rong)。瀏(liu)覽(lan)者(zhe)隻(zhi)會(hui)在(zai)閱(yue)讀(du)時(shi)倍(bei)感(gan)痛(tong)苦(ku),自(zi)然(ran)就(jiu)不(bu)願(yuan)意(yi)光(guang)顧(gu)你(ni)的(de)網(wang)站(zhan)了(le)。
將瀏覽者期待的資訊放在一進站就能看到的位置
雖sui然ran說shuo對dui於yu任ren意yi一yi個ge網wang站zhan,會hui進jin來lai的de人ren形xing形xing色se色se。但dan身shen為wei一yi個ge網wang頁ye設she計ji者zhe,或huo管guan理li者zhe,實shi際ji上shang或huo多duo或huo少shao可ke以yi判pan斷duan來lai訪fang者zhe的de目mu的de。尤you其qi是shi當dang公gong司si在zai進jin行xing活huo動dong或huo宣xuan傳chuan時shi,這zhe種zhong取qu向xiang會hui更geng明ming顯xian。例li如ru某mou電dian信xin業ye者zhe在zai電dian視shi廣guang告gao大da打da「網內互打免費新方案」,那麼我們就可以推測,廣告期間多出來的流量,大部份是希望進一步了解新方案。而基於此目的而來的瀏覽者,心理會有一種預期:「廣告打那麼大,頁麵應該很好找吧」,對(dui)於(yu)搜(sou)索(suo)資(zi)訊(xun)的(de)耐(nai)心(xin)度(du)也(ye)會(hui)低(di)於(yu)平(ping)常(chang)。這(zhe)時(shi)網(wang)頁(ye)設(she)計(ji)上(shang)就(jiu)必(bi)須(xu)滿(man)足(zu)瀏(liu)覽(lan)者(zhe)的(de)期(qi)待(dai),將(jiang)資(zi)訊(xun)放(fang)在(zai)一(yi)進(jin)站(zhan)馬(ma)上(shang)可(ke)以(yi)找(zhao)到(dao)的(de)位(wei)置(zhi)。一(yi)但(dan)滿(man)足(zu)了(le)瀏(liu)覽(lan)者(zhe)的(de)心(xin)理(li)期(qi)待(dai),便(bian)能(neng)帶(dai)來(lai)「真是方便」這類的正麵觀感,進而提升形象。相反的,如果瀏覽者不能在極短時間找到想要的頁麵,就會對此活動喪失興趣 ,因而失去一次機會。關於這個主題,在本站的「網路行銷 - 為什麼客人來了留不住?」一文有更詳細的敘述,有興趣的讀者也可以參閱。
令人舒服的文字排版
這(zhe)是(shi)一(yi)個(ge)很(hen)簡(jian)單(dan)的(de)概(gai)念(nian)。為(wei)了(le)傳(chuan)達(da)想(xiang)要(yao)說(shuo)的(de)資(zi)訊(xun),在(zai)網(wang)頁(ye)中(zhong)文(wen)字(zi)是(shi)不(bu)可(ke)或(huo)缺(que)的(de),然(ran)而(er)過(guo)密(mi)或(huo)過(guo)小(xiao)的(de)文(wen)字(zi)會(hui)造(zao)成(cheng)閱(yue)讀(du)的(de)困(kun)難(nan)。當(dang)然(ran)對(dui)於(yu)網(wang)頁(ye)設(she)計(ji)者(zhe)而(er)言(yan),這(zhe)是(shi)很(hen)難(nan)取(qu)舍(she)的(de)問(wen)題(ti)。因(yin)為(wei)太(tai)大(da)文(wen)字(zi)顯(xian)的(de)很(hen)呆(dai)板(ban),排(pai)版(ban)上(shang)也(ye)較(jiao)不(bu)易(yi)。如(ru)何(he)在(zai)兩(liang)者(zhe)之(zhi)間(jian)取(qu)得(de)平(ping)衡(heng),形(xing)成(cheng)一(yi)個(ge)麻(ma)煩(fan)的(de)問(wen)題(ti)。嚴(yan)格(ge)說(shuo)來(lai),我(wo)們(men)無(wu)法(fa)製(zhi)定(ding)一(yi)個(ge)標(biao)準(zhun),畢(bi)竟(jing)文(wen)字(zi)必(bi)須(xu)配(pei)合(he)整(zheng)體(ti)才(cai)會(hui)是(shi)好(hao)的(de)設(she)計(ji)。但(dan)基(ji)本(ben)的(de)幾(ji)個(ge)重(zhong)點(dian)是(shi),要(yao)有(you)適(shi)當(dang)的(de)空(kong)白(bai),讓(rang)瀏(liu)覽(lan)者(zhe)有(you)喘(chuan)息(xi)的(de)空(kong)間(jian)。所(suo)謂(wei)的(de)「空白」可以是分段、行距、空行、分隔線、分頁等,總之要能有「告一段落,休息一下」deganjiao。rangliulanzhezhidaokeyizaizhelizantingyixia,zaijixuxiayigejieduan。qianwanbuyaojiangwenziduiqidemimimama,nazhihuirangrenyoukandaowenziqiangbideganjiao。
不要讓瀏覽者有永無止境的感覺
youmeiyouguoyizhongjingyan?yaodaoyigecongmeiquguodedifang,jishilaihuideshijianchabuduo,huichengzongshiganjiaobiquchengkuai。qishirenbuxihuanweizhideganjiao,yinweiweizhihuidailaibuanyukongju。ruguowangyeshejizhejianlileyongwuzhijingdexiayiye,liulanzhezaiyikaishishihuoxuhuihennaixindeyuedu,daner、三san頁ye過guo後hou,就jiu隻zhi會hui急ji切qie想xiang按an下xia一yi頁ye,找zhao到dao終zhong點dian在zai那na裏li。人ren的de耐nai心xin是shi有you限xian的de,當dang瀏liu覽lan者zhe發fa現xian自zi己ji處chu在zai漫man漫man長chang路lu上shang,不bu知zhi道dao終zhong點dian在zai那na。這zhe時shi就jiu會hui像xiang去qu一yi個ge陌mo生sheng的de地di方fang一yi樣yang,時shi間jian感gan變bian慢man,連lian帶dai產chan生sheng焦jiao燥zao和he不bu安an,他ta便bian無wu法fa閱yue讀du你ni想xiang傳chuan遞di的de資zi訊xun。因yin此ci盡jin量liang讓rang網wang頁ye內nei容rong在zai三san個ge分fen頁ye內nei可ke以yi告gao一yi段duan落luo,如ru果guo真zhen的de得de建jian立li三san個ge以yi上shang的de分fen頁ye,記ji得de一yi開kai始shi就jiu先xian提ti示shi總zong頁ye數shu,至zhi少shao瀏liu覽lan者zhe可ke以yi了le解jie自zi己ji還hai需xu要yao閱yue讀du多duo少shao內nei容rong。
不要使用令人有負麵情感的元素
除非你的預設對象一開始就很特殊,不然不要使用會令人產生負麵情感的元素。何謂負麵情感?就是恐懼、惡心、血腥、恐怖、baolideng,zheleilingrenbushufudeqingxu。renleiyouqujibixiongdebenneng,huibifumianqingganshiyizhongziwobaohucuoshi。ruowangyeshejizhezaiwangyezhongyunyonglehuitiaoqizheleiqingxudewenzi、設(she)計(ji)或(huo)圖(tu)片(pian),讓(rang)瀏(liu)覽(lan)者(zhe)進(jin)入(ru)時(shi),可(ke)能(neng)會(hui)立(li)即(ji)跳(tiao)出(chu),根(gen)本(ben)不(bu)願(yuan)意(yi)看(kan)你(ni)想(xiang)說(shuo)些(xie)什(shen)麼(me)。因(yin)此(ci)即(ji)使(shi)是(shi)為(wei)了(le)彰(zhang)顯(xian)個(ge)性(xing)化(hua)或(huo)特(te)殊(shu)化(hua),也(ye)不(bu)要(yao)用(yong)運(yun)用(yong)這(zhe)類(lei)的(de)元(yuan)素(su),否(fou)則(ze)就(jiu)失(shi)去(qu)「網頁是為了讓人閱讀」的de起qi始shi目mu的de。至zhi於yu驚jing悚song電dian影ying或huo恐kong怖bu遊you戲xi的de官guan方fang網wang站zhan不bu在zai討tao論lun之zhi列lie,因yin為wei會hui來lai看kan這zhe些xie站zhan的de人ren,本ben來lai就jiu是shi為wei了le被bei嚇xia而er來lai的de,請qing竭jie盡jin所suo能neng的de表biao現xian恐kong怖bu感gan吧ba。












