手機版網頁設計的7個原則

服務內容

手機上網不僅是可見的趨勢,更是以銳不可擋的數量在驚人成長,網頁設計者應該開始接觸手機版網頁設計。
手機網頁設計概念,與一般個人電腦使用的概念有些不同,因此,我們在這裡簡單的歸納出一些設計的原則:

 1. 簡化內容
一般的手機、平板電腦等行動裝置,不易容納下適合於個人電腦的龐大網頁資訊,因此手機行動網頁的首要重點,就是減少內容,不論是圖片、文字或是影音。請記住一個重點:只要將最重要的資訊放入行動版網頁,就是最主要的準則,重要性較低的、讀取需要時間的內容,則可以透過超連結,連回到正常的官方網站。
行動網站必須十分的重視內容簡化這一點,一個塞滿內容的行動網站無法獲得網路客戶的青睞。

2. 一欄捲動的最佳策略
大部分的行動裝置,畫面都不如桌上電腦那麼大,尤其是閱讀文字時更需要加以放大。即使智慧手機都具有網頁放大縮小功能,但是觀看起來較為麻煩。
因此設計行動網頁時,建議是能夠以滑動螢幕的方式閱讀網站,因為滑動網頁比起放大網頁觀看來得簡單多了。
 

3. 導覽功能大不同
手機網頁與跟一般的網頁不同的,在於當閱讀文章到最後時,要回到最前頭是麻煩的,因此設計網頁的企業,除了減少捲動畫面的機會外,也會加強導覽的功能,讓網頁變得更容易於行動裝置上閱讀。導覽設計的重點有:
只在首頁的部份加入搜尋的功能。
建立導覽功能鍵,其中以『回到首頁』、『回到上一頁』這兩個最為重要。
最後,『回到上一頁』的按鍵除了首頁以外,其餘的頁面都需要放置。

4. 減少文字輸入部份
手機大多沒有實體的鍵盤,或僅只有12鍵的電話輸入功能,因此輸入文字上會比起使用鍵盤麻煩得多。因此,減少使用者輸入文字的機會,例如:個人的帳號、密碼、搜尋內文、使用編輯器...等,都是行動網頁要盡力避免的。設計的重點如下:
允許行動上網使用者儲存輸入的帳號密碼資訊。
輸入的區塊盡量加以放大。
允許行動上網使用者,輸入簡易的密碼,例如PIN數字密碼。

5. 思考多種版本的手機網頁版本
手機的規格眾多,有的解析度為320*240,較新的則為800*480,而次世代的手機更有720P的解析度,因此行動網站如何滿足眾多的需求?
一般來說有兩種作法,一種是建立不同解析度的行動網站,由用戶於手機行動入口網頁自行選擇,以Facebook的例子來說,mobile.facebook.com是適用於大部分的智慧手機與平板電腦,而0.facebook.com則是用於非智慧手機或是網路連線速度極慢的區域。另一種做法則是透過手機的語法,例如CSS語法中的Viewpoint就能夠根據手機的解析度加以決定瀏覽畫面的寬度。



6. 觸控螢幕與非觸控螢幕設計
雖然今日觸碰型的智慧手機當道,但是仍有為數不少的傳統手機,沒有觸碰的介面,使用的是傳統的控制方向鍵做為導覽的工具。例如:減少畫面中超連結的數量,可以讓選擇連結的時候出現一些減少一些按鈕的動作,或是加大文字以減少誤擊的問題。
此外更重要的是滑鼠的原理跟觸碰介面的原理有很大的差異,因此行動版的網頁應該避免只有電腦滑鼠才能做到的功能,舉例來說:『下拉選單』的這一項功能,因為行動裝置沒有『滑鼠座標』的設計,所以無法觸發滑鼠移動過去才會顯示出來的選單。

7. 利用手機的天生優勢
手機有著許多傳統電腦所沒有擁有的優勢,其中最大的優勢就是『行動力』,因此手機版網頁應該要特別發揚這些特色,讓行動網頁具有一般網頁更多的優勢。舉例來說:
行動定位:大部分的智慧裝置都有GPS或是定位的機制,可以讓客戶主動找到您的位置。
行動聯繫:如果客戶使用的是行動電話,可以立即發話;如果是平板電腦,亦可以使用簡訊或是e-Mail的方式傳遞訊息給客戶。
鄰近地點:如果您的事業有很多據點,請告訴您的客戶,在他附近有哪一些地點是便於他能夠抵達的。
 以創新的方式來輸入訊息,既有趣又實用。 行動條碼 QR Code 就是這樣的一個例子,也應該納入行動網頁的設計元素在內。


            


QR Live 三合一網頁設計,提供您『網頁』『手機網頁』及『行動條碼 QR Code』同步形成,讓您的企業、服務...更有型。

地址:台中市豐原區豐年路109巷43號
客服專線:04-25208628   E-Mail:qrlive.qrcode@gmail.com

果菜清運服務
免費註冊

