當前位置:才華齋>範例>生活經驗>

平板電腦友好網站的設計方法

生活經驗 閱讀(3.15W)

隨著以蘋果iPad為代表的平板電腦風暴越演越烈,許多行業都因此發生了重大變化。根據國際資料集團預計20xx年,移動裝置會取代個人電腦的霸主地位,成為接入網路的首選裝置。對於網站站長而言,一個友好的介面對平板電腦使用者的重要性可想而知,因此,站長們應該儘快更新自己的網站。為此,國外年輕企業家Ryan Taft在設計網站1stweb上,撰文闡述了在設計對平板電腦友好的網站時的注意事項。

平板電腦友好網站的設計方法

站長之家()4月23日編譯:你的網站是否已準備好應對平板電腦革命了?除非你是末日準備族的一員,那麼在過去幾周就應該已經為此做好準備了。iPad剛剛投放市場不久,人們就開始為其瘋狂。在諸多的平板電腦中,iPad只用了幾年時間就創造瞭如此巨大的平板風潮。這一點是網站站長需要留心的。在平板電腦革命的席捲之下,許多站長已經重新思考網站的設計和佈局。

在過去,建立一個對臺式機和膝上型電腦介面友好的網站並不複雜。而今智慧手機的出現改變了方方面面。許多網站站長都為此準備了網站的移動版以供手機使用者訪問。又到了更新網站的時候了,不過這次是為平板電腦使用者。接下來我們會為大家闡述一個網站的友好介面對平板電腦重要性,設計此類網站的注意事項,並舉例說明一些公司是如何做到這點的,最後為大家提供一些有用的工具和資源。

友好的網站介面對平板電腦的重要性

國際資料集團(IDC)預計20xx年,移動裝置會取代個人電腦的霸主地位,成為接入網路的首選裝置。隨著20xx年的日益臨近,這一估計也在逐步實現。無論現在還是以後,這樣的趨勢處於上升態勢。你有多少次用智慧手機訪問網站時只意識到了它的設計繁重,而沒意識到網站導航不方便?你在網站呆得時間有多長?你再次訪問的頻率多高?同樣的道理,現在再想想,如果平板電腦使用者訪問你的網站時發現你的介面對平板電腦並不友好,他們會怎麼做?隨著更多的消費者用平板電腦上網,當務之急就是儘快更新你的網站。

建立對平板電腦友好的網站的注意事項

既然你意識到建立一個對平板電腦友好的網站的迫切性,你就要了解其中的注意事項。我們先從設計中不能做的部分說起。

如果你的網站中包含了下列內容,那麼你的網站還為此做好準備:

· 不要在你的網站中新增Flash,這樣會導致網站異常。

· 兩個點選區域(連結等)之間不要隔得太近。要保證網頁的導航易於發現,容易操作。

· 過多的多媒體內容會打亂網站排版。圖片和視訊對網站內容是不錯的提升,但是每個頁面都新增過多這些元素會導致網站排版雜亂,甚至會引發頁面載入出錯。

為了保證網站介面對平板電腦友好,下面的事你可以做:

· 用平板電腦訪問你目前的網站,看看哪裡會導致頁面掛起,哪些地方做得好,哪些地方不好以及整體體驗感。將這些內容整理做個記錄,開展頭腦風暴想想如何改進網站的功能更適合平板電腦,同時保留膝上型電腦和臺式電腦訪問時原有的功能。

· 新增更多的“移動”內容和資訊。便攜性是平板電腦最大的`優點之一。平板電腦使用者經常處於移動狀態,這就意味著他們傾向於尋找與移動狀態相關的內容。你可以將你的聯絡資訊與Google地圖進行聯絡起來。

· 確保你的網站字型在平板電腦上能清楚顯示,由於平板電腦的顯示屏較小,並且發光強度大,這會使得某些網站內容難以看清楚。通常,膝上型電腦和臺式電腦用於室內,並且照明條件也比較固定。再次強調,平板電腦的移動性意味著光線變化頻繁,這也在考驗移動網站的各方面設計細節。因此,你要對網站的字型樣式,顏色以及大小進行更新,適應使用者的需求。

通過上述步驟,你可以開始對你的網站進行更新了。

優秀案例介紹.

2年之內,蘋果的iPad的出現讓眾多行業發生了翻天覆地的變化。越來越多的人用iPad等平板電腦上網,越來越多的公司使用iPad做記錄。下面列舉了幾家大公司為了使網站對平板電腦友好而做出的變革。

· —20xx年,亞馬遜釋出了專為iPad版設計的Windowshop(譯者注:其實是對亞馬遜網站的重新排版),整個網站介面也煥然一新。這一舉措大大推動了移動行業的發展。PCWorld的編輯Brennon Slattery評價說,“亞馬遜網站的全新外觀和體驗讓平板電腦使用者激動”。該網站存在大量的空白區域,左邊混亂的工具欄消失了,搜尋欄能進行放大,方便使用者在觸控式螢幕上輸入內容,產品圖片也是非常易點選的圖示構成。

· Utah Government—去年八月,美國猶他州政府更新了政府網站,使得平板電腦與網站互動更容易。

· Nike—Nike的網站則充分吸取了平板電腦介面的優勢,也是最能體現對平板電腦友好的例子之一。

隨著新的平板電腦趨勢越來越成熟。我們看到越來越多的公司開始在原有網站的基礎上進行大翻新,確保平板電腦使用者能更好地與網站進行互動。

對平板電腦友好的WordPress主題

如果你是使用WordPress建站,你就應該非常熟悉WordPress的主題。WordPress 有許多的可供選擇主題,既有免費的,也有付費的。也就是說,從今天起,你不再需要在你的膝上型電腦和平板電腦上安裝一大堆WordPress主題來裝飾你的網站。如果你正在使用WordPress,又想安裝一個適合平板電腦訪問的主題,下面的主題你值得擁有:

·Onswipe—三分鐘讓你的部落格在平板電腦瀏覽器上顯示更完美。

·MobilePRO—移動裝置專用的精美WordPress主題,不過它在任何電腦顯示器上的顯示都不錯。

·Mobility—這是一款適用於iPad的WordPress主題,使用者可以用手指進行滑動,並且可自定義拖曳對相簿進行管理。

有用的工具和資源

將網站轉換成平板電腦友好的環境宜早不宜遲,動作慢了,你就會和競爭對手形成差距。如果你想利用平板電腦風暴所帶來的好處,並且建立一個對平板電腦友好的網站,最後我們為大家送上一些有用的工具和資源。

·Pressly—當在平板電腦瀏覽器上訪問時,它會通過自有的原生應用自動將線上內容渲染成漂亮的平板電腦佈局。

· 對每一個期望學習到更多未來如何適應平板電腦電子商務的人來說,我強烈推薦他們去看看Zmags最近釋出的電子書《移動和平板電腦電子商務:大家都準備好了嗎?》。Todd Anglin如果你希望你的網站介面對平板電腦更友好,學學HTML5是再好不過的事了。 正如Todd Anglin曾說:“事實上,所有現代移動裝置的瀏覽器都應該更廣泛地支援由HTML技術建立的諸如視訊、定位、線下應用、本地儲存以及CSS樣式,讓他們成為大膽開發開發HTML5的完美目標”。

既然你瞭解了網站對平板電腦友好的重要性。在接下來的半年時間裡,你就應該好好思考一下你應該優先做些什麼。至少你該在平板電腦上訪問你的網站,看看具體情況以及是否方便導航。