html5主要做頁(yè)面樣式上的設(shè)計(jì)，一般針對(duì)于手機(jī)端和一些動(dòng)畫效果。而php是服務(wù)器端的，網(wǎng)頁(yè)內(nèi)容和服務(wù)器之間的交互行為一般是通過(guò)php來(lái)完成的。所以說(shuō)html5用于前端，php用于后臺(tái)服務(wù)器的。

今天給大家介紹幾個(gè)招式：招式一 圖文消息底部輸入添加閱讀原文鏈接，用戶點(diǎn)擊左下角閱讀原文可以跳轉(zhuǎn)到指定場(chǎng)景頁(yè)面（要求：認(rèn)證的訂閱號(hào)、服務(wù)號(hào)）Step 1 點(diǎn)擊群發(fā)功能Step2 新建圖文消息Step 3 編輯圖文消息，在“原文鏈接”處設(shè)置需要展示的場(chǎng)景頁(yè)面鏈接圖文消息發(fā)布后，用戶點(diǎn)擊閱讀原文就可以看到您推送的H5場(chǎng)景頁(yè)面啦 招式二 設(shè)置自定義菜單，跳轉(zhuǎn)到指定場(chǎng)景頁(yè)面 （要求：認(rèn)證的訂閱號(hào)、服務(wù)號(hào)）建議：此處適合長(zhǎng)期性的展示內(nèi)容，比如品牌介紹、服務(wù)說(shuō)明等。Step 1 點(diǎn)擊自定義菜單 Step2 編輯菜單，選擇“跳轉(zhuǎn)到網(wǎng)頁(yè)”，設(shè)置成需要展示的場(chǎng)景頁(yè)面鏈接即可招式三 設(shè)置自動(dòng)回復(fù)，跳轉(zhuǎn)到指定場(chǎng)景頁(yè)面 （要求：認(rèn)證的訂閱號(hào)、服務(wù)號(hào)）Step1 點(diǎn)擊自動(dòng)回復(fù) Step2 編輯自動(dòng)回復(fù)內(nèi)容，設(shè)置鏈接即可 招式四 發(fā)布含有超鏈接的圖文消息，跳轉(zhuǎn)到指定的場(chǎng)景頁(yè)面 （要求：認(rèn)證的服務(wù)號(hào)，且已開通微信支付功能，由于微信官方功能調(diào)整，2015年開通的賬號(hào)可能沒(méi)有該項(xiàng)功能）Step 1 點(diǎn)擊群發(fā)消息Step2 新建圖文消息Step 3 編輯圖文消息，設(shè)置場(chǎng)景頁(yè)面的鏈接或二維碼是不是感覺(jué)so easy ?建議每種方法都試一下，下次再用就熟練啦。 還有同學(xué)問(wèn)到小酷，做好的最酷H5場(chǎng)景除了可以發(fā)送到公眾號(hào)以外，可以分享到朋友圈或者QQ嗎？答案是肯定的！制作好的最酷H5場(chǎng)景，既可以分享給微信好友、群組，微信朋友圈，還能分享給QQ好友、群組，以及QQ空間！ 操作同樣很簡(jiǎn)單，看招：打開場(chǎng)景頁(yè)----點(diǎn)擊右上角小圓點(diǎn)----選擇分享到哪里

很多軟件都可以做啊。比如FLASH,AE,PS，當(dāng)然FLASH顏色有點(diǎn)失真設(shè)計(jì)時(shí)候注意顏色別太豐富，AE無(wú)法做透明的，還有要注意體積，至于PS開時(shí)間軸后就只靠畫比較看繪畫能力。

用于WAP的標(biāo)記語(yǔ)言就是WML（Wireless Markup Language）。WML的語(yǔ)法跟XML一樣，WML是XML的子集。HTML、XML和WML的文件有很多相似之處，這樣網(wǎng)頁(yè)開發(fā)者在過(guò)去10年中所學(xué)的東西今天依然適用。WML頁(yè)面文件的后綴是 *.WML，就象HTML的 *.HTML后綴。XML規(guī)定定義了一個(gè)規(guī)范的XML文件的規(guī)格。任何違反這個(gè)規(guī)定的WML文件會(huì)出錯(cuò)。WML文件通常使用XML解釋器起來(lái)解釋。如果你是搞開發(fā) 建議用M3GATE和OPERA 前者測(cè)WML代碼錯(cuò)誤 后者能測(cè)腳本錯(cuò)誤 如果你是瀏覽WAP網(wǎng)站 建議OPERA 容錯(cuò)性強(qiáng)點(diǎn) 而且界面比較容易接受 如果都是亂碼，可以在VIEW-ENCODING里面選擇瀏覽的編碼方式

h5單純?cè)O(shè)計(jì)定制的話,首頁(yè)大概是800到1500每頁(yè)，內(nèi)頁(yè)設(shè)計(jì)600到1000每頁(yè)。如果是原畫設(shè)計(jì)的話另算，一般需要2000+每頁(yè)了。具體建議你可以找新工式平臺(tái)給你報(bào)價(jià)。h5頁(yè)面定制需要按照你需要的功能來(lái)報(bào)價(jià)，下面是我整理的一些需求，你可以確定下具體的，然后跟合作公司溝通。html5移動(dòng)網(wǎng)站建設(shè)費(fèi)用，這個(gè)不好說(shuō)的，如果是用已有的程序直接制作模板的話，就比較容易了，開發(fā)難度低，千把元就能做一個(gè)，好點(diǎn)的幾千塊。對(duì)企業(yè)網(wǎng)站來(lái)說(shuō)，最好還是不要完全去獨(dú)立開發(fā)，不容易做好也不好做

