六月伊人,国产精品制服丝袜欧美,亚洲va在线∨a天堂va欧美va,精品亚洲一区二区三区在线观看国产老熟女色视频,国产熟女九色,国产又粗又大,久久人人网国产精品

什么影響了表格的可用性?

2011-11-22    藍(lán)藍(lán)設(shè)計(jì)的小編

轉(zhuǎn)載藍(lán)藍(lán)設(shè)計(jì)(   www.wnxcall.com  )是一家專(zhuān)注而深入的設(shè)計(jì)機(jī)構(gòu) ,為期望卓越的國(guó)內(nèi)外企業(yè)提供有效的   BS界面設(shè)計(jì)  、   cs界面設(shè)計(jì)    ipad界面設(shè)計(jì)    包裝設(shè)計(jì)  、   圖標(biāo)定制  、   用戶(hù)體驗(yàn)  、交互設(shè)計(jì)、   網(wǎng)站建設(shè)  、平面設(shè)計(jì)服務(wù)

閱讀瞬間發(fā)生了什么?
       當(dāng)閱讀行為發(fā)生時(shí),如果能進(jìn)入人腦,你會(huì)發(fā)現(xiàn)復(fù)雜的處理過(guò)程在瞬間發(fā)生。所以在談?wù)撛O(shè)計(jì)之前,讓我們先來(lái)看看閱讀表格時(shí),人的大腦都會(huì)處理哪些任務(wù)。

?    閱讀標(biāo)題 :用戶(hù)在閱讀表格時(shí)通常會(huì)簡(jiǎn)單略過(guò)行或列的表頭。
?    通讀全篇 :用戶(hù)也許會(huì)先花時(shí)間掃描全篇,了解表格的整體結(jié)構(gòu),數(shù)據(jù)分類(lèi)以及復(fù)雜性。
?    視覺(jué)搜索 :為了找到數(shù)據(jù),用戶(hù)會(huì)順著一行或者一列直到發(fā)現(xiàn)交叉點(diǎn)的有用信息,當(dāng)用戶(hù)對(duì)表格的結(jié)構(gòu)熟悉,或者上下文的表格結(jié)構(gòu)相同的時(shí)候,視覺(jué)搜索會(huì)更迅速的完成。
?    信息提取 :找到目標(biāo)數(shù)據(jù)后,用戶(hù)就從表中提取了一條基本信息。
?    理解 :用戶(hù)傾向用他們已有的知識(shí)去理解已從表格中獲取的信息。
?    確定類(lèi)別和趨勢(shì) :用戶(hù)會(huì)從感知層面對(duì)相似的數(shù)據(jù)進(jìn)行歸類(lèi)并尋找變化趨勢(shì)。
?    比較 :用戶(hù)將會(huì)比較數(shù)據(jù),并發(fā)現(xiàn)規(guī)律。
?    推斷 :為了更深層次的理解數(shù)據(jù)變化,用戶(hù)往往會(huì)推斷一些結(jié)論
?    解釋 :用戶(hù)將會(huì)從自身的知識(shí)庫(kù)中提取信息,來(lái)解釋數(shù)據(jù)的意義。
?    回憶 :用戶(hù)會(huì)需要記住表格中的一些信息,以便在將來(lái)使用這些信息。
?    決策 :用戶(hù)會(huì)以他們對(duì)數(shù)據(jù)含義的解釋為基礎(chǔ),進(jìn)行相關(guān)決策。

什么影響了表格的可用性?
       表格是否好用,取決于讀表人是否熟悉表格結(jié)構(gòu),以及表格數(shù)據(jù)的復(fù)雜性和表格的設(shè)計(jì)與其目標(biāo)是否相符。
       在1977年Ehrenberg發(fā)表的啟發(fā)性文章“算數(shù)入門(mén)(Rudiments of Numeracy)”中,作者這樣定義一個(gè)好的表格的標(biāo)準(zhǔn),“數(shù)據(jù)的規(guī)律性和例外情況應(yīng)該一目了然,至少看一次后,人們就知道他們的含義”。他的觀(guān)點(diǎn)是人們總是在不斷的閱讀表格,好的表格設(shè)計(jì)應(yīng)該讓人們?cè)谑煜そY(jié)構(gòu)的基礎(chǔ)上,很容易的就理解信息。而理解的含義就是明白數(shù)據(jù)之間的相互關(guān)系。

