着微信应用的成功推广，中国移动互联网达到了一个全新的广度和高度。据CNNIC统计，中国目前已有7.6亿手机用户，其中智能手机用户高达5.6亿之众。可以说，几乎人人微信，人人手机，人人移动互联。这种场景是空前的，智能手机成了凌驾于电视、报纸、广播、杂志等传统媒体之上的最庞大、最活跃的媒体，移动互联网无时不在、无处不在。

一，变 化

互联网的变化是巨大的，尽管使用者不怎么留意，发展速度依然是突飞猛进、一日千里。

终端变化：忽然一夜之间，电脑已经不那么重要了，平板火了一段时间也慢慢沉寂了，只有智能手机越来越普及，功能越来越强大，手机应用越来越多，现在人们已经几乎离不开手机了。

入口变化：电脑终端时代，搜索引擎、门户网站为最大入口，到了移动互联网时代，社交网站、新闻内容成了最大的入口。其次就是各类应用，也就是app，更是绕开了所有的入口，直接链接消费者的终端。

应用变化：由于微信的普及，html5已经成了网站的标配，随着即将推出的【微信应用号】，html5将会达到前所未有的火爆，传统的原生app很可能会逐步被html5取代。

生态变化：从终端到入口，从入口到应用，整个互联网的生态已经发生了剧烈的变化。原来企业可以做个网站，通过搜索引擎或门户网站上的广告，就有访问量，现在不行了，只有让消费者安装app，网站才有人访问。即使有人从传统的路径访问了你的网站，手机浏览时界面不友好，访问者马上就会关闭。就算你在火爆的app上做了广告，访问到达后，浏览者也不会驻留。原因很简单，你的网页不适合手机浏览。

二，优 势

随着手机的普及，html5网站越来越受到重视。究其原因，还是html5的优势所导致。Html5到底具备哪些优势呢？

自动适应显示设备的尺寸和分辨率。一个基于html5开发的网站，既可以用电脑浏览，也可以用平板浏览，还可以用手机浏览。安卓系统和苹果系统都可以流畅地浏览。更重要的是，页面随着显示屏尺寸和分辨率自动缩放，内容也可以通过触摸放大缩小。

支持各种浏览器。无论是微软的浏览器还是安卓的浏览器，或者其他的任何浏览器，都可以顺畅浏览。

设备兼容。HTML5为网页应用开发者们提供了更多功能上的优化选择，带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入的开放接口，使外部应用可以直接与浏览器内部的数据直接相连，例如视频影音可直接与microphones及摄像头相联。

网页多媒体特性。支持网页端的音频、视频等多媒体功能， 与网站自带的APPS、摄像头，影音功能相得益彰。

还有其他的很多功能，比如三维图形、性能与集成特性、在线游戏开发等。

最重要的是，只有基于html5的网页，才能在手机app和浏览器里广泛转载、浏览。一旦进入了【微信应用号】，几亿会员就成了你的营销对象。

还有一条超级有用的就是，你可以随时向会员或订阅者推送信息，这个是前所未有的。

总之，html5带来的是全新的用户体验，可实现多媒体和游戏接入，可以 直接推送，可以在手机上随意转载分享。

三，超 车

或许，你错过了门户时代，或许你错过了搜索引擎时代，但你不能错过移动互联网时代。在移动互联网时代，html5是弯道超车的发动机。

与传统的互联网生态不同，移动互联网的接口是app，任何app的接口都是html5网页，微信分享的外部资源也是html5网页。也就是说，你有了html5网站，就融入了5.6亿中国智能手机用户，就可以在微信这个庞大的群体里恣意营销。

首先，你必须抛弃小而全、大而全的传统理念，只做自己核心的内容。其次，你要真正把用户当上帝，时刻注意应用场景和界面的友好，然后才可以设计制作网站。网站一旦制作成功，你就可以进入微信的应用号了。当然，你也可以制作网页版的app。

需要注意的是，app一般是原生的，与基于html5的app稍有不同，部分品牌的安卓手机（我就不列出来了，有过类似经历的人都知道，期望这些厂商赶紧升级自己的操作系统）不能上传图片、视频等内容，其他的与原生app没什么不同。如果你不需要用户上传照片、视频等文件，就没有必要花巨资去制作原生app。但社交类、电商类的网站，经常要用到图片上传，建议做两套app。

Html5正在高速发展，由于是开源的，所以现在的不足，不能成为你裹足不前的理由，或许不要多久，html5的网页app也能上传图片视频，从而可能彻底消灭了原生app。

