網路城邦
上一篇 回創作列表 下一篇   字體:
一起來了解設計網頁版手機的注意事項
2017/07/20 16:42:30瀏覽96|回應0|推薦0

手機版網站是個趨勢,而且是只會朝著前端邁進的時代趨勢。不過製作的方式與一般傳統的 網頁設計 有很大的差異,而且也跟企業的產業有很大的關係,以下整理出7點注意事項,希望對於設計行動網頁者可以提供更多的概念。

 

1. 商業的目的為何

 

手機網站製作目的為何?是希望可以品牌形象優先、促進企業服務商機為優先、還是訊息傳遞為優先?因為行動網頁的版面,比起一般的網頁更有限,因此優先順序很重要。

 

不同的目的會有取捨的問題,經過企業的內部討論,往往可以得到設計上的共識。

 

2. 響應式網頁設計(自適性網頁設計、RWD)

 

回饋式的模式被用於商業與教育界一段時間,簡單來說,具有回饋能力的團體,能夠根據團體的需求進行調整,達到最佳的效能表現。

 

在手機網頁設計的領域,我們對於響應式網頁設計(自適性網頁設計、RWD)定義為:不論於任何一種裝置上觀看,例如:不同的解析度、不同的瀏覽器、不同的觀看方向...等,都能夠得到正確的解析度,這一點有許多網頁技術都可以做得到,例如CSS與HTML 5都有對於手機網頁的觀看方式加以優化。

 

3. 簡單是好事,但視覺表現不打折

 

就跟傳統的網頁設計一樣,網頁的檔案大小,越小越好,到了手機版的行動網站,這個更是重要的關鍵!因為手機的速度不若桌上電腦或筆記電腦,因此設計師都十分重視網頁檔案的大小。

 

檔案大小的情況也反應到了內容,因為簡單的設計往往可以減少網頁的檔案,因此簡單、精簡的內容一直是手機網頁的設計圭臬。不過這不表示簡單的網站就得十分的醜陋,因為現在的CSS3以及HTML 5的進步下,手機版的網頁可以具有動畫呈現、陰影、漸層等視覺效果,在不增加手機運算負擔與檔案大小的情況下,這都是可行的設計技術。

 

4. 單行式的手機網站是當今最好的設計

 

雖然今日的手機尺寸出現了很多變化,但基本上手機的最常用瀏覽模式仍以直立式的為主,因此網頁設計者,應該清楚直式的網頁設計是目前的行動版網頁主流。此外,也又不少手機網站擅長使用書籤的技巧,讓直立式的手機版網站,可以藉由書籤的切換達到更多的功能,也是值得設計者參考與學習。

 

5. 垂直堆疊的選單設計

 

行列式的選單,按下後會將子項目展延,再按一下則會將目錄收回,這樣的垂直堆疊選單的網頁設計看起來十分的老套,但卻是不少大企業與網路使用族群的最愛。大家可以到以美國大聯盟職棒(mlb.com)的手機網站,看看堆疊選單的網站,是如此的便利與易用。

 

6. 加入互動效果

 

手機使用者往往希望可以看到比桌上電腦、筆記電腦更多的互動視覺效果,讓他們可以在有限的畫面上可以看到目前網頁的變化。舉例來說:按下按鈕的反白效果,或是滑動的視覺頁面都是非常不錯的方式。

 

此外,也可以設計讀取網頁的畫面,這對於頻寬、速度受限的手機使用者來說,是十分有幫助的設計。

 

7. 測試你的手機網站

 

除了透過同事的手機設備加以測試外,比較進階的設計師可以透過申請SDK的方式來測試,或使用各種不同的手機瀏覽模擬器,來驗證您的行動網頁是否符合手機與平板電腦平台。現在很多瀏覽器推出了模擬器的功能,可以省下您不少時間。

 

 

 

參考文獻:

1.位元文化,2002,XML 技術實務,台北:文魁資訊股份有限公司。

2.林宥吟,2002,延伸性企業報告語言之產業應用-以資產管理產業為例,私立中原大學會計系碩士班未出版論文。

3.李果益,2001,JAVA 技術手冊,台北:美商歐萊禮股份有限公司台灣分公司。

 

資料來源:mobiweb

http://www.piece2ec.com.tw/News.asp?Id=2190

( 知識學習檔案分享 )
回應 推薦文章 列印 加入我的文摘
上一篇 回創作列表 下一篇

引用
引用網址:https://classic-blog.udn.com/article/trackback.jsp?uid=piece2ec&aid=106813507