了解H5网站设计基本概念,不被培训广告忽悠,更不“维他命”

H5是第5代HTML,H5网站设计就是第五代HTML网站设计,也指H5语言制作的一切数字化产品。所谓HTML是“超文本标记语言”的英文缩写。在做H5网站设计时其实很简单,有培训公司的广告是这样些的:“某某某是一个免费H5场景应用制作和发布平台。不用懂设计、不用会编程,1分钟上手制作,通过简单的操作,人人都能制作出一份受众喜欢的H5创意页面。”这些广告就是忽悠你了,让你充满向往,赶快交钱给他,然后“维他命”。其实不像这家广告说的那样简单的,光H5页面的设计稿尺寸大小规范你都需要耐心才能学好的。

一、H5网站设计像素的设置:

像素是没有宽高的(不要被Photoshop中的像素格欺骗),它只代表一个采样的色值。

二、H5网站设计图片尺寸大小:

任何图片作为数据信息被保存在存储盘中时,只有宽高像素数是有意义的,此时的ppi对于图片来说时没有任何意义,也并不能描述这个图片有多少英寸的宽度或者高度,而只有在被打印出来后才有ppi的意义,被打印出来才可以描述这张图片有多高多宽。[ NextPage ]

三、H5网站设计设计稿的尺寸:

制作设计稿时,设计师应该把原型稿上的所有尺寸进行2倍处理。这样设计稿在移动设备上预览便可保证清晰。而前端切片时,按照现在流行的做法,可以直接使用原型稿上的尺寸,也就是设计稿上的1/2。

四、H5网站设计原型稿建议尺寸:

平时制作H5页面时设计原型时,产品经理出的原型稿建议屏宽为320px,用这个尺寸一是为了浏览方便(现在很多手机的屏宽达到1440px,用这个尺寸去模拟显然不现实);二是以iPhone5s为标准的手机屏宽较小,进行内容排版布局时屏宽应该向下兼容。

五、H5网站设计设计稿的效果:

一般情况下,H5页面设计稿做成640x1136px是最为稳妥的尺寸,在812px高度处增加一条安全线,重要内容在此线之上(网上有些文章说安全线是960px处,个人认为不太准确)。既保证了在移动设备上显示清晰,也保证了素材的最小尺寸。

我们上网所看到网页,多数都是由HTML写成的。很多不了解H5网站设计的人一看这个词语有英文、有数字还有汉字的词语,感觉挺难理解的,很神秘的,其实就是HTML的,只不过是第五代吧了,H5不再只是一种标记语言,它提供免插件的音视频、图像动画、本体存储以及更多酷炫而且重要的功能,并使这些应用标准化和开放化,从而使互联网也能够轻松实现类似桌面的应用体验。H5的也具有跨平台性,用H5搭建的站点与应用可以兼容PC端与移动端、Windows与Linux、安卓与IOS。它可以轻易地移植到各种不同的开放平台。

陕西弈聪软件信息技术股份有限公司
电话:13679229477    02989322522
陕西省西安航天基地神州四路科为城墅20栋4301