找个公司，开发出一个基于html5的网站，生成app，然后进入【微信应用号】，打通与微信的联系，你就掌握了先机。剩下来的就是维护好你的客户关系和网站内容了。

在应用号没出来之前，H5网站可以在手机桌面生成快捷图标。这需要用户在浏览器中收藏本站到左面或菜单，一般人比较懒，也不知道这个操作。

用说， Flash的效果大家都清楚。实际上，HTML5和JavaScript拥有很多新属性，可以用它们来替代Flash。W3Cschool精选16个超牛逼的HTML5和JavaScript特效，看了这些特效，未来的Web发展前途无量。

1.特效：FlowerPower

创作者使用花朵作为画刷，以贝兹曲线方式绘图。

2.特效：Breathing Galaxies

动态变换直径及颜色，可通过鼠标或键盘产生新形状，这个效果不错!

3.特效：Noise Field

移动鼠标可改变粒子运动，点击可随机生成不同粒子效果。

4.特效：HTML5 Canvas粒子效果文字动画特效

W3Cschool利用HTML5，制造出了粒子效果文字动画特效。只要你输入框中输入想要展示的文字，回车后即可在canvas上绘制出粒子效果的文字动画，相当酷的动画效果。

5.特效：Swirling Tentacles

三维脉冲效果，沿着脉冲线有运动的颜色渐变模块。

6.特效：Keylight

双击生成两个以后的键即可发出声音，移动键的位置可产生不同的声音效果。W3Cschool上面有很多这样的教程，有兴趣可以去看一下！

7.特效：Rotating Spiral

旋转的螺旋效果，单击可以控制开始和停止旋转，是不是觉得高大上？

8.Blob

拖动水滴有重力效果，双击可以分离，小水滴碰到大水滴会合并。

9.Trail

彩色颗粒跟随鼠标运动效果，带尾巴淡出效果。

10.Graph Layout

一种交互的力向图布局效果，刷新三观。

11.Typographic Effects

使用HTML5 Canvas实现的文本特性，效果超过Flash。

12.Crazy Tentacles

移动鼠标可以进行涂鸦，点击鼠标可以清除画布，看着确实疯狂。

13.Nebula

吸引眼球的粒子系统，目的是测试WebGL性能，如果滑动鼠标，可以产生绚丽效果。

14.WebGL Globe

WebGL Globe 是一个开放的地理数据可视化平台，我们鼓励你复制代码，添加自己的数据，创建自己的应用。

15.Particle Playground

用鼠标和粒子进行交互，能发现不一样的精彩。

16.Surface

使用WebGL实现的水面特效实验，可放入一张照片，使用鼠标触动水面会有奇特效果。

上面的HTML5和JavaScript特效，简直赶超Flash。W3Cschool上面有很多用户留言称HTML5和JavaScriptit将替代Flash，不过对于这种说法，也不知道怎么去评判。毕竟这些用户说的也是很有道理，你认为JavaScriptit会替代Flash吗?很想知道你的答案!

公众号：w3c技术教程

提供专业的web技术教程、手册、工具。

我们使用HTML5， CSS3，甚至Bootstrap设计网站的时候，有些方面是必须考虑的，比如字体大小，标题大小，行间距，每行字数，字体，颜色，背景图片和文字的搭配，图标，留白和布局......所有的这些，都不是随随便便的，讲究一定的原则。而这些原则通常我们为参考一些网站。下面就列举这些网站。

HTML5和CSS3常用参考网站？

浏览器渲染符合HTML5标准：http://necolas.github.io/normalize.css/

Google字体：ttps://www.google.com/fonts

栅格：http://www.responsivegridsystem.com/

扁平颜色：http://flatuicolors.com/

选择颜色值：http://www.0to255.com/

icon图标:http://ionicons.com/

css: https://css-tricks.com/

js的CDN:http://www.jsdelivr.com/

一个CSS属性在各个浏览器的兼容性: http://caniuse.com/

创建favicon: http://realfavicongenerator.net/

压缩图片尺寸：http://optimizilla.com/

CSS文件最小化：www.minifycss.com

JS文件最小化：hTp://www.minifyjavascript.com/

检测html代码：http://validator.w3.org/

文/丁向明

做一个有博客的web前端自媒体人，专注web前端开发，关注用户体验，加我qq/微信交流：6135833

http://dingxiangming.com