H5页开发规范/通用规范
兼容目标
- 
主流移动设备:iPhone 4+ 、三星、魅族、华为、红米、小米1S 以上及主流 Android 千元机型;请特别关注iPhone4/4s、魅族MX4、华为P6等机型
- 
操作系统:iOS 7.0+ 与 Android 4.0+;
加载速度、请求数与资源压缩
- 以 3G 网络环境 100kb/s 的网络速度计算,详情页首次加载过程中,可以在 2s 内看到 Loading 页面;
- 原则上页面中不超过 1 个的样式文件请求、2 个的脚本文件网络请求;
- 图片资源应当进行压缩,JPG 图片使用 80% 以下质量,PNG 图片使用 TinyPNG 进行压缩;
- 详情页平均单页资源不超过 300 KB,总资源包大小不超过页数乘以300KB(不包括视频资源);
- 应当对小图片进行 CSS 雪碧图 合并,因低版本系统及低端设备渲染问题,单张图片尺寸不超过 2000x2000 像素,超过时需切分成多张雪碧图;
资源文件格式标准
| 文件类似 | 格式 | 大小 | 其它备注 | 
|---|---|---|---|
| 背景音乐 | mp3 | 小于 80 KB | 开头和结尾音轨建议做使用淡入淡出处理 | 
| 分享缩略图 | jpg | 小于 6 KB | 尺寸为 120x120 像素 | 
| 视频文件 | mov/mp4/avi | 暂无要求 | 分辨率>=960×540,视频码率>=1500kbps,画面比例 4:3或16:9 | 
资源部署
- 详情页应只包含静态文件资源,涉及数据交互使用 AJAX 进行数据提交;
- 详情页所有资源上线前将部署到腾讯服务器;
- 不允许在页面中添加非腾讯域名的资源;
- 若页面中包括视频,提供视频文件,由运营经理上传至腾讯视频服务器后再提供视频地址;
作者:青茶
        
免责声明:文章、笔记等仅供分享、探讨、参考等学习之用,因此造成的任何后果概不负责。(如有错误、疏忽等问题,欢迎指正、讨论,谢谢)
        本文版权归作者和博客园共有,欢迎转载,但请务必在文章页面明显位置给出原文连接,谢谢配合。
  
 
                     
                    
                 
                    
                
 
                
            
         
         浙公网安备 33010602011771号
浙公网安备 33010602011771号