設(shè)計(jì)指南
       當(dāng)你已經(jīng)確認(rèn)了需要展示的數(shù)據(jù)信息,并且了解了表格設(shè)計(jì)的目的和在閱讀時(shí)人們頭腦中發(fā)生的一切,遵循如下的指南會(huì)讓你的表格更有效。

點(diǎn)擊查看原圖

1.    滿(mǎn)足閱讀者的期望
       閱讀者對(duì)表格越熟悉,他們就能越快的提取有用信息。滿(mǎn)足閱讀者的期望,我們就應(yīng)該遵循表格在不同使用目的下的一貫的設(shè)計(jì)風(fēng)格,例如我們?cè)趫?bào)紙的表格中會(huì)采用的藝術(shù)字體就永遠(yuǎn)不該出現(xiàn)在年度報(bào)告的數(shù)據(jù)表格中。
       下面兩幅表格展現(xiàn)的是英格蘭銀行2010年年報(bào)中完全相同的一組數(shù)據(jù)信息,然而,我們大多會(huì)選擇閱讀后者,因?yàn)樗惹罢邆鬟f了更清楚的信息。
在這里,讀者預(yù)期的關(guān)鍵因素是一個(gè)閱讀年報(bào)的人可能已經(jīng)有過(guò)大量的閱讀經(jīng)驗(yàn),并形成了年報(bào)信息展示的期望形式。事實(shí)上年報(bào)出版物中包含了大量有用的和重要的數(shù)據(jù),而閱讀這些數(shù)據(jù)的人們往往不再看上下文或者其他內(nèi)容。
       鑒于此,我們需要采用其他年報(bào)慣用的展示方式,以符合讀者的閱讀習(xí)慣,保證數(shù)據(jù)展示的清晰準(zhǔn)確。請(qǐng)注意,下表中更清晰的那副,是基本上完全根據(jù)英格蘭銀行2010年年報(bào)格式制作,是清晰展示數(shù)據(jù)表格的優(yōu)秀樣本。

點(diǎn)擊查看原圖 點(diǎn)擊查看原圖

2.    依據(jù)設(shè)計(jì)目標(biāo),合理排序
       結(jié)構(gòu)化安排表格中的數(shù)據(jù)將有助于達(dá)到設(shè)計(jì)目的。如果表格的目的是比較中心城市的人口數(shù)量,那么我們就應(yīng)該按照從大到小的順序而不是開(kāi)頭字母的順序排列數(shù)據(jù)。如果目的是展現(xiàn)學(xué)院一年以來(lái)的成本增長(zhǎng)情況,那么就應(yīng)該按照時(shí)間安排數(shù)據(jù)。
       表格中的項(xiàng)目應(yīng)該通過(guò)某種排序的手段來(lái)滿(mǎn)足閱讀者的興趣。我們來(lái)看下面的兩個(gè)表格,左面的展示了世界上最高的十座山峰,鑒于“高度”最受關(guān)注,那么表格的項(xiàng)目就是按照這個(gè)字段降序排列的。這樣最受關(guān)注的信息能夠排在表格的最前面。
       然而,如果讀者實(shí)際關(guān)注的是山峰首次登頂?shù)臅r(shí)間,那么在左面的表格中,讀者就需要費(fèi)一番力氣去找到第一個(gè)被登頂?shù)纳椒濉o@然右側(cè)的表格排序方式將會(huì)更合理。
       請(qǐng)注意,最被關(guān)注的字段應(yīng)該放在最左面,越往左面排,重要性應(yīng)該越高,雖然最左面的一列往往保留給項(xiàng)目名稱(chēng)或者關(guān)鍵字段,其后應(yīng)該按順序排列其他項(xiàng)目數(shù)據(jù)或數(shù)值。


