什么是微信小程序
小程序是一種不需要下載安裝即可使用的應用，它實現了應用“觸手可及”的夢想，用戶掃一掃或者搜一下即可打開應用。也體現了“用完即走”的理念，用戶不用關心是否安裝太多應用的問題。應用將無處不在，隨時可用，但又無需安裝卸載。對于開發者而言，小程序開發門檻相對較低，難度不及APP，能夠滿足簡單的基礎應用，hishop小程序開發認為適合生活服務類線下商鋪以及非剛需低頻應用的轉換。小程序能夠實現消息通知、線下掃碼、公眾號關聯等七大功能。其中，通過公眾號關聯，用戶可以實現公眾號與小程序之間相互跳轉。由于小程序不存在入口。

什么是html5
標準通用標記語言下的一個應用HTML標準自1999年12月發布的HTML4.01后，后繼的HTML5和其它標準被束之高閣，為了推動Web標準化運動的發展，一些公司聯合起來，成立了一個叫做 Web Hypertext Application Technology Working Group （Web超文本應用技術工作組 -WHATWG） 的組織。WHATWG 致力于 Web 表單和應用程序，而W3C（World Wide Web Consortium，萬維網聯盟） 專注于XHTML2.0。在 2006 年，雙方決定進行合作，來創建一個新版本的 HTML。

布局不同
html5使用div，article為基本布局元素
微信小程序采用view,block為基本布局元素

html5支持在元素里面加入style標簽
微信小程序不支持在元素里面加入style標簽，所以有自定義信息都需要采用class樣式名形式加入

微信小程序 <include src="footer.wxml"/>引入一個footer頁面
html5不支持，如果需要引入另一個網頁，需要采用iframe

微信小程序可以直接在<view>基本標簽里面綁定數據
html5就不能，需要采用ajax加載

相同之處
<video>，與<audio>視頻與音頻引入規則是一樣的

樣式表的不同之處
微信小程序，不支持css3里面一個重要的元素 @media only screen and (max-width: 400){} ，@media only screen標簽

其它寫法基本與css3一樣，也可以定義動畫效果
@keyframes shake{0%,100%{-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}10%,30%,50%,70%,90%{-webkit-transform:translate3d(0,-10px,0);-ms-transform:translate3d(0,-10px,0);transform:translate3d(0,-10px,0)}20%,40%,60%,80%{-webkit-transform:translate3d(0,10px,0);-ms-transform:translate3d(0,10px,0);transform:translate3d(0,10px,0)}}
animation:fadeInRight 1 3s,shake 20s  infinite 3s; 
寫法都是一樣的
后我們發現，如果你會書寫html5+css3，基本可以實現微信小程序的布局