手机版网站起码要实现一些基本的功能吧:

1.页面的适用性问题。对于移动终端,有不一样的分辨率与屏幕尺寸,如果还像电脑端的设计还限制网页的宽度为1003px或其他像素值,字体大小还用12px或14px,那么,不一样的终端的效果差别会很大。所以这里,最好让网页的宽度自适应屏幕,还好,w3c在设计html的时候为我们考虑了这一点,只需一句话,就可以搞定,就是加上

<meta name="viewport" content="width=device-width"/> 

对于字体的话,我们就用em或ex为单位就好 
2.版本制作问题。移动页面往往针对不同的手机设置不同的版本,一般有精简版,标准版,3G版,触屏版,智能手机版等等,这些除了在页面设计上有不同外,页面语言也会不同的。精简版采用wap 1.0 的wml脚本编写,这个通用性以前很强,很多国产手机都支持这个语言的,但这个语言是很精简的。标准版的一般可以采用wap 2.0技术,对应的脚本语言是xhtml mp(xhtml mobile profile),这个语言是xhtml的子集,这个并且支持大部分的css,基本上和电脑版的差不多,但一般不能用js,这是考虑到这些手机是不支持js的。对于智能手机版,由于现在的智能手机都支持js,这个版本的制作上就简单多了,不过,又由于大部分智能手机(基本上除去塞班手机,包括Android,ios,wp7等)都支持Html5,因此,智能手版可以采用html5来制作。 
3.版本控制问题。可能这部分是比较不好解决的,怎么智能判断手机的最佳版本并跳转,可以从这几个方面考虑。一方面,可以想办法得到手机的操作系统,比如,Android的,ios的,就可以跳转到html5版了,windows系统,毫无疑问电脑版,获得手机系统,可能通过得到手机型号,现在的方法是通过浏览器的UA(user agent),获得手机的一些信息,简单一点的,直接可以通过UA判断手机的制造产商。要想获得更多的信息,就得有一个数据库,因为不同手机型号会有不一样的UA信息,世界上的手机有很多,自己要想做一个这样的数据库还是很难的,不过,已经有人为我们做好了这样的数据库,或者更方便的,做好了一个识别手机适用最佳版本的函数库,这里我推荐用Wurfl。另一方面,可以通过页面的脚本来判断浏览器对js和html5的支持,代码如下

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width"/>
<title>版本控制</title>
<script type="text/javascript">
window.onload = function(){  //检测是否支持js  try{//检测是否支持html5  document.getElementById("c").getContext("2d");  document.location = '支持html5版的链接';  }catch(e){//否则跳到支持js版  document.location = '支持js版';  }
};
</script>
</head>  <body>
<canvas id='c'></canvas>
普通版
</body>
</html>  

如果你仅仅想开发一个版本,只是判断一下是不是移动客户端,这里引用一段discuz! x2的代码

<?php
function checkmobile() {  global $_G;  $mobile = array();  static $mobilebrowser_list =array('iphone', 'android', 'phone', 'mobile', 'wap', 'netfront', 'java', 'opera mobi', 'opera mini',  'ucweb', 'windows ce', 'symbian', 'series', 'webos', 'sony', 'blackberry', 'dopod', 'nokia', 'samsung',  'palmsource', 'xda', 'pieplus', 'meizu', 'midp', 'cldc', 'motorola', 'foma', 'docomo', 'up.browser',  'up.link', 'blazer', 'helio', 'hosin', 'huawei', 'novarra', 'coolpad', 'webos', 'techfaith', 'palmsource',  'alcatel', 'amoi', 'ktouch', 'nexian', 'ericsson', 'philips', 'sagem', 'wellcom', 'bunjalloo', 'maui', 'smartphone',  'iemobile', 'spice', 'bird', 'zte-', 'longcos', 'pantech', 'gionee', 'portalmmm', 'jig browser', 'hiptop',  'benq', 'haier', '^lct', '320x320', '240x320', '176x220');  $useragent = strtolower($_SERVER['HTTP_USER_AGENT']);  if(($v = dstrpos($useragent, $mobilebrowser_list, true))) {  $_G['mobile'] = $v;  return true;  }  $brower = array('mozilla', 'chrome', 'safari', 'opera', 'm3gate', 'winwap', 'openwave', 'myop');  if(dstrpos($useragent, $brower)) return false;  $_G['mobile'] = 'unknown';  if($_GET['mobile'] === 'yes') {  return true;  } else {  return false;  }
}  function dstrpos($string, &$arr, $returnvalue = false) {  if(emptyempty($string)) return false;  foreach((array)$arr as $v) {  if(strpos($string, $v) !== false) {  $return = $returnvalue ? $v : true;  return $return;  }  }  return false;
}
var_dump(checkmobile());//如果是移动端返回true,否则false  

4.手机版本的大小问题。一般来说,对于精简版和普通版的手机网页,我们是做得越精简越好,能省的代码最好省去,毕竟现在手机流量对用户来说还是很宝贵的。比如元素命名,一般页面少的话,命名越短越好,css最好写在一行。css中,有些元素是继承父类的样式的,不用重复定义,善用默认值。 
5.浏览器缓存。如果再更新不快的情况下,最好开启浏览器缓存

