【转】手机web页面制作时的注意事项

news/2024/12/3 5:04:36/

一、手机页面的标准头规范

字符编码使用utf-8:指定页面手机内存缓存中的存储时间段

device-width:通知浏览器使用设备的宽度作为可视区的宽度

initial-scale - 初始的缩放比例

minimum-scale - 允许用户缩放到的最小比例

maximum-scale - 允许用户缩放到的最大比例

--------解决原先在Pocket PC 2002上能够全萤幕显示的Flash影片(240×320),到了Pocket PC2003之后,自动会缩小的问题。


二、手机页面的css样式

1.页面自带css建议style标签头标准化,格式:id="internalStyle">

2 .部分手机浏览器对如下css样式支持不是很好,建议慎重使用:

· 不支持font-family属性,也就是说,在很多浏览器可能只有一种默认字体;

· 不支持font-szie属性,如在UC浏览器你只能看到一样大小的字体;

· 不支持width、height、padding、margin、line-height属性,如,在UC浏览器只能通过p、br 等HTML标签来换行以达到字符上下间隔;

· 不支持固定像素的宽度,100%显示页面,如:在UC浏览器始终将看到的是“满屏的”;

· 不支持浮动、层叠布局,float和position属性无效,如:在UC浏览器你只能看到“左对齐”,建议使用table格局。

· 支持background-color,但不支持background-image,也就是说不支持CSS背景图显示,在UC浏览器你只 能看到背景色,为了手机的流量,提倡尽量少用背景图。

· max-device-width这样的选项,限定屏幕宽度小于480的设备才采用该样式表。

三、其他

1.网页大小限制:建议低版本页面不超过15k,高版本页面不超过60k。

2.部分手机不支持png8和png24,所以尽量使用jpg和gif的图片;

3.另外对于平滑的渐变等精细的图片细节,部分手机的色彩支持度并不能达到要求,所以慎用有平滑渐变的bar设计;

4.部分手机对于超大图片,既不进行缩放,也不显示横下滚动条;

5.少数手机在打开超过20k的测试页面时,会显示内存不足

6.大部分手机不支持表单元素的“disable”属性,部分手机不支持的"button"标签,“input【type=file】"标签,"iframe"标签。少数手机不支持”select“标签。

7.在手持设备上,按钮最好不要直接用img标签

四、浏览器使用情况:

CNNIC与CR-Nielsen联合发布的《2009年中国移动互联网与3G用户调查报告》显示,

手机自带浏览器市场份额高达49.6%,

在现有手机浏览器品牌中,

腾讯手机浏览器份额27.3%,

UC手机浏览器份额11.2%,

Opera手机浏览器份额1.8%,

其他手机浏览器份额2.4%。

尽管今年 UC浏览器扳回一城,重新超越了QQ浏览器,但不排除有随时被对方超越的可能。

五、手机页面制作心得:

 1.手机页面的宽度最好控制在240px以内,因为这样可以在不移动屏幕的情况下进行一系列的操作。

2.无论是普通的手机或者智能机,似乎都不太支持js。类似<a href="javascript:history.back()">和"alert()"都不支持。

3.手机对“<input type="button">”的样式支持不是太好,同样的代码在浏览器上和手机上有一定的宽度差距,在给定宽度的情况下。所以我的建议是能不用按 钮,就不用按钮,可以用文字的超链接形式代替, 或者也可以考虑使用小图标。

4.列表页面最好用table,不要用ul li,或者p+空格,一方面是排版,一方面是如果某一列的元素过长,可以使用“table tr td{word-break:break-all;}”,而另外两种方案只能截取字符串了。

5.大图片的存在还是有一定的必要,比如说像导航图,会给人一种炫丽的感觉,但是图片也不能过大,一定要控制在10K以内。

文章来自:http://www.cnblogs.com/summers/p/3328214.html

转载于:https://www.cnblogs.com/Better-Me/p/4533687.html


http://www.ppmy.cn/news/544048.html

相关文章

拿下国产高端市场第一背后,vivo与苹果、华为的共性

出品 | 何玺 排版 | 叶媛 国内高端手机市场格局生变 据数据机构Counterpoint在8月24日公布的第二季度中国高端智能手机市场报告&#xff0c;vivo在刚刚过去的第二季度中表现抢眼&#xff0c;获得了13%的市场份额&#xff0c;成为仅次于苹果的高端手机品牌厂商。 01 国内高端…

android 自由浏览器下载地址,盘点那些新手机必装应用【10】

原标题&#xff1a;新学期当然用新手机 盘点那些必装应用 风格精致流畅炫酷 近期&#xff0c;随着新款Android平板产品的不断涌现&#xff0c;Android平板设备在今年又迎来了一个全新的发展契机。这表明Android平板再也不再只是小厂商的“山寨产品”&#xff0c;而将是众多大牌…

手机浏览器正加速向智能化演进

进入2012年&#xff0c;无论是运营商、终端厂商还是互联网企业&#xff0c;都将手机作为控制用户的重要的入口。在手机桌面上&#xff0c;除了移动应用商店便是手机浏览器。目前&#xff0c;除了PC浏览器企业发力手机浏览器市场外&#xff0c;淘宝浏览器、阿里云浏览器、UC浏览…

李沐论文精度系列之十:GPT-4

文章目录 一、AIGC资讯速览1.1 Toolformer&#xff08;2023.2.9&#xff09;1.2 ChatGPT plugin1.3 LLaMA&#xff08;2023.2.24&#xff09;1.4 Visual ChatGPT&#xff08;2023.3.8&#xff09;1.5 GigaGAN&#xff08;2023.3.9&#xff09;1.6 Stanford Alpaca&#xff08;2…

理想汽车L系列的“套娃”式新玩法会有厂商跟吗?

出品 | 何玺 排版 | 叶媛 9月30日&#xff0c;理想在发布会上同时推出了L7和L8两个车型。 发布会后&#xff0c;舆论普遍认为L7、L8与不久前发布的L9相比&#xff0c;在外形、配置上具有很多共性&#xff0c;整个L系列车型显得颇具“套娃”之风。 01 理想连发两款车&#x…

从“三个比肩”看vivo的高端移动影像野心

出品 | 何玺 排版 | 叶媛 “把创作的权利真正地赋予给每一位普通人”——在10月24日的vivo影像战略发布会上&#xff0c;vivo用这句话表达了自己的影像愿景。 当然&#xff0c;vivo的影像愿景并非只有口号。为了达成这个愿景&#xff0c;vivo提出了“两个战略支点”和“三个比…

长期主义,vivo的“逆周期”生长之道

出品 | 何玺 排版 | 叶媛 手机行业今年有点难。 据中国信通院公布的数据显示&#xff0c;2022年上半年&#xff0c;国内市场手机总体出货量累计1.36亿部&#xff0c;同比下降21.7%。与去年同期相比&#xff0c;新上市的手机款式也在减少。1-5月&#xff0c;上市新机型累计167…

全球及中国数字内容产业运行现状调研与盈利前景分析报告2022年

全球及中国数字内容产业运行现状调研与盈利前景分析报告2022年 --------------------------------------------------- 《出版单位》&#xff1a;鸿晟信合研究院 《修订日期》&#xff1a;2022年2月 《专员对接》&#xff1a;周文文 【具体数据分析内容可咨询鸿晟信合研究院&am…