Y紗 小棉簽 詢價費用:請問這兩樣產品有嗎多少錢怎麼算

愛文芒果乾詢價,以下請報價:您好,想詢問愛文芒果乾10斤(仁德自取)價格是多少呢?製作烘焙產品用,謝謝您。

  • 星空房怎麼賣?台灣:星空房怎麼賣?台灣的費用是多少

    詢價 不透光貼紙:詢價 不透光貼紙 鐵門90x210

  • 國際獸醫防疫人才培訓中心暨獸醫教學醫院大樓新建工程:國際獸醫防疫人才培訓中心暨獸醫教學醫院大樓新建工程

    RTL8211FD-CG:RTL8211FD-CG 需求數量:490PCS D/C:?

    詢價 t-shirt訂製:您好,本會預計訂製170件t-shirt供志工穿著, 材質需求:透氣排汗。 印刷: 需印製本會logo 顏色:藏青 能否提供20支棉及另外2款材質供挑選確認 方便的話可以加我的line聯繫 期望等到您的回覆

    關於自動化設備的諮詢:您好,我對貴公司的自動化設備很感興趣,想請問一些問題: 1. 我要問洗蛋機的部分 2. 我場內比較小 有比較小台的規格嗎?

    請問貴公司的「寶芝林水果酵素」500cc-瓶,12瓶-箱:上述產品是否還有存貨,可以私人整箱購買嗎?可否宅配。 因為以前購買的商品現在吃完了,我個人因為身心障礙,行動不便,我記得上次我購買一箱,是貴公司送貨到府。因為該產品對個人的消化系統有明顯的改善效益,因此洽詢該產品現況,謝謝您。

    新竹到松山機場接送詢價:您好,我想請教一下,我7/3凌晨3點半左右在新竹縣湖口鄉中平路這搭車,前往松山機場,回程是7/8中午大概一點半左右,這樣來回的話大概多少錢呢?有三個行李箱28吋左右的。兩大兩小,小的不用安全座椅。

    電腦重灌及電腦檢測:因為之前 office軟體認證過期,朋友幫我重灌認證,但由於是用大陸的並且當時有暫時關掉防毒系統,之後電腦就像被駭客入侵一樣,突然像遠端被切換,然後我打在world檔的文字,還在沒有被觸碰鍵盤的情況下,由下而上被刪除,所以想要檢測(1)電腦是否被駭客入侵,(2)電腦重灌 win10系統 以及 autocad illustrstor photoshop 3dmax sketchup 等繪圖軟體。

    立頓系列沖泡飲品:立頓即溶沖泡奶茶粉(減糖版本) 詢問箱購批發價格及多箱數價格 希望能提供箱數區間價位 1箱、5箱、10箱以上等價位

    店家長期配合是否有進貨價:拋棄式棉巾、洗臉巾

    想了解大尺碼批發 請協助報價:想了解大尺碼批發 請協助報價

    2025 韓國旅遊:請問6-8人小團,1月寒假,韓國首爾4日,含滑雪,麗寶,宮殿韓服體驗,價位多少

    桌上電子秤 詢價:您好 詢問桌上電子秤 價格 請與我連繫謝謝!

    第四台新申請及安裝:第四台新申請及安裝 社區主委告知是本大樓是和萬象合作, 地址:台北市大安區瑞安街262-2號1F 請先以E-MAIL報價, 謝謝

    關於日式瑪斯卡邦乾酪的詢價:您好,我對貴公司的日式瑪斯卡邦乾酪產品感興趣,希望能夠獲得以下信息: 1. 請問日式瑪斯卡邦乾酪的價格 2. 請問出貨金額或數量

    雨果889請報價!!!:請問雨果889多少 雨果889請報價!!!

    我想問DB-624管柱:我想問貴公司DB-624管柱規格及價錢

    關鍵字:網頁設計,手機程式,電子商務,網站架設,行動條碼,QR,Code

    QRLive三合一網頁設計

    1. 統一編號12884456
    2. 更多資訊QRLive三合一網頁設計
    網頁更新日:

    相關服務

    1. 你要的其實不是網頁,而是網路行銷!
      做網站不是要美觀,您要的是網路行銷!網頁設計達到行銷目的?我們提供專業解答!
    2. SEO最常見的10個問題
      一般的企業網站需要針對網站排名行銷,洽詢 SEO 公司後最常與直接問的問題,就是做 SEO
    3. 網路行銷服務
      當您的網站建置完成上線後,當務之急便是至各大搜尋引擎登錄您的網站資料,讓搜尋網站能將您的網
    4. SEO最常見的10個問題
      一般的企業網站需要針對網站排名行銷,洽詢 SEO 公司後最常與直接問的問題,就是做 SEO
    5. 專業網站製作、網站關鍵字搜尋
      公司概要北輪在台灣已有21年歷史、所有有關於電腦之業務皆為本公司服務項目。 主要業

    友站分享

    寶允在工程有限公司
    杰泉有限公司
    微影科技有限公司