中国联通家庭宽带多媒体应用业务平台技术规范第十分册-EPG开发分册
? 若EPG页面未采用CSS或其他方法对焦点框进行设置,则浏览器能够提供默认的焦点框用
于选中提示。焦点框应采用醒目颜色,可以使用户可以在3m外观察到焦点框的去向。 o 颜色:RGB - #FF8F1F o 粗细:3 像素
o 下拉列表元素选中底色:无需设置,保持原有颜色 o 下拉列表元素选中文字:无需设置,保持原有颜色
? 浏览器支持GIF(包括动态GIF)、JPG、PNG 格式的图片。且支持分辨率为720*576、352*288、
640*480的图形的缩放显示,图片上的每个象素至少支持16位彩色。 ? 浏览器在执行Javascript脚本遇到错误的时候,会终止脚本的继续执行; ? 不允许页面在设置元素的位置属性时出现“数值”和“px”之间插空格 ? HTML标签尽量成对出现。 6.1.2 分辨率
对标清页面输出应支持640×530的分辨率,对高清页面输出应支持1280x720、1920x1080。EPG页面在制作过程中,要求在页面Body元素中至少定义宽度与高度,且在style中必须添加background-Repeat:no-repeat属性,具体示例如下:
为了让机顶盒浏览器在高清EPG和标清EPG之间平滑切换,在EPG页面上增加meta通知一下页面大小。高清EPG页面写,标清EPG页面写。
6.1.3 字体字号
在页面制作时推荐使用px单位,因为px以像素为单位时,表达最准确。使用px 作为尺寸单位,不同浏览器在同一终端设备上显示差异最小。在EPG中使用的字体字号要求如下:
? 字体:黑体或宋体;
? 字号:像素28px以上的字号。
【注】在家宽中一个像素(px)被定义为,以1280*720为输出大小的屏幕上的构成影像的最小单位
页面制作过程中通常可以通过Font标签属性或CSS进行字体属性的设置,各种设置方式对应的
11
中国联通家庭宽带多媒体应用业务平台技术规范第十分册-EPG开发分册
字体大小参见下表。
表1:HTML字体对照表
FONT SIZE 【Html】 字体大小 字间距 字高 行间距 1 13px 2px 13px 3px 2 15px 2px 15px 5px 3 18px 4px 18px 4px 4 21px 4px 20px 6px
5 30px 6px 28px 9px 6 32px 6px 29px 11px 7 36px 6px 33px 11px 表2:CSS字体及HTML Headings对照表
font-size 【CSS】 字体大小 Headings [HTML] 字体大小 xx-small 13px H6 15px x-small 15px H5 18px small 18px H4 21px medium 21px H3 30px
large 30px H2 32px x-large 32px H1 36px xx-large 36px 表3:ASCII字符显示对照表
FONT SIZE 【Html】 1 2 17px 2px 5px 8px 3 19px 3px 6px 9px 4 19px 3px 6px 11px 5 6 7 34px 4px 10px 19px 最宽字符【大写W】 14px 最窄字符【小写l】 2px 最窄数字【1】 最宽数字【2~9,0】 5px 7px 28px 30px 3px 8px 3px 9px 16px 17px 【注】对于ASCII部分的规则,由于英文数字字符属于变宽,所以统计值上仅仅为字符灰度部分的取值。对于字符的占宽其实还包括内边距、提升度、降低度等参数,暂时无法反映在该表中 除页面中一般文字的显示外,EPG页面中一些特殊状态下的文字在浏览器中的显示状态如下: ? 文字链接、选中状态文字、已选中状态文字等根据【附录 A】提供的CSS进行设置; ? 输入框中的文字颜色默认为黑色,字体为黑体,字号与页面默认字号相同; ? 页面中多个空格和回车显示为一个英文字符宽度空格; ? 每一个“&nbps”显示为一个英文字符宽
12
度的空格;
中国联通家庭宽带多媒体应用业务平台技术规范第十分册-EPG开发分册
6.1.4 语言文字编码
页面制作过程中页面的字符集可以使用以下语言文字:
1. 英文字符(ISO-8859-1) 2. 中文GBK简体汉字 编码要求支持:
3. GBK 4. UTF-8
【注】如果字符集为中文集,则需要在标签中指定编码格式,外部css及链接文件采用同样编码格式。
6.1.5 图片格式
标清支持分辨率为720*576、352*288、640*480的图形显示,高清支持分辨率为720*576、352*288、640*480、1280x720、1920x1280的图形显示,每个象素至少支持16位彩色,建议支持到32位。
页面中应选择使用JPG、GIF、PNG、BMP格式的图片。
由于考虑嵌入式环境下资源有限,页面设计时应该注意以下事项:
? 尽量减少同一页面中动态GIF 格式的文件个数,由于动态Gif格式的图片通常由多个单帧
GIF图片组成,因此需要浏览器一次性载入多个图片,过多的动态GIF图片会影响浏览器性能。为提高页面显示性能,建议同一页面动态GIF 文件个数不要超过3 个;建议GIF动画图片不要设置为背景
? 在放置图片时,图片实际大小尽量跟页面设置的图片排版区域大小保持一致,否则会因图
片缩放导致显示性能的降低;
? 设置IMG 属性时,不要把高度、宽度设置为0,因为这样做不仅没有任何意义,而且还会
浪费浏览器的资源;
? 一个页面设置的图片总大小不要超过1M;
? 当标签中的图片地址不存在或由于图片过大导致下载过长时,直接显示页面背景色,
则无论该图片是否设置边框border属性默认边框均设置为0px;
? 当图片作为连接存在时,若页面没有设置默认的边框border属性则浏览器会将边框默认设
置为1px;
13
中国联通家庭宽带多媒体应用业务平台技术规范第十分册-EPG开发分册
6.1.6 Cookie的支持
Cookie的格式需要符合RFC2109规范,另外EPG页面制作过程中在设置Cookie时还需要注意: ? 浏览器支持的cookie总数为30个,在同一个域下尽量避免使用超过5个Cookie。若同一个
域中设置Cookie超过5个或Cookie总数超过30个时,浏览器将自动删除最早的cookie; ? 单个cookie或一次设置的多个cookie的最大尺寸为4K(4096 字节)。 6.1.7 功能图标展示
EPG可以抑制盒端相关功能图标的绘制功能(声音、进度条等),EPG抑制盒端绘制功能后,相关功能图标由EPG进行绘制。
直播时移绘制进度条时,盒端从NTP服务器获取的为UTC时间,EPG在绘制进度条时获取盒端时间后,由EPG根据相应时区进行时间调整。 6.1.8 JavaScript注意事项
1. 建议不使用getElementsByName获取页面中的DOM对象;
2. 尽量不要使用无效的js代码,特别是业务有很多打印的js代码,例如alert、jsDebug等方
法;
3. 尽量将业务的代码精简化,特别是页面实现逻辑;
4. 尽量把核心的js代码放在框架网页中,经常频繁调用的js代码不要放在子页面中。 5. 由于各种类型的机顶盒浏览器以及机顶盒遥控器键值布局等方面存在区别,因此为兼容此
种情况并解决用于特殊情况下的紧急处理方案。建议页面开发人员使用JavaScript的navigator.appName来区分浏览器。根据实际情况要求可以为各款机顶盒分配不同的navigator.appName。示例代码如下:
6. 由于机顶盒资源有限,应注意页面中对象等所占用的内存大小,同一个页面中不建议使用
过多变量或递归函数的多次调用;
7. 对于JavaScript的方法来说,如果页面希望浏览器对此方法进行处理则该函数return true,
否则return false表示该方法由页面进行处理。
8. 对未定义变量使用typeof运算的结果是“undefined”(区分大小写) 9. 对于字符串变量的赋值时,引号之间的字符串不应换行 10. 对于键值捕捉的处理,给出示例代码(【注】本代码只做参考):
14
中国联通家庭宽带多媒体应用业务平台技术规范第十分册-EPG开发分册
// 响应onkeypress事件 window.document.onkeypress = function( keyEvent ) { keyEvent = keyEvent ? keyEvent : window.event; var keyvalue = keyEvent.which ? keyEvent.which : keyEvent.keyCode; } 【注】keyEvent.which为只读属性 11. 不能把event、window、document等此类的保留字做为函数名,以避免和event属性冲突。
比如这样的写法不合法(【注】本代码只做参考): // 错误的用法 function event() { ………… } 12. JS代码中(包含页面总的JS代码)双引号不能嵌套,单引号也不要嵌套,但是交叉嵌套可
以;同时,在W3C中规定,引号内的内容不能够换行,比如(【注】本代码只做参考): // 错误的用法 var errorExpression1 = \ var errorExpression2 = ?1?2?3?; var errorExpression3 = “aaaa bbbbb”; // 正确的用法 var rightExpression1 = ?1”2”3?; var rightExpression2 = “1?2?3”;
6.2 HTML标签
对HTML标签的要求请参考中国联通家庭宽带多媒体应用盒端规范。 6.3 JavaScript 6.3.1 内置对象
对JavaScript的要求要求请参考中国联通家庭宽带多媒体应用盒端规范。 6.3.2 HTML DOM对象
对HTML DOM对象的要求要求请参考中国联通家庭宽带多媒体应用盒端规范。
15
//双引号不能嵌套 //单引号不能嵌套 //引号内的内容不能够换行