點(diǎn)擊查看原圖

3. 移除無(wú)用元素
       為了保證快速瀏覽,集中展現(xiàn)最重要的數(shù)據(jù),請(qǐng)避免在表格周邊堆砌各種不相干元素。如果想讓表格中的數(shù)據(jù)自己說(shuō)話(huà),就不要讓他被周邊的裝飾所淹沒(méi)。在下面的黑白表格中,每一個(gè)數(shù)據(jù)上還有自己的單元格邊框,這通常是HTML語(yǔ)言中默認(rèn)的表現(xiàn)形式,但卻給表格中的數(shù)據(jù)帶來(lái)了不必要的雜亂感覺(jué)。
       各種無(wú)用元素應(yīng)該從表格的單元格、行、列、表頭甚至表格周邊內(nèi)容中移除,以使表格呈現(xiàn)其本來(lái)面目。去除各種裝飾后,表格的各個(gè)部分的重要性都將得到提升。例如在表格1b中,作為人們最感興趣的一列,當(dāng)年的經(jīng)營(yíng)業(yè)績(jī)被簡(jiǎn)單清晰的突出顯示,而其總和也被輕微的加粗。表3a就是一個(gè)非常典型的例子,由于使用了多余的單邊各邊框,使得數(shù)字和背景之間缺乏差異化,大大降低了有效信息在噪音中的比例,相比之下,表3b就好了很多。

點(diǎn)擊查看原圖

 

點(diǎn)擊查看原圖


4. 創(chuàng)造視覺(jué)層級(jí)
       我們可以使用格式排版來(lái)標(biāo)注重點(diǎn)并引導(dǎo)讀者注意力,例如標(biāo)題可以放大或者加粗,高亮可以引起注意。視覺(jué)記號(hào)可以使表格變得易讀,使讀者知道哪些內(nèi)容更重要。
      下面的英格蘭銀行2010年年報(bào)的一組信息被分成了兩個(gè)表格,但仍然體現(xiàn)為一個(gè)整體。紫色的表頭清晰的給出了標(biāo)題,標(biāo)題行僅用了一次表頭(2009、2010)和單位(英鎊)。兩個(gè)表格采用同種顏色加粗的字體作為標(biāo)題,清晰而相互獨(dú)立。兩表各自的最后一行也采用了同樣顏色的下劃線(xiàn)。
      兩個(gè)表格僅僅通過(guò)2010年一列的背景顏色相互連接,這不但實(shí)現(xiàn)了表格的聯(lián)通,而且突出了2010年數(shù)據(jù)的重要性。表頭以及最后一行的加總數(shù)據(jù)采用了粗重字體,并使用了行裝飾線(xiàn),能夠?qū)б喿x者的注意力到這些數(shù)據(jù)信息,因?yàn)?010年度的匯總數(shù)據(jù)是這個(gè)表格中最重要的數(shù)據(jù)。
      閱讀者可以不費(fèi)力氣的找到表格中的重要信息,以下的路徑就表現(xiàn)出在分析相關(guān)表頭和標(biāo)簽(紫色)和數(shù)據(jù)(黑色和灰色)過(guò)程中,讀者目光掃描分成了三個(gè)快速獨(dú)立的動(dòng)作,而路徑變粗的部分就是讀者關(guān)注點(diǎn)所在。


點(diǎn)擊查看原圖

