兼容目标

  • 主流移动设备: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 进行数据提交;
  • 详情页所有资源上线前将部署到腾讯服务器;
  • 不允许在页面中添加非腾讯域名的资源;
  • 若页面中包括视频,提供视频文件,由运营经理上传至腾讯视频服务器后再提供视频地址;

H5页开发规范/通用规范的更多相关文章

  1. 移动端H5多页开发拍门砖经验

    两年前刚接触移动端开发,刚开始比较疑惑,每次遇到问题都是到社区里提问或者吸取前辈的经验分享,感谢热衷于分享的开发者为前端社区带来欣欣向上的生命力.本文结合先前写的文章和开发经验分享给大家,希望也能帮助 ...

  2. ***网Web前端开发规范(初稿)

    这几天一直在梳理关于前端方面的开发规范,现在暂时梳理了HTML的开发规范,暂且放置于此! 规范目的: 使开发流程更加规范化 文件命名规范:(需审批) 1.项目命名 全部采用小写方式, 以下划线分隔. ...

  3. Web 前端开发规范手册

    一.规范目的 Web 前端开发规范手册 1.1 概述 ......................................................................... ...

  4. h5直播开发之旅总结

    前言 关于直播,有很多相关技术文章,这里不多说. 作为前端,我们比较关心我们所需要的. 直播的大致流程: APP端调用摄像头 -> 拍摄视频 -> 实时上传视频 -> 服务器端获取视 ...

  5. C#开发微信门户及应用(44)--微信H5页面开发的经验总结

    在我们开发微信页面的时候,需要大量用到了各种呈现的效果,一般可以使用Boostrap的效果来设计不同的页面,不过微信团队也提供很多这方面的资源,包括JSSDK的接口,以及Weui的页面样式和相关功能页 ...

  6. WEB前端开发规范

    WEB前端开发规范 规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档.本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改. 基本 ...

  7. thinkphp开发规范

    1.编写目的     为了更好的提高技术部的工作效率,保证开发的有效性和合理性,并可最大程度的提高程序代码的可读性和可重复利用性,指定此规范.开发团队根据自己的实际情况,可以对本规范进行补充或裁减. ...

  8. PHP开发规范

    十.开发规范下面我们讲解 Yii 编程中推荐的开发规范.为简单起见,我们假设 WebRoot 是 Yii 应用安装的目录.1.URL默认情况下,Yii 识别如下格式的 URL: http://host ...

  9. ASP.NET开发规范:OWIN

    ASP.NET开发规范:OWIN 今天投简历 准备面试了... 本节目录: OWIN简介 OWIN规范 Katana Hello World(3种Host) 自定义Middleware OWIN简介 ...

随机推荐

  1. Linux下安装php加速组件XCache

    这里选择的是稳定版本的1.2.2版本,2.0版本的不稳定.wget http://xcache.lighttpd.net/pub/Releases/1.2.2/xcache-1.2.2.tar.gzt ...

  2. ios 中的UI控件学习总结(1)

    UIKit框架提供了非常多功能强大又易用的UI控件 下面列举一些在开发中可能用得上的UI控件 UIButton 按钮 UILabel 文本标签 UITextField 文本输入框 UIImageVie ...

  3. cocos2dx 资源合并.

    文件合并之前 文件合并之后 吐槽 我们项目比较奇葩, ui用cocostudio做, 这项光荣的任务由美术接手. 这个美术是个新手, 经过我长时间的观察, 她似乎不用怎么画画. 至少在很长一段时间里, ...

  4. 不同浏览器对parseInt方法解析的不同

    parseInt方法的作用是将字符串转换为数字 当parseInt解析的时候只有0x和非0开头的数字,浏览器解析都一致,例如”0xA1”或 “9”. 只有当开头为0的时候才出现不同.IE,chrome ...

  5. [FindBugs分析记录]Class defines clone() but doesn't implement Cloneable

    官网解释: This class defines a clone() method but the class doesn't implement Cloneable. There are some ...

  6. VBox UUID already exists 问题处理

    问题说明: 在win7系统下使用vbox时,有时候需要多台相同操作系统和开发环境的虚拟电脑时,如果重复安装,会比较麻烦.那么可以在vbox中创建一个新的虚拟电脑B,但不创建虚拟硬盘,然后拷贝虚拟电脑A ...

  7. JQuery语法总结和注意事项

    1.关于页面元素的引用 通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用do ...

  8. Maven 安装记

    java初学者 昨天通m2e插件把maven项目导入eclipse的时候各种bug,看了各家技术博客,决定安装maven好好了解下. 安装maven也是一波三折的,先是看各种安装指导,结果环境变量都没 ...

  9. LoadRunner安装停在注册界面安装失败----解决办法之一

    今天下了个LoadRunner11.5玩玩,准备测手头上准备发布的项目性能,结果安装的时候,报错“Error Creating system registry entry”,在51testing搜索各 ...

  10. location对象,将url解析为独立片段search属性截取传递的参数

    通过location对象的search属性截取字符串传递过来的参数 search ?item=hello&name=auto&age=25 返回url中传递的参数,以?开头 funct ...