網(wǎng)站設(shè)計(jì)師應(yīng)忘記桌面：以移動(dòng)設(shè)備為主

申請(qǐng)免費(fèi)試用、咨詢電話：400-8352-114

　　親身體驗(yàn)

　　每天早晨，只要我起得早，都會(huì)拿起iPad瀏覽一下早間的科技頭條。這似乎很平常，但我經(jīng)常瀏覽的網(wǎng)站卻很不給力。拿TechCrunch來(lái)說(shuō)，這家科技博客就經(jīng)常導(dǎo)致我的平板電腦抓狂。

　　首先，加載速度慢。整個(gè)頁(yè)面元素的加載順序一點(diǎn)都不合理——首先顯示正文，然后是頂部和右側(cè)導(dǎo)航欄，再艱難地等待幾秒鐘后，標(biāo)題才會(huì)出現(xiàn)。到這時(shí)，我已經(jīng)郁悶至極了。但畢竟文章出來(lái)了，所以，我還是平復(fù)了一下心情，開(kāi)始閱讀。但是，等到頁(yè)面加載完成后，過(guò)了大概半秒鐘，文章的正文和標(biāo)題突然消失了。什么？！為什么會(huì)先出現(xiàn)再消失？

　　如果你足夠幸運(yùn)，這種情況只會(huì)持續(xù)一秒，便會(huì)恢復(fù)正常。于是，你認(rèn)為可能是系統(tǒng)有漏洞，便原諒了TechCrunch的設(shè)計(jì)師——畢竟，他們開(kāi)發(fā)網(wǎng)站時(shí)，針對(duì)的是傳統(tǒng)PC，而你使用的卻是古怪的平板電腦。

　　但有些時(shí)候，你就沒(méi)有這么幸運(yùn)了。文本會(huì)反復(fù)閃爍，然后，整個(gè)網(wǎng)站都不見(jiàn)了，只剩下TechCrunch iPad應(yīng)用的廣告。為了閱讀文章，你不得不點(diǎn)擊一個(gè)小得可憐的鏈接來(lái)關(guān)閉廣告。到這時(shí)，為了讀這篇文章，你已經(jīng)等待了將近10秒鐘，整個(gè)人都要?dú)庹耍薏荒苡肋h(yuǎn)不看TechCrunch。

　　但你不能。如果因?yàn)槟硞€(gè)網(wǎng)站在iPad上的顯示效果不佳而拋棄它，那你恐怕要拋棄半個(gè)互聯(lián)網(wǎng)。TechCrunch的移動(dòng)體驗(yàn)的確不好，但還算不上糟糕透頂。從《紐約時(shí)報(bào)》到《紐約客》，從谷歌(微博)新聞到Salon，甚至包括Slate，很多新聞網(wǎng)站在平板電腦上的顯示效果都很糟糕。事實(shí)上，不只是新聞網(wǎng)站，就連亞馬遜(微博)等大牌互聯(lián)網(wǎng)企業(yè)在iPad上的顯示效果同樣不好。

　　調(diào)整思維

　　問(wèn)題在于，很多網(wǎng)站的內(nèi)容太過(guò)擁擠，不適合平板電腦的顯示屏。當(dāng)你在iPad上加載一個(gè)網(wǎng)站時(shí)，經(jīng)常會(huì)看到文本、圖片和視頻摻雜在一起。這些網(wǎng)站的代碼運(yùn)行速度太慢、漏洞太多，不適合小尺寸設(shè)備；上面的按鈕和鏈接太小，不適合手指點(diǎn)擊；網(wǎng)站圖片在平板電腦的高分屏上顯示效果也不怎么樣。

　　關(guān)鍵問(wèn)題在于，設(shè)計(jì)師并未針對(duì)平板電腦做出太多設(shè)計(jì)——他們或許針對(duì)iPad對(duì)頁(yè)面做出了細(xì)微調(diào)整，但這通常只是一種補(bǔ)救，主要還是針對(duì)筆記本和臺(tái)式機(jī)設(shè)計(jì)網(wǎng)站。

　　該換換思維了。iPad已經(jīng)面市3年，它的崛起似乎不可阻擋。而且，iPad并不孤獨(dú)——谷歌Nexus 7、亞馬遜Kindle Fire、微軟(微博)Surface很快都將貢獻(xiàn)巨大的流量?；ヂ?lián)網(wǎng)需要適應(yīng)這些設(shè)備。設(shè)計(jì)師創(chuàng)建網(wǎng)站時(shí)不應(yīng)僅僅兼容平板電腦，而應(yīng)以平板電腦為主。事實(shí)上，他們甚至應(yīng)該首先考慮平板電腦——先針對(duì)7英寸和9英寸的屏幕設(shè)計(jì)頁(yè)面，之后再針對(duì)桌面瀏覽器調(diào)整。

