手機(jī)網(wǎng)站界面與傳統(tǒng)網(wǎng)站界面設(shè)計(jì)的差異性

    (一)不同屏幕尺寸帶來(lái)的信息結(jié)構(gòu)差異性

    當(dāng)分別用手機(jī)和桌面電腦瀏覽同一網(wǎng)站時(shí)，顯示效果不太相同的最主要原因就是硬件設(shè)備不同帶來(lái)的差異。手機(jī)設(shè)備的屏幕

尺寸遠(yuǎn)遠(yuǎn)小于桌面電腦。從京東、蘇寧等各個(gè)網(wǎng)上商城手機(jī)的銷(xiāo)售情況可以看出，現(xiàn)在市場(chǎng)上主流的手機(jī)，像蘋(píng)果、三星、聯(lián)

想、htc、oppo等手機(jī)大部分的屏幕尺寸在3至5英寸之間，個(gè)別的像三星的note2屏幕為5.5英寸，note3為5.7英寸都是屏幕比較大

的手機(jī)。但是我們看一下比較小的筆記本電腦的尺寸，屏幕大小大部分在13至17英寸之間，像微軟超極本類(lèi)型的筆記本屏幕尺寸

在10英寸左右，這是非常小筆記本尺寸，但是仍然和手機(jī)屏幕的尺寸有將近一倍的差距。這種屏幕尺寸上的差距帶來(lái)的不同顯示

效果就是，當(dāng)用戶(hù)用手機(jī)瀏覽一個(gè)沒(méi)有專(zhuān)門(mén)針對(duì)手機(jī)優(yōu)化過(guò)的網(wǎng)頁(yè)的時(shí)候，會(huì)出現(xiàn)兩種情況：一種是該網(wǎng)站在手機(jī)上橫向內(nèi)容顯

示不完整，另一種是網(wǎng)站內(nèi)容在手機(jī)上顯示完整，但是顯示內(nèi)容太小，無(wú)法正常瀏覽。

    手機(jī)網(wǎng)站界面設(shè)計(jì)的時(shí)候比較常見(jiàn)的方法是，把原本并列的信息進(jìn)行縱向排列，通過(guò)手機(jī)瀏覽時(shí)逐層展開(kāi);有些設(shè)計(jì)根據(jù)需

要，甚至?xí)釛壌我膬?nèi)容。手機(jī)網(wǎng)站的界面信息展示方式不是讓用戶(hù)橫向掃描式瀏覽，而是漸進(jìn)式體驗(yàn)。所以屏幕尺寸的變化

對(duì)于網(wǎng)站組織信息和版式設(shè)計(jì)的影響比較大。例如手機(jī)版本的百度搜索結(jié)果每行能顯示20個(gè)漢字左右，而用電腦版本，漢字有40

個(gè)字左右。

    網(wǎng)站整體的設(shè)計(jì)流程相同，視覺(jué)因素不會(huì)有較大變化，但圖片根據(jù)需要適當(dāng)調(diào)整顯示比例。適用技術(shù)區(qū)別不大，但為了適應(yīng)

不同設(shè)備，現(xiàn)在提出網(wǎng)站設(shè)計(jì)的自適應(yīng)性，它的意思就是網(wǎng)站能夠運(yùn)用一些技術(shù)判斷用戶(hù)是用什么設(shè)備瀏覽該頁(yè)面，然后網(wǎng)站自

動(dòng)調(diào)用適合該用戶(hù)的顯示界面，這樣就能保證用戶(hù)通過(guò)不同途徑瀏覽時(shí)有相同的體驗(yàn)。

    (二)使用習(xí)慣帶來(lái)的界面設(shè)計(jì)差異性

    首先，手機(jī)操作的特性之一是適用環(huán)境復(fù)雜化。人們會(huì)在旅行的過(guò)程中查看信息，可能會(huì)在洗手間瀏覽，可能會(huì)躺在舒適的

床上翻看需要的內(nèi)容。移動(dòng)設(shè)備帶給我們的使用環(huán)境的多樣性和便捷性導(dǎo)致越來(lái)越多的人使用手機(jī)上網(wǎng)。桌面電腦甚至筆記本電

腦從這一點(diǎn)來(lái)講不如手機(jī)。試想一下，通過(guò)這么小的瀏覽窗口，使用環(huán)境多樣的情況下，需要快速瀏覽所需要的信息的時(shí)候，仍

然像傳統(tǒng)網(wǎng)站一樣恨不得在一個(gè)頁(yè)面上放上所有的內(nèi)容，植入大量的廣告，用戶(hù)還能瀏覽到什么實(shí)質(zhì)的內(nèi)容?對(duì)比一下淘寶網(wǎng)站首

頁(yè)的傳統(tǒng)版本和手機(jī)版本，可以看出，手機(jī)版本進(jìn)行了高度的簡(jiǎn)化，只突出了搜索和主要的導(dǎo)航，界面更加單純，使用起來(lái)更加

便捷。簡(jiǎn)潔的、內(nèi)容清晰的網(wǎng)站更便于手機(jī)瀏覽。

    其次，人們常常用單手拿著手機(jī)，并且用拇指進(jìn)行操作，這種習(xí)慣導(dǎo)致手機(jī)網(wǎng)站界面設(shè)計(jì)主菜單的位置擺放正好與傳統(tǒng)網(wǎng)站

設(shè)計(jì)相反。傳統(tǒng)網(wǎng)站常常把導(dǎo)航放到頂端，而手機(jī)網(wǎng)站由于這種習(xí)慣帶來(lái)的影響，常常把主菜單放到底部。

    現(xiàn)在大部分是大屏幕的觸屏手機(jī)，而且拇指操作為主，所以在界面文字鏈接設(shè)計(jì)的時(shí)候需要考慮字體大小、字體行距等視覺(jué)

元素是否易于拇指操作。過(guò)小的文字或者行距會(huì)增加點(diǎn)擊的出錯(cuò)率，這也是影響用戶(hù)體驗(yàn)的重要因素。

    再次，人們已經(jīng)習(xí)慣了豎屏使用手機(jī)，這就確定了手機(jī)網(wǎng)站界面設(shè)計(jì)基調(diào)是豎幅排版，跟傳統(tǒng)電腦顯示屏幕橫向顯示有很大

區(qū)別。兩者界面設(shè)計(jì)時(shí)候都是同樣以寬度為主，自適應(yīng)高度。在傳統(tǒng)網(wǎng)站常見(jiàn)的兩欄、三欄等排版方式，在手機(jī)界面中幾乎看不

到，都是以單欄縱向結(jié)構(gòu)為主展示信息。手機(jī)界面設(shè)計(jì)如果進(jìn)行多欄展示文字內(nèi)容的話(huà)，并不利于閱讀體驗(yàn)。因此現(xiàn)在主流的做

法是單欄，自適應(yīng)高度，或“瀑布流”展示信息。