close

到目前為止,不管是做SEO,還是網站推廣網路行銷,在做網頁設計時,大都以傳統的網站網頁為基處礎。雖然,現在行動上網得使用量還比不上傳統的上網方式,但日後應該會慢慢的形成一股風潮。


所以,在智慧手機日益普遍的今天,網頁設計必須開始考慮到小螢幕智慧手機的要求。專門開發手機應用自然是一個不錯的方案,但是畢竟耗費精力,況且還需要針對不同設備進行開發和維護。


開發行動版網頁是另一個不錯的選擇。這件事情看起來簡單,卻也有許多細節和門道。Useit 網站最近的一篇文章對手機版網頁設計的探討值得參考。


這篇文章以報導韓國流行明星資訊的網站 allkpop.com 為例。Allkpop 的手機版網頁是這樣的:


開發行動版網頁的技巧


AllKpop 做對了好幾件事情


一是內容,Useit 的調查認為手機上的殺手級應用是消耗時間


二是專門的行動版網頁,即使有 Opera 這樣的瀏覽器能夠為手機優化網頁,也不如專門的行動版網頁體驗更好。


三是自動探測,伺服器自動探測使用者設備,提供特定頁面,而不是為行動網頁設置單獨的位址。


四是資訊可點擊區域比較大。


五是標題中關鍵字在前端,因為標題比較長,這樣做能突出重點。


那麼,這個網頁設計有沒有問題呢?以我一個外行人的眼光看,也能發現一些小問題。首先是對空間的利用不好,日期擠佔了大部分空間而且是重複出現;其次就是標題下面的分類和標籤,字很小,而且對讀者意義不大。


我們看看 Useit 對網頁是如何進行重新設計的:


開發行動版網頁的技巧


首先突出的一點是圖片,讀圖比讀文字更直觀,尤其是對於一個報導明星新聞的網站。其次是信息量加大:刪除了無用的分類和標籤,以關鍵語句為讀者展現文章要點,瀏覽更高效。


Useit 對網頁做出的其它改進還包括:


更大的觸控空間:原來的文章區塊可觸控部分比較多,比如標題右上角的下拉三角,觸控範圍較小,可用性低。改進後整個文章色塊都是觸控區域,更加適合手持設備。


文章區塊間的距離更緊湊:讀者無需下拉也能完整流覽最底部文章區塊。


完整標題:這樣能夠展現更多資訊以供讀者選擇。


突出內容:標題中每個明星的姓名都加重突出。


日期做為分界線:節省螢幕空間,更有條理的展示內容。


改進頂部巡覽列:原來的巡覽列中,分類和搜索都在右上角,容易誤觸,改進後的頁面裡分類與搜索拉開了距離,而且分類加上了文字描述,更易發現。


移動設備由於螢幕較小,對於設計的要求往往更高,所謂細微之處見技巧,這個案例足以證明。


設計上的受限越多,你越需要改進使用者介面,以提供最優的可用性。移動設備是一個極為受限的設計問題。


總之,不管是做SEO,還是網站推廣、網路行銷,從現在開始就要好好瞭解關於行動版網頁設計。


 

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 seohouse 的頭像
    seohouse

    SeoHouse

    seohouse 發表在 痞客邦 留言(0) 人氣()