　　為何要以平板電腦為主？不僅是因?yàn)閕Pad及其同類(lèi)產(chǎn)品正在迅速成為主要的上網(wǎng)設(shè)備。(根據(jù)多方數(shù)據(jù)，移動(dòng)設(shè)備已經(jīng)占到10%以上的互聯(lián)網(wǎng)流量，這一數(shù)字還在繼續(xù)增長(zhǎng)。)還因?yàn)槠桨咫娔X的種種限制——小尺寸屏幕以及相對(duì)較小的帶寬和處理能力——可以提升桌面設(shè)備中的網(wǎng)站效果。針對(duì)移動(dòng)設(shè)備優(yōu)化的網(wǎng)站通常更快、更漂亮，比桌面設(shè)備更容易導(dǎo)航。如果設(shè)計(jì)師首先為平板電腦設(shè)計(jì)網(wǎng)站，整個(gè)互聯(lián)網(wǎng)都將變得更好。

　　統(tǒng)一設(shè)計(jì)

　　需要強(qiáng)調(diào)的是，我不是呼吁網(wǎng)站在桌面版本之外，再創(chuàng)建一個(gè)針對(duì)平板電腦或智能手機(jī)優(yōu)化的版本。很多網(wǎng)站都采取這種措施，但由于很多公司都沒(méi)有足夠的資源維護(hù)兩套不同的設(shè)計(jì)，他們的平板電腦和智能手機(jī)版通常表現(xiàn)糟糕。這些移動(dòng)版的網(wǎng)站無(wú)法提供與桌面版完全相同的功能——例如，Slate的智能手機(jī)版就無(wú)法加載讀者評(píng)論——而且當(dāng)設(shè)計(jì)師對(duì)網(wǎng)站進(jìn)行升級(jí)時(shí)，通常只會(huì)優(yōu)先考慮桌面版。

　　這完全可以理解：對(duì)多數(shù)網(wǎng)站而言，桌面貢獻(xiàn)了大量流量和廣告收入。另外，移動(dòng)網(wǎng)站仍然較新，而且變數(shù)頗多——有很多采用不同技術(shù)的智能手機(jī)和平板電腦，導(dǎo)致設(shè)計(jì)師還不習(xí)慣為它們開(kāi)發(fā)有吸引力的網(wǎng)站。

　　除此之外，還要考慮錢(qián)的因素。整個(gè)網(wǎng)絡(luò)廣告行業(yè)都是圍繞桌面瀏覽器建立的，目前最具活力的互動(dòng)廣告還無(wú)法在平板電腦上完美地展示。

　　出于以上原因，網(wǎng)絡(luò)公司應(yīng)當(dāng)集中精力打造統(tǒng)一的體驗(yàn)，兼容所有電子設(shè)備。在理想狀況下，移動(dòng)網(wǎng)站不會(huì)成為桌面網(wǎng)站的分支——桌面網(wǎng)站將與移動(dòng)網(wǎng)站一樣：簡(jiǎn)潔、快速，在所有設(shè)備上的效果都很好。

　　踐行理念

　　這個(gè)想法并不激進(jìn)。很多網(wǎng)站設(shè)計(jì)師都在踐行這一理念——詹森·寇特可(Jason Kottke)和約翰·克虜伯(John Cruber)的博客都是針對(duì)桌面瀏覽器設(shè)計(jì)的，但由于加載速度快，而且沒(méi)有充斥太多雜亂的元素，看起來(lái)就像是專(zhuān)為移動(dòng)設(shè)備設(shè)計(jì)的。

　　正如BuzzFeed的約翰·赫曼(John Herrman)所說(shuō)，一些新的創(chuàng)業(yè)網(wǎng)站已經(jīng)開(kāi)始模仿這些極簡(jiǎn)主義的風(fēng)格，包括博客平臺(tái)Svbtle和Medium、討論網(wǎng)站Branch和社交網(wǎng)站App.net。這些網(wǎng)站設(shè)計(jì)之初似乎都是優(yōu)先考慮iPad，然后再移植到桌面上。不僅如此，這些網(wǎng)站的外觀都很漂亮，導(dǎo)航也很方便。這絕非巧合。

　　當(dāng)然，對(duì)于資金充裕的創(chuàng)業(yè)公司而言，很容易以移動(dòng)網(wǎng)絡(luò)為主。但對(duì)于已經(jīng)建立業(yè)務(wù)基礎(chǔ)的網(wǎng)站而言，由于十分依賴(lài)廣告，便很難直接投入移動(dòng)設(shè)備的懷抱。但他們應(yīng)當(dāng)一試。今后幾個(gè)月間，移動(dòng)瀏覽器的流量將會(huì)飆升，尤其是當(dāng)蘋(píng)果推出價(jià)格更低、尺寸更小的iPad，而亞馬遜也升級(jí)Kindle Fire后。

　　如今，用平板電腦上網(wǎng)沖浪，隨時(shí)都會(huì)碰到緩慢而充滿漏洞的網(wǎng)站。但很快，讀者就不會(huì)繼續(xù)忍受這種情況。如果你的頁(yè)面要花很長(zhǎng)時(shí)間加載，如果你的圖片不夠清晰，如果你的鏈接不容易點(diǎn)擊，如果你不斷拋出iPad應(yīng)用的廣告，我就會(huì)用平板電腦訪問(wèn)其他網(wǎng)站——訪問(wèn)那些能真正重視它的網(wǎng)站。