手机WAP网站 相关相关推荐

  1. 手机wap网站建置方案

    开发案例 0 引言 手机的功能从简单的语音通信和文字短信, 发展 到现在的彩信.多媒体.无线上网??用户能够通过 手机来实现各种交换和获取丰富的信息资源.WAP (Wireless Applicati ...

  2. 手机wap网站建设的方法和技巧

    随着互联网技术的不断进步,越来越多的运营商对于手机wap网站的建设有了更多的投入,手机wap网站的建设和开发要根据网站的特点和经营范围来进行设计和建设,这样才可以提升手机wap网站建设的效果.现在智能 ...

  3. 仿eplie触屏版html5响应式手机wap网站模板

    简介: 一款仿eplie触屏版手机wap网站模板,html5响应式多终端,满屏显示. 12个页面,分表为:首页.帮助列表.留言板.图文列表.404模板.表格列表.提示框UI.几种布局的图片列表. 网盘 ...

  4. 手机wap网站开发注意事项

    开发过一个简单的wap端应用网站,其间遇到过一些注意的事项,总结一下: 1,请求路径应该全部改为小写.因为有些低端手机不区分大小写的,所以当遇到该类手机时会返回404错误,找不到请求路径. 2,所有请 ...

  5. 10款手机网页模板_手机wap网站模板_html5手机网站模板源码下载(三)

    通用的物流快递小程序模板 净水器物联网小程序模板 积分抽奖游戏小程序模板 谁是杀手游戏小程序模板 品牌车型介绍资讯小程序模板 宝可梦宠物图鉴小程序模板 通用的游戏资讯小程序模板 领养宠物游戏小程序模板 ...

  6. 10款手机网页模板_手机wap网站模板_html5手机网站模板源码下载(一)

    商家外卖点餐小程序模板 二维码生成工具小程序模板 微信在线点餐平台手机模板 购物商圈app小程序模板 公司年会签到小程序模板 生鲜超市外卖小程序模板 仿拉钩招聘app小程序模板 共享单车微信小程序模板 ...

  7. 怎么开通手机信息服务器,如何用手机建立网站

    如何用手机建立网站 内容精选 换一换 本文以营销版网站配置为例,介绍如何通过云速建站服务快速创建一个网站.云速建站操作简单方便,只需四步,就可以轻松创建一个网站.建站流程开通网站:包括购买营销版站点. ...

  8. springboot手机推荐网站 毕业设计-附源码052329

    摘 要 随着社会的发展,计算机的优势和普及使得手机推荐网站的开发成为必需.手机推荐网站主要是借助计算机,通过对首页.手机问答.公告消息.手机资讯.手机测评.我的.跳转到后台等信息进行管理.减少管理员的 ...

  9. (附源码)springboot手机推荐网站 毕业设计052329

    摘 要 随着社会的发展,计算机的优势和普及使得手机推荐网站的开发成为必需.手机推荐网站主要是借助计算机,通过对首页.手机问答.公告消息.手机资讯.手机测评.我的.跳转到后台等信息进行管理.减少管理员的 ...

最新文章

  1. JavaScript初学者编程题(3)
  2. java存款程序_JAVA实现账户取款和存款操作
  3. 深入C#中的String类
  4. Python手写神经网络实现3层感知机
  5. Django 框架篇(七) : 中间件 以及 5种方法
  6. 你不是颠覆 IoT,就是被 IoT 颠覆!
  7. 8、RabbitMQ-消息的确认机制(生产者)
  8. lbj学习日记 03 循环和选择结构的刷题心得
  9. 无法同步谷歌日历_这场科技发布会上,谷歌究竟更新了啥?
  10. python qq邮箱,Python使用QQ邮箱发送邮件报错smtplib.SMTPAuthenticationError
  11. 关于Flash的几点思考(Thoughts on Flash)
  12. web项目打war包方法 两步解决(极其简单方便)
  13. 吕文哲:为什么我说EOS完爆以太坊,理由全在这里了
  14. 26.JavaScript对象和基础类型之间的转换、hint、Symbol.toPrimitive、toString、valueOf
  15. 【Unity组件知识】如何在Unity2020以后版本中打包图集
  16. 《谁的青春不迷茫》随记
  17. 《完全用Linux工作》(原版)作者:王垠
  18. 批量修改文件名中的一部分
  19. 客户端/服务端软件概述
  20. 用555定时器接成的施密特触发器电路/滞回电压比较器中,用什么方法能调节回差电压的大小?包含工作原理与应用

热门文章

  1. 终结符号和非终结符号
  2. 开源软件七大盈利模式
  3. 解决element 分页组件,搜索过后current-page 绑定的数据变了,但是页面当前页码并没有变的问题
  4. 【沙发管家】华为悦盒刷机破解详细攻略,附多个第三方精简固件
  5. CPU位数、操作系统位数、指令集、寄存器位数、机器字长等
  6. Vue项目实现web端第三方分享(qq、qq空间、微博、微信)
  7. 【5G】SRS原理 | SRS天线轮发
  8. android接入华为推送
  9. Wireshark抓取网络聊天
  10. sklearn 增量学习