5. 大多數(shù)人只看整數(shù)
       用四舍五入后的整數(shù)填充表格更容易閱讀并關(guān)注變化趨勢(shì),雖然這樣對(duì)于專(zhuān)家們的科學(xué)數(shù)據(jù)來(lái)說(shuō)會(huì)不太,但是大多數(shù)表格是為公眾制作的,他們不需要那樣的細(xì)節(jié)。表格設(shè)計(jì)者應(yīng)該在考慮數(shù)據(jù)用途的基礎(chǔ)上來(lái)決定是否進(jìn)行四舍五入。統(tǒng)計(jì)學(xué)家Howard Wainer也建議我們,多數(shù)情況下,都不需要使用超過(guò)一位小數(shù)。
       多余的數(shù)字是另外一種形式的無(wú)用元素,在那些讀者對(duì)絕對(duì)沒(méi)有興趣的情況下,多余的細(xì)節(jié)會(huì)降低讀者視覺(jué)掃描的速度。
      例如:找到最接近8500米的山峰,第二章表格要遠(yuǎn)比第一個(gè)表格容易。山的高度到毫米顯然沒(méi)有必要,他使得讀者誤認(rèn)為這些數(shù)據(jù)的確是經(jīng)過(guò)精準(zhǔn)測(cè)量,然而事實(shí)有可能不是這樣。根據(jù)讀者的需要提供數(shù)據(jù)的準(zhǔn)確程度,并不會(huì)削弱數(shù)據(jù)的有效性。當(dāng)然又少部分人會(huì)質(zhì)疑第二章表格的準(zhǔn)確性,但是大部分人會(huì)想山峰的高度能夠被測(cè)量的如此嗎?(山峰每年移動(dòng)的距離就遠(yuǎn)不止于此),甚至還會(huì)對(duì)從整體上對(duì)數(shù)據(jù)的有效性以及及時(shí)性提出質(zhì)疑。


點(diǎn)擊查看原圖

點(diǎn)擊查看原圖


6. 為讀者做好計(jì)算
      盡可能的不要讓讀者費(fèi)心去進(jìn)行數(shù)學(xué)計(jì)算或者思維轉(zhuǎn)換,而應(yīng)該通過(guò)在每一行或列的末尾提供匯總信息,例如“合計(jì)”或者“平均值”,這將大大提升理解和判斷速度。
      在英格蘭銀行2010年度報(bào)告中,盡管我們不能通過(guò)改變數(shù)據(jù)來(lái)達(dá)到讀者的期望,但是在其他同樣的報(bào)告中,我們?cè)谀┪苍黾右涣杏杏玫臄?shù)據(jù),以避免用戶(hù)在比較各年度數(shù)據(jù)的時(shí)候,還需要自行計(jì)算增長(zhǎng)或減少的幅度。下面第一個(gè)表格6a已經(jīng)增加了總資產(chǎn)和總負(fù)債數(shù)據(jù),而表格6b則在右側(cè)增加了新的一列,使我們更容易分析出哪些領(lǐng)域的經(jīng)營(yíng)成果發(fā)生了實(shí)質(zhì)性變動(dòng)。

點(diǎn)擊查看原圖

點(diǎn)擊查看原圖


7. 保證前后風(fēng)格一致
       在表格中尋找信息時(shí),讀者希望前后采用同樣風(fēng)格,你應(yīng)該保證對(duì)同類(lèi)元素使用同樣的字體,對(duì)同類(lèi)數(shù)據(jù)使用同種對(duì)齊方式,還有諸如“列標(biāo)題”等各種突出顯示元素的一致性??匆幌孪旅娴谋砀?a,他展示了和前面表格1b同樣的英格蘭銀行2010年度數(shù)據(jù)信息。但是使用了有區(qū)分的表頭字體,標(biāo)簽以及加總格式,表頭采用了居中格式而不是和數(shù)據(jù)一樣右對(duì)齊,加總數(shù)據(jù)也沒(méi)有與數(shù)據(jù)嚴(yán)格對(duì)齊,同時(shí)為了區(qū)別資產(chǎn)和負(fù)債表格,他分別采用了不同顏色的字體,和表格中間粗細(xì)不同的線(xiàn)條。而所有這些實(shí)際上都讓我們產(chǎn)生一種不連貫的感覺(jué),從而給瀏覽表格,把握重點(diǎn)帶來(lái)難度。

