HTML5移动网页的设计稿尺寸应该是多少

html-css010

HTML5移动网页的设计稿尺寸应该是多少,第1张

HTML5的移动端网页设计稿,通常情况下,内容区为750px或960px或者1080px的,一般不小于750px像素大小(宽度)

设计稿可以比750px大,但是绝对不能比750px小,这个主要是由于当前手机的分辨率相对较高(iPhone 6是375物理像素,但实际像素为其两倍,也就是750,这个750就是这么来的)

如果设计图稿过小,前端在实现图稿的时候里面的图片大小在高分辨率的情况下会显得模糊不清,所以这也是为何要“大”分辨率

此外需要注意的是,要保证页面的基准字体大小,在320px的设计稿当中,最小字体不宜小于12像素,其他像素的设计稿当中,等比例换算即可(12/320px*设计稿像素值)

在本机测试HTML5 Canvas程序的时候,如果用context.drawImage()后再用context.getImageData()获取图片像素数据的时候会抛出错:SECURITY_ERR: DOM Exception 18。这是Javascript同源策略(Same origin policy)造成的。目前发现这个问题在Firefox和Chrome中均存在。

解决办法如下:

Firefox:在地址栏输入about:config,然后设置security.fileuri.strict_origin_policy为false。

Chrome:在命令行中运行 /path-to-chrome/chrome.exe –allow-file-access-from-files。

1、文档声明区别:

HTML:超文本标记语言,一种纯文本类型的语言。

HTML5.0:文档声明HTML5方便书写,精简,有利于程序员快速的阅读和开发。

2、结构语义区别

html:没有体现结构语义化的标签,如:<div id="nav"></div>

html5:添加了许多具有语义化的标签,如:<article>、<aside>、<audio>、<bdi>...

3、绘图区别

HTML:指可伸缩矢量图形,用于定义网络的基于矢量的图形。

HTML5:HTML5的canvas元素使用脚本(通常使用JavaScript)在网页上绘制图像,可以控制画布每一个像素。

扩展资料

HTML5的特征

1、语义特性(Class:Semantic)

HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的,微数据与微格式等方面的支持,构建对程序、对用户都更有价值的数据驱动的Web。

2、本地存储特性(Class: OFFLINE &STORAGE)

基于HTML5开发的网页APP拥有更短的启动时间,更快的联网速度,这些全得益于HTML5 APP Cache,以及本地存储功能。Indexed DB(html5本地存储最重要的技术之一)和API说明文档。

参考资料

百度百科-HTML5