製作手機版網頁
減少文字輸入部份
允許行動上網使用者儲存輸入的帳號密碼資訊
輸入的區塊盡量加以放大
行動定位：大部分的智慧裝置都有GPS或是定位的機制，可以讓客戶主動找到您的位置
行動聯繫：如果客戶使用的是行動電話，可以立即發話；如果是平板電腦，亦可以使用簡訊或是e-Mail的方式傳遞訊息給客戶
網頁的檔案大小，越小越好！但是呈現的畫面也要注意美觀。
在CSS3以及HTML 5的進步下，手機版的網頁可以做到很多視覺效果。
直式的網頁設計是目前的行動版網頁主流
按鈕要大一點，手指才好按
透過Server端的程式來作判斷，網頁會自動切換為手機版本
ASPX版本判斷
protected void Page_Load(object sender, EventArgs e)
{
if (Request.Headers["user-agent"] != null && Request.Headers["user-agent"].ToLower().ToString().IndexOf("windows") != -1)
{
Response.Redirect("pc.aspx"); //電腦版
}
else
{
Response.Redirect("mobile.aspx"); //手機版
}
}
或是script判斷
<script type="text/javascript">
if ((navigator.userAgent.match(/iPhone/i)) ||
(navigator.userAgent.match(/Android/i)) ||
(navigator.userAgent.match(/iPod/i)))
(navigator.userAgent.match(/Windows Phone OS 7/i))
{
location.replace("mobile.aspx");
}
</script>
可以透過申請SDK的方式來測試，或使用各種不同的手機瀏覽模擬器，來驗證您的行動網頁是否符合手機與平板電腦平台
網頁版頭宣告
加在<html>上方
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
加在<head>~</head>之間
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
<部分內容取自網路>
發表評論
想要留言嗎？歡迎歡迎！