點(diǎn)擊查看原圖


8. 有條理的對(duì)齊
       有意識(shí)的采用對(duì)齊格式將使表格更加易讀,請(qǐng)注意將所有的數(shù)字,逗號(hào),小數(shù)點(diǎn)彼此對(duì)齊,同時(shí)調(diào)整表格結(jié)構(gòu),使數(shù)據(jù)和單元格以及整個(gè)表格都是對(duì)仗整齊的。
       我們來(lái)看下面8a的表格中英格蘭銀行2010年度數(shù)據(jù)是如何排列的,然后再對(duì)照一下表1b。在8a中,數(shù)據(jù)是水平居中的,標(biāo)簽也錯(cuò)位了并沒(méi)有和表頭對(duì)齊,這些使表格各種組成元素成為了分散的個(gè)體,降低了表格數(shù)據(jù)作為整體的前后連貫性和瀏覽效率,不僅是2009和2010年之間,就連行與行之間的數(shù)據(jù)也很難進(jìn)行比較,因?yàn)樗麄儧](méi)有對(duì)齊。8b中的情況就好了很多,我們可以清晰的看出表格數(shù)據(jù)采用的對(duì)齊標(biāo)尺。在沒(méi)有對(duì)齊的情況下,各行各列的數(shù)據(jù)寬度拉的越大,瀏覽閱困難。

點(diǎn)擊查看原圖

 

9. 采用適當(dāng)對(duì)比度,區(qū)分?jǐn)?shù)據(jù)和背景
       為了增加易讀性,請(qǐng)保證表格前景和背景色之間足夠的對(duì)比度,尤其是當(dāng)表格的行或者列采用了陰影的情況下。
       保證前后合適的對(duì)比度,對(duì)于閱讀者非常重要,通常人們通過(guò)給行或列加上顏色來(lái)實(shí)現(xiàn)這個(gè)目標(biāo),但是顏色選擇失當(dāng)將會(huì)使前景與背景混雜,反而會(huì)降低數(shù)據(jù)的可區(qū)分度。比較一下表格9a和9b。9a采用了藍(lán)色,但數(shù)據(jù)文字和表格背景的對(duì)比水平較低,而9b的對(duì)比度較高,更加易讀,因?yàn)檠劬Ω菀讌^(qū)分重要數(shù)據(jù)。表格行或者列的陰影應(yīng)該剛好足夠引導(dǎo)目光沿著直線(xiàn)瀏覽,而不能過(guò)于突出。而表頭與主體相比也該足夠醒目,但是不能影響了數(shù)據(jù)在前景作為主體的展示效果。

點(diǎn)擊查看原圖

點(diǎn)擊查看原圖


10. 給列數(shù)減肥
       由于人們的視覺(jué)記憶有限,而且橫向很難檢索復(fù)雜信息,在可能的情況下,請(qǐng)盡量減少列的數(shù)量,如果需要的話(huà),可以將表格分為兩個(gè)。這樣做是為了能讓閱讀者盡可能少的記憶和回憶信息。對(duì)于每一列,讀者都需要記住上下文并瀏覽下面各行信息,讀者可以很容易的縱向?yàn)g覽單行數(shù)據(jù),但橫向?yàn)g覽跨列數(shù)據(jù)時(shí)卻相對(duì)困難。也正是為此,一般情況下,我們會(huì)隔行突出顯示,而不是用列來(lái)引導(dǎo)目光瀏覽的方向。
       當(dāng)我們?cè)谧珜?xiě)wikipedia上的Trafford條目時(shí),有一個(gè)1801至1991年的人口變化表格10a,他包含有2行20列,讀者必須記住有關(guān)信息,并且不停的對(duì)照表頭和數(shù)值來(lái)確認(rèn)他們的關(guān)系,否則他們就無(wú)法獲得趨勢(shì)信息。
       而在表格10b中,同樣的信息被改用多行來(lái)展示,讀者可以很容易的從上到下瀏覽并掌握人口變化的規(guī)律。非正常的信息也能很快被發(fā)現(xiàn),例如19世紀(jì)中期之后的人口爆炸。同時(shí),看一下10b是如何按照世紀(jì)來(lái)給行數(shù)據(jù)分類(lèi)的,采用精心設(shè)計(jì)的周邊點(diǎn)綴,示意性的的將各組分開(kāi),同時(shí)又未影響整體列數(shù)據(jù)的展示效果。

