活动专题:
指需要有后端api数据对接调用数据展示、抽奖、登录等交互的专题。
示例:svn://gitee.com/amswait/cyou/source/demo/activity-ui
静态专题:
指纯做展示,后面不需要进一步与后端开发交互调用的专题。
示例:svn://gitee.com/amswait/cyou/source/demo/event.changyou.com
注:如果只有pc端,设置viewport在m端也能正常访问,width设置1500、1300等适当的值布局不会错乱。
<meta name="viewport" content="width=1500,minimum-scale=0,maximum-scale=5,user-scalable=yes"/>
官网:
游戏官网项目,一般是静态网站,没有后端开发交互,偶尔有个可以跨域的预约功能。
示例:svn://gitee.com/amswait/cyou/source/demo/ldjsy
注:svn检出需要用gitee帐号,可以根据需要自动检出对应项目目录
汇总目录:https://gitee.com/amswait/cyou/tree/master/source/demo
include 方式引用碎片一般可以用nginx服务器、apache服务等
<!--#include virtual="/inc/dma.html"-->
# 移动端必须加此样式,防止浏览器自动调整字体影响布局
-webkit-text-size-adjust: none;
通用规则
- 一般禁止使用字体文件(ttf/eof/svg/eot)(如需使用请联系需求方和技术同学确认)
检查专题文件包大小,如果超过10M看下专题是否包含了视频、mp3等大文件。
一般mp4、mp3文件有我们技术同学上传后反馈地址进行调用,mp3压缩品质一般64kbps;视频:mp4 1.保证清晰度情况下尽量压缩到10000kbps以内 2.一般视频弹窗视频宽度640px-1024px 3.mp4格式 h264编码一般单张图片不超过300k,png图片必须压缩(在线图片压缩:https://tinypng.com/),jpg图片一般60品质,如果要求清晰度高可以调高些。
pc端页面header需要引入
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">活动或者专题images文件中小图icon,尽量合成一张图减少请求。无用的图片及时删除,交包前务必将图片压缩一遍,特别是弹框、首页、分享页的背景图。
活动css文件为减小资源最终格式化为横向排列。
选择器 { display:none; background-color: #474747; border: 10px solid #474747; height: 390px; width: 640px;}统计代码引入方式:
官网:<!--#include virtual="/inc/dma.html"-->
活动:<!--#include virtual="/all/dma/dma_activity.html"-->
专题:<!--#include virtual="/all/dma/dma_static.html"-->页面头部引入报错日志上报代码
活动:
<script src="//www.changyou.com/cyouFile/loger/huodong.js"></script>
专题、活动中pc端和m端互跳(双端同时存在,含判断鸿蒙m端用Phone字段)
// pc端跳转m端
(function () {
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|Phone/i.test(navigator.userAgent)) {
location.href = "/m/index.shtml" + location.search;
}
})();
// m端跳转pc端
if (!/Android|webOS|iPhone|iPad|iPod|BlackBerry|Phone/i.test(navigator.userAgent)) {
window.location.href = "../pc/index.shtml";
}