最新的 Photoshop 是有跟 Sketch 一樣的輸出切圖功能的(Generator)，用 2x 的 PSD 輸出 3x 的切圖也可以。而且 Photoshop 配合 Slicy 輸出切圖比 Sketch 3 快捷很多。Sketch 相當(dāng)棒，但目前(v3.1)還是有不少小問(wèn)題，加上對(duì)中文支持不夠好，在界面設(shè)計(jì)中還不能完全取代 Photoshop。關(guān)于題目的問(wèn)題，首先一份設(shè)計(jì)稿就不能適用于 iOS 各手機(jī)屏幕尺寸。以下是 Bjango 把目前各 iOS 手機(jī)屏幕還原為 1x 的對(duì)比圖，可見(jiàn)在設(shè)計(jì)稿中四種屏幕尺寸寬高都不一樣，不是簡(jiǎn)單地把 iPhone 5 界面縮放一下就變成 iPhone 6 的設(shè)計(jì)稿了。如何支持多個(gè)尺寸屏幕，這個(gè)要分情況討論。對(duì)于常規(guī)界面我們可以偷個(gè)懶，只做 iPhone 5 屏幕尺寸的設(shè)計(jì)稿，請(qǐng)開發(fā)在其它屏幕上自適應(yīng)，最終檢查實(shí)機(jī)效果沒(méi)問(wèn)題就行。蘋果官網(wǎng)上屏幕對(duì)比頁(yè)面里用到的都是常規(guī)界面：對(duì)于一些定制的界面我們應(yīng)該根據(jù)不同屏幕重新適配，比如下面是個(gè)簡(jiǎn)單的 profile 頁(yè)面示例，自動(dòng)適配到大屏幕的效果挺糟糕的。此時(shí)設(shè)計(jì)師應(yīng)該手動(dòng)為大屏幕重新調(diào)整設(shè)計(jì)，像下圖一樣。在上圖中可看出 iPhone 6 Plus 界面中部分切圖尺寸比 3x 更大，要單獨(dú)切圖，所以不是說(shuō)簡(jiǎn)單地給 iPhone 6 Plus 統(tǒng)一切 3x 圖就 OK 的了。這時(shí)矢量切圖在開發(fā)中優(yōu)勢(shì)很明顯，只要把大屏幕中切圖的尺寸告訴開發(fā)即可，無(wú)需針對(duì)非 3x 元素額外輸出切圖。* 手機(jī)屏幕畢竟還是像素位圖，像細(xì)線圖標(biāo)即使是矢量的在縮放后仍可能會(huì)出現(xiàn)虛化模糊的現(xiàn)象(類似 HTML 里的 icon font)，理論上并非所有情況都適合用矢量切圖。但是，iPhone 6 Plus 屏幕本身又是 downscale 的，導(dǎo)致原本 pixel perfect 的切圖也會(huì)在縮放后發(fā)虛，完全沒(méi)有 pixel perfect 而言，究竟是不是 iPhone 6 Plus 屏幕已經(jīng)優(yōu)化的看不出像素點(diǎn)了，要等看到實(shí)機(jī)才能確定。切圖方面用 Sketch 的話可以盡量試試 PDF 矢量切圖(但要在實(shí)機(jī)上確認(rèn)效果)。Photoshop 就只能輸出位圖了，上面提到定制界面里的一些切圖得單獨(dú)輸出，其他常規(guī)的用 2x 的 PSD 輸出 1-3x 切圖即可。另外，AI 不適合做界面設(shè)計(jì)。勇于嘗試 Sketch 是好的，但若 Sketch 各種毛病忍不了的話建議還是用 Photoshop 好些。另外強(qiáng)烈推薦@Akane_Lee 老師一篇iPhone 6 及 Plus制圖建議的好文!@Akane_Lee ：iPhone 6 和 Plus 新機(jī)一發(fā)表，群里就有人跑來(lái)哀嚎說(shuō)老板叫他準(zhǔn)備 iPhone6 的適配，可現(xiàn)在什么文檔都沒(méi)有完整啊!在很多細(xì)節(jié)不明的情況下，我只能建議這種最保險(xiǎn)安全的作法：做 @1x，放大給 @2x 和 @3x 用。以下情境預(yù)設(shè)為做一套 Mockup 要切出各種尺寸的圖。

肯定使用框架啊，不然還原生 JS、自己寫樣式？H5 做移動(dòng)開發(fā)也分兩種，一種就是正常的網(wǎng)頁(yè)，一種是封裝的成 App 在手機(jī)上跑的。下面我只大致介紹一下又哪些框架，具體的特性不是三兩句能說(shuō)完的，題主可以自行搜索相關(guān)資料。后者比較知名的框架就是 PhoneGap、MUI 等等了。而前者具體分的話還分 CSS 框架和 JS 框架。樣式框架有很多了，常見(jiàn)的有 jQuery Mobile、Bootstrap、Kendo UI、Amaze UI 等等。JS 框架一般是 AngularJS、Backbone、ReactJS 等等，但說(shuō)實(shí)話這些 JS 框架都比較繁重，一般是為比較復(fù)雜的場(chǎng)景設(shè)計(jì)的，如果你的頁(yè)面需求很簡(jiǎn)單，那么大可以不用它們只用樣式框架就好了。值得一提的是國(guó)內(nèi) BAT 三大巨頭也分別有自己的 H5 框架，并且都已經(jīng)開源了，百度的是 GMU（Global Mobile UI）、Clouda+、EFE 這三個(gè)，阿里的是 Kissy Mobile，騰訊的是 Frozen UI。

表單表格之類的

使用ME微雜志APP或者電腦端來(lái)設(shè)計(jì)制作并發(fā)布，可以分享到朋友圈，也可以發(fā)布到微信公眾號(hào)里面，搜索“ME微雜志”即可；