點(diǎn)擊查看原圖
點(diǎn)擊查看原圖


11. 讓數(shù)據(jù)更易于比較
       相對(duì)于上下比較來(lái)說(shuō),人們似乎更習(xí)慣于左右比較。鑒于此,構(gòu)建你的表格讓他更易于列與列之間的比較。而且這種情況下,人們可以很快的瀏覽縱向數(shù)據(jù),雖然有時(shí)也會(huì)使用手指作為引導(dǎo)。
在表格10a和10b中我們已經(jīng)了解到,當(dāng)數(shù)據(jù)處于一列的時(shí)候,人們很容的可以比較數(shù)據(jù)并發(fā)現(xiàn)趨勢(shì)。瀏覽者可以快速的從上之下掃描縱向數(shù)據(jù),而對(duì)于長(zhǎng)距離的橫向數(shù)據(jù),瀏覽就會(huì)遇到困難。然而我們?cè)賮?lái)看一下表格11a,去掉了所有的裝飾框,當(dāng)我們比較2009年和2010年數(shù)據(jù)的時(shí)候,數(shù)據(jù)橫向擺放要比11b中的上下擺放容易的多。
       那么我們什么時(shí)候應(yīng)該采用橫向或者縱向的擺位呢?這里,我們首先應(yīng)該遵守第10條,盡量減少列的數(shù)量,由于人們通常認(rèn)為不同的列之間展示的是不同的數(shù)據(jù)類(lèi)別,表格11a看上去是兩個(gè)組數(shù)據(jù),而11b看上去則好像是8組數(shù)據(jù)。為了讓大腦的短期記憶更好的處理數(shù)據(jù),表格應(yīng)該選擇盡量少的數(shù)據(jù)組數(shù),因此2009和2010的兩組數(shù)據(jù)采用同樣是兩組的擺放形式時(shí),閱讀的體驗(yàn)是最好的,比較起來(lái)最容易。
另外一個(gè)例子,當(dāng)我們的行數(shù)與列數(shù)相等的時(shí)候,我們就迫使大腦進(jìn)行分組,如表格11c是一個(gè)簡(jiǎn)單的算術(shù)乘法表,沒(méi)有表頭而且行列間距相同。而表格11d我們縮小了行間距,增大了列間距,11e我們縮小了列間距而增大了行間距,在11d和11e中,我們?nèi)匀挥械韧男辛袛?shù)量——6行6列,但是分組暗示更加明顯,便于人們區(qū)分不同的條目。
       因此,應(yīng)該最先考慮的是減少列的數(shù)量,但當(dāng)其他情況都相同的情況下,對(duì)于大量同組數(shù)據(jù)應(yīng)該選擇縱向擺放,更容易發(fā)現(xiàn)規(guī)律和趨勢(shì)。而不同組別的少量數(shù)據(jù)條目采用左右放置更好。按照這樣的方式組織你的數(shù)據(jù),你會(huì)發(fā)現(xiàn)其中的益處,別總是采用一種明暗交替的方式來(lái)設(shè)計(jì)你的表格了。

  

  

 

點(diǎn)擊查看原圖

點(diǎn)擊查看原圖


(待續(xù))



 

 
 

【本文由VenturTech 授權(quán)譯言網(wǎng)呈現(xiàn),如需轉(zhuǎn)載請(qǐng)與VenturTech聯(lián)系】

分享本文至:

日歷

鏈接

個(gè)人資料

存檔