對(duì)于H5這個(gè)名詞大家可能已經(jīng)很熟悉了，筆者對(duì)于這個(gè)詞真是又愛(ài)又恨，愛(ài)的是html5終于被大家接受并如此的重視，恨的是怎么可以把html5簡(jiǎn)稱做H5呢，那些這么去簡(jiǎn)稱的人知道html5真正的意義嗎，知道html是什么東西嗎，作為一直關(guān)注html5的技術(shù)狗，筆者實(shí)在不能接受這樣的簡(jiǎn)稱，html5本身就是簡(jiǎn)寫(xiě)了，還要弄出個(gè)H5來(lái)，不倫不類!(以上純屬個(gè)人情感宣泄，如果傷害到某些人，筆者不表示道歉)
本篇原文作者就是些的h5,內(nèi)容還是不錯(cuò)的，忍不住與大家分享，但我必須給HTML5 正名。
然而這不是偶然，而是趨勢(shì)。在具體介紹HTML5 營(yíng)銷之前，我想和大家分享一份eMarketer的數(shù)據(jù)，其中顯示了2012年-2018年品牌在不同媒體渠道的預(yù)算比重：
相比電視、雜志、戶外廣告等傳統(tǒng)媒體呈逐年下降的趨勢(shì)，品牌營(yíng)銷在數(shù)字和移動(dòng)方面的投入在逐年上升。而且，在所有渠道預(yù)算中移動(dòng)技術(shù)的投入增長(zhǎng)最快，遠(yuǎn)遠(yuǎn)高于其他渠道的增長(zhǎng)。當(dāng)然，這樣的結(jié)論你應(yīng)該不會(huì)感到驚訝，因?yàn)槲覀冊(cè)缫蚜?xí)慣了24小時(shí)手機(jī)陪伴的生活，而品牌最關(guān)注的就是消費(fèi)者“在哪”的問(wèn)題。
據(jù)美國(guó)的調(diào)查數(shù)據(jù)顯示，我們每天要查看手機(jī)150次，44%的人睡覺(jué)都把手機(jī)放在身邊，9%的美國(guó)人承認(rèn)他們?cè)诤龠輹r(shí)使用手機(jī)……毫無(wú)疑問(wèn)，手機(jī)是有史以來(lái)最強(qiáng)大的媒介，從早上醒來(lái)到臨睡前的一秒，這個(gè)幾英寸的屏幕都在和我們“交流”。
顯然，移動(dòng)營(yíng)銷已是大勢(shì)所趨，我們可以看到已經(jīng)廣泛應(yīng)用的簽到、二維碼技術(shù)，正在興起的iBeacon、微信的Wifi連接，還有就是本文將與大家分享的HTML5 技術(shù)。文章有點(diǎn)長(zhǎng)，可能需要費(fèi)些時(shí)間閱讀，全文包括：HTML5 技術(shù)簡(jiǎn)介及其特性，怎么實(shí)現(xiàn)、有哪些應(yīng)用場(chǎng)景，以及如何推廣等內(nèi)容。
Part 1 什么是HTML5 ？
經(jīng)常有朋友找我咨詢HTML5 的問(wèn)題，但是在和他們溝通的過(guò)程中，我發(fā)現(xiàn)很多人對(duì)HTML5 的理解都是停留在用戶層面，邀請(qǐng)函、小游戲、品牌展示、抽獎(jiǎng)等等。其實(shí)如果上升到營(yíng)銷層面的話，僅在用戶層面去思考是遠(yuǎn)遠(yuǎn)不夠的，因?yàn)槿魏蝹鞑ザ家紤]有效性的問(wèn)題，如果100w pv帶來(lái)的只是刷屏效果，而對(duì)品牌帶不來(lái)任何有效轉(zhuǎn)化，這樣的傳播顯然是不成功的。
對(duì)于事物的理解，如果不能從多個(gè)角度去分析，我們很難跳出原有的思考框架去看問(wèn)題。因此，這篇文章我想以更原始的角度，從H5這項(xiàng)技術(shù)本身為出發(fā)點(diǎn)去闡述；事實(shí)上互聯(lián)網(wǎng)技術(shù)的發(fā)展本質(zhì)上也是需求驅(qū)動(dòng)的，程序語(yǔ)言其實(shí)是高于應(yīng)用層面的產(chǎn)品。以下的內(nèi)容希望不會(huì)太晦澀，也希望能對(duì)你有所啟發(fā)。
簡(jiǎn)單來(lái)說(shuō)，HTML5 就是一種高級(jí)網(wǎng)頁(yè)技術(shù)，我們平時(shí)看到那些邀請(qǐng)函、小游戲都是HTML5 網(wǎng)頁(yè)，確切來(lái)說(shuō)叫HTML 5（國(guó)外目前沒(méi)有H5的叫法），它跟我們平時(shí)上網(wǎng)看到的那些網(wǎng)頁(yè)本質(zhì)上沒(méi)有任何區(qū)別，只不過(guò)大家普遍接受的那個(gè)網(wǎng)頁(yè)技術(shù)版本是HTML4，而這個(gè)版本是在1997年發(fā)布的。
什么是HTML，我這里簡(jiǎn)單解釋一下——想象一下兩個(gè)計(jì)算機(jī)在溝通的場(chǎng)景，A如果要把一個(gè)圖文信息傳給B的時(shí)候，交流過(guò)程中B肯定會(huì)產(chǎn)生這樣的問(wèn)題：你給了我那么多信息，哪些是網(wǎng)頁(yè)標(biāo)題、哪些是正文、哪些又是圖片呢？于是，A和B商量了一個(gè)辦法，用一些符號(hào)來(lái)標(biāo)記不同類型的內(nèi)容，而這些標(biāo)記的一整套規(guī)范就是HTML。
比如當(dāng)A要把圖文的標(biāo)題傳給B的時(shí)候，最終給B的表達(dá)是這樣的：
品牌HTML5 營(yíng)銷完全實(shí)戰(zhàn)指南</titile><br />如果設(shè)計(jì)HTML語(yǔ)言的人是中國(guó)人，那表達(dá)就會(huì)是這樣的：<br /><標(biāo)題 始>品牌HTML5 營(yíng)銷完全實(shí)戰(zhàn)指南<標(biāo)題 終><br />所以大家可以看到，HTML 其實(shí)是一項(xiàng)非常人性化的發(fā)明。關(guān)于HTML技術(shù)的詳解有興趣的讀者可以自行查閱，這里我主要跟大家介紹幾個(gè)營(yíng)銷人應(yīng)該關(guān)注的HTML5 特性，它能讓你對(duì)HTML5 能做成什么樣有個(gè)根本的認(rèn)識(shí)。<br />No.1 繪圖功能（Canvas、SVG）<br />這是H5一個(gè)非常重要的特性，你在很多H5中看到的動(dòng)畫(huà)效果就是用H5的繪圖功能做的，比較典型的例子是STC風(fēng)云榜分享的可口可樂(lè)的例子，有興趣可以點(diǎn)擊最后的“閱讀原文”看一下。<br />為了方便理解，你可以將HTML5 的繪圖功能類比為Flash，但是唯一的決定性區(qū)別是，F(xiàn)lash做出來(lái)的動(dòng)畫(huà)無(wú)法在移動(dòng)端的瀏覽器中瀏覽，因?yàn)锳dobe早已在2012年就停止了對(duì)移動(dòng)端flash的開(kāi)發(fā)。毫無(wú)疑問(wèn)，未來(lái)的移動(dòng)網(wǎng)頁(yè)游戲和動(dòng)畫(huà)會(huì)是HTML5 的天下。<br />從技術(shù)實(shí)現(xiàn)的角度，HTML5 配合JS（一種程序語(yǔ)言）可以做出任何二維動(dòng)畫(huà)，并且因?yàn)槭蔷W(wǎng)頁(yè)元素，所有元素均可以監(jiān)測(cè)到用戶點(diǎn)擊的數(shù)據(jù)，也就是說(shuō)你可以知道用戶在HTML5 動(dòng)畫(huà)網(wǎng)頁(yè)中的所有交互行為。但是，具體到實(shí)際應(yīng)用，我們就要考慮周期、成本，和用戶體驗(yàn)的問(wèn)題，復(fù)雜的動(dòng)畫(huà)相應(yīng)的制作周期和成本會(huì)提高，同時(shí)也有可能影響加載速度等用戶體驗(yàn)相關(guān)的問(wèn)題。<br />以下這個(gè)網(wǎng)站是HTML5 繪圖功能的典型例子，非常強(qiáng)大。你可以選擇不同型號(hào)的毛筆、筆觸半徑以及墨水的顏色，整個(gè)繪圖過(guò)程非常順暢，而且還有一個(gè)模擬手握毛筆的人性化設(shè)計(jì)。<br />No.2 三維效果（css3 3D）<br />H5的華麗效果離不開(kāi)一種叫CSS的技術(shù)，形象的說(shuō)，如果把HTML5比作漫畫(huà)的素描稿，CSS就是上色用的，相當(dāng)于word界面上方的格式工具欄，如果沒(méi)有CSS我們看到的HTML5 網(wǎng)頁(yè)就只能以“素顏”見(jiàn)人了。如果你熟悉互聯(lián)網(wǎng)技術(shù)的命名規(guī)則你應(yīng)該能知道css3就是CSS的升級(jí)版本。<br />在css3中有個(gè)非常酷的功能是三維渲染，也就說(shuō)HTML5 中能做出3D動(dòng)畫(huà)甚至3D游戲。目前我們看到的H5中css3 3D的應(yīng)用較少，這個(gè)也許會(huì)是下一個(gè)營(yíng)銷類HTML5 應(yīng)用的熱點(diǎn)，建議大家持續(xù)關(guān)注。<br />下面這兩個(gè)網(wǎng)頁(yè)游戲就是用HTML5 +css3 3D做的，第一個(gè)是俄羅斯方塊的3D版，想象一下在三維的空間里玩俄羅斯方塊是什么感覺(jué)，喜歡挑戰(zhàn)空間想象力的朋友可以試一下；第二個(gè)游戲是3D版坦克大戰(zhàn)，非常精致耐玩的游戲，一句話評(píng)價(jià)就是“根本停不下來(lái)”。<br /><p>No.3 離線存儲(chǔ)（HTML5 Web Storage）</p><br />HTML5 的另一個(gè)重要特性就是離線存儲(chǔ)，它能將用戶的資源文件保存在本地，這樣在頁(yè)面加載的時(shí)候網(wǎng)頁(yè)能使用本地資源，從而實(shí)現(xiàn)離線狀態(tài)下訪問(wèn)網(wǎng)頁(yè)應(yīng)用。舉個(gè)例子，通過(guò)離線存儲(chǔ)，你可以在沒(méi)有網(wǎng)絡(luò)的情況下閱讀公眾號(hào)的文章（當(dāng)然這只是技術(shù)上可行，微信目前沒(méi)有此功能）。<br />當(dāng)然離線存儲(chǔ)能容納的數(shù)據(jù)量是有限制，跟瀏覽器有關(guān)，目前Chrome支持5M。大家或多或少都知道cookie這個(gè)東西，它也是記錄用戶瀏覽數(shù)據(jù)的，比如百度那些根據(jù)你的搜索習(xí)慣給你推薦的廣告就是這種技術(shù)實(shí)現(xiàn)的，不過(guò)它的容量是4k。<br />技術(shù)細(xì)節(jié)大家可以忽略，但是關(guān)于離線存儲(chǔ)這個(gè)功能，大家可以發(fā)揮想象——假設(shè)離線存儲(chǔ)的容量是100個(gè)G甚至更多，瀏覽器就變成了一個(gè)超級(jí)應(yīng)用入口，所有網(wǎng)頁(yè)應(yīng)用都具備離線存儲(chǔ)和在線瀏覽的功能，這時(shí)候在線Office、在線記事本甚至在線PhotoShop都可以實(shí)現(xiàn)，我們的電腦只需要裝一個(gè)程序——瀏覽器。在這個(gè)假設(shè)中，瀏覽器將干掉Windows，一切用戶操作都在云端進(jìn)行！稍微有點(diǎn)難理解，大家可以仔細(xì)體會(huì)。<br />以下是運(yùn)用離線存儲(chǔ)的一個(gè)例子，這個(gè)提供在線便簽功能的網(wǎng)站無(wú)論有沒(méi)有網(wǎng)絡(luò)都可以訪問(wèn)，并且你記錄的所有便簽都會(huì)保存下來(lái)，很實(shí)用的網(wǎng)站，有興趣可以試一下。<br />科普先告一段落，雖然HTML5 有很多特性，但因?yàn)槠邢?，本文只能介紹跟營(yíng)銷有關(guān)的內(nèi)容，其他的特性很多是程序猿的事，如果大家反饋還要了解更多，我可以再寫(xiě)一篇具體介紹。<br />Part 2 HTML5 能怎么玩？<br />在了解完H5的一些基礎(chǔ)知識(shí)后，相信大家最關(guān)心的還是應(yīng)用層面的問(wèn)題——H5能做什么，有哪些玩法？接下來(lái)我將列舉一些典型的例子和大家探討：<br />幻燈片式玩法<br />以下這個(gè)特斯拉的例子相信很多人都看過(guò)，精美的圖片設(shè)計(jì)+簡(jiǎn)單的翻頁(yè)效果，在我的印象中大概3、4月份看到特斯拉這個(gè)HTML5 的時(shí)候，大家還不知道原來(lái)微信營(yíng)銷可以這么玩，記得那時(shí)候我們看到之后就在一周內(nèi)做了一個(gè)類似的HTML5 ，用于STC的品牌展示。當(dāng)然，在這之后HTML5 就千樹(shù)萬(wàn)樹(shù)梨花開(kāi)了。<br />這是H5最早期也是最典型的玩法，因?yàn)楹?jiǎn)單、實(shí)用，所以至今還很流行。其效果就是簡(jiǎn)單的圖片展示&翻頁(yè)交互，最終整體的表現(xiàn)很像幻燈片展示。<br />其實(shí)幻燈片式的HTML5 現(xiàn)在已經(jīng)出現(xiàn)了很多在線制作軟件供大家使用，所以制作成本在現(xiàn)在看來(lái)幾乎是等于零的，而在之前這樣一個(gè)應(yīng)用的開(kāi)發(fā)可能要將近一萬(wàn)（再一次見(jiàn)證了互聯(lián)網(wǎng)思維的破壞力）。當(dāng)然啦，這對(duì)于品牌主來(lái)說(shuō)是一個(gè)好事，因?yàn)楹芏鄷r(shí)候這種簡(jiǎn)單的展示已經(jīng)能滿足需求了，不需要花不必要的錢(qián)。<br />★ 應(yīng)用場(chǎng)景<br />由于制作簡(jiǎn)單，周期短，這種HTML5 展現(xiàn)形式適用于頻繁、小型的需求。用在線編輯器的話，不需要任何開(kāi)發(fā)，你只需要要配備一名設(shè)計(jì)和文案。<br />總結(jié)得不全，幻燈片式HTML5 可能有以下的應(yīng)用場(chǎng)景：<br />1、定期發(fā)布的內(nèi)容，幾乎零預(yù)算。這些內(nèi)容相對(duì)而言比較常規(guī)，但是有時(shí)微信圖文又無(wú)法達(dá)到理想的效果，通過(guò)H5的形式會(huì)更易于傳播，當(dāng)然前提是要有好的設(shè)計(jì)。比如數(shù)據(jù)報(bào)告、頻繁上線的新產(chǎn)品或功能、小型線下活動(dòng)邀請(qǐng)、活動(dòng)相冊(cè)等等。<br />2、結(jié)合熱點(diǎn)的營(yíng)銷，周期極短。這種情況下，時(shí)效性是非常重要的，如果開(kāi)發(fā)一個(gè)HTML5 用了半個(gè)月，熱點(diǎn)想必也結(jié)冰了。所以，應(yīng)該以最快的速度推出才是明智的選擇，而這時(shí)候引起廣泛傳播的關(guān)鍵就在于文案和設(shè)計(jì)。<br />此外，大家不要輕視這種短頻快的傳播，有時(shí)候它要比很多大投入的傳播來(lái)得有效。沒(méi)有人能完全掌握受眾的興趣點(diǎn)，所以一次大投入的傳播不一定就能出效果，但是多次熱點(diǎn)傳播出效果的概率從統(tǒng)計(jì)學(xué)的角度也要高一些。如上文所述，我們可以實(shí)現(xiàn)用戶在HTML5 中所有交互行為的監(jiān)測(cè)，因此，如果短頻快的傳播能配合有效的數(shù)據(jù)監(jiān)測(cè)，便可以進(jìn)行持續(xù)優(yōu)化，降低不確定性。<br />交互式動(dòng)畫(huà)<br />可口可樂(lè)這個(gè)案例在之前的風(fēng)云榜中推薦過(guò)，是運(yùn)用HTML5 繪圖功能的典型例子。當(dāng)然這里面的交互還是比較簡(jiǎn)單的，只不過(guò)它基本體現(xiàn)了交互式動(dòng)畫(huà)的感覺(jué)。整個(gè)可口可樂(lè)的時(shí)間軸是隨著用戶向上滑動(dòng)頁(yè)面“繪制”出來(lái)的。<br />其實(shí)除了這種敘事型的HTML5 動(dòng)畫(huà)，我們能看到的大多數(shù)HTML5 游戲也都都屬于這一類，比如神經(jīng)貓、打企鵝、2048等等。最近也有一個(gè)比較火的HTML5 游戲叫“財(cái)務(wù)包子鋪”，在這個(gè)游戲中用戶扮演包子鋪的創(chuàng)業(yè)老板，在事業(yè)發(fā)展的不同階段做出經(jīng)營(yíng)決策，最終登上人生巔峰。雖然游戲中植入了赤裸裸的產(chǎn)品推廣（知乎的一本新書(shū)），但最后還是取得了3天破300萬(wàn)PV的成績(jī)。<br />這些類型各異的HTML5 應(yīng)用，本質(zhì)上都是基于H5的動(dòng)畫(huà)技術(shù)做的。它們所涉及的相關(guān)動(dòng)畫(huà)技術(shù)主要有HTML5 的Canvas/SVG，以及JS、css3，目前大部分HTML5 的動(dòng)畫(huà)效果還是用JS實(shí)現(xiàn)的，實(shí)現(xiàn)的效果類似PPT中的動(dòng)畫(huà)功能，只能實(shí)現(xiàn)元素的平移、旋轉(zhuǎn)、隱現(xiàn)等等。事實(shí)上通過(guò)JS+Canvas/SVG+css3可以實(shí)現(xiàn)非常復(fù)雜的交互式動(dòng)畫(huà)，最直觀的就是HTML5 游戲，比如神經(jīng)貓，還有上文提到的3D版坦克大戰(zhàn)。<br />那么，HTML5 到底能實(shí)現(xiàn)什么樣的動(dòng)畫(huà)效果呢？我想這應(yīng)該是大家在做HTML5 時(shí)最頭疼的問(wèn)題，因?yàn)椴恢滥茏龀墒裁礃樱阋簿筒恢缽暮蜗率?。所以下面我給大家介紹一個(gè)網(wǎng)站：http://fff.cmiscm.com/，在這個(gè)網(wǎng)站中，你幾乎能看到所有HTML5 能夠?qū)崿F(xiàn)的動(dòng)畫(huà)效果，下次如果需要做HTML5 的時(shí)候就可以跟開(kāi)發(fā)說(shuō)“你看，就是這個(gè)效果”。<br />以下是該網(wǎng)站上幾個(gè)示例的截圖：<br />抓綿羊：你可以在奔跑的羊群中隨意抓取并放到任意位置<br />種樹(shù)：在屏幕任意地方點(diǎn)擊都會(huì)在相應(yīng)的地方種一顆樹(shù)，你可以看到樹(shù)的生長(zhǎng)過(guò)程。<br />3D罐頭：css3 3D的好展示，你可以看到三維罐頭的任意角度<br />照片處理：你可以把照片藝術(shù)化，圖示為處理過(guò)程截圖<br />★ 應(yīng)用場(chǎng)景<br />交互式動(dòng)畫(huà)類型的HTML5 制作周期和成本比較高，需要提前規(guī)劃。除了創(chuàng)意、文案、設(shè)計(jì)這些以外，開(kāi)發(fā)周期較長(zhǎng)，優(yōu)質(zhì)的HTML5 大約在兩周到4周左右，也有可能更長(zhǎng)。<br />這種類型的HTML5 要找靠譜的供應(yīng)商，因?yàn)閺?fù)雜交互做出來(lái)的效果，在用戶看來(lái)只有好和垃圾兩種層次，所以慎重。當(dāng)然如果你自己要花血本自建團(tuán)隊(duì)也不是不行——產(chǎn)品經(jīng)理、設(shè)計(jì)師、前端工程師、PHP工程師（涉及表單、登錄、評(píng)論等元素的時(shí)候需要），各一枚就夠了。<br />以下是總結(jié)的應(yīng)用場(chǎng)景：<br />1、中小型活動(dòng)/品牌事件的傳播，預(yù)算不多、周期較短。這種情況一般就是某些新品發(fā)布、企業(yè)招聘、公關(guān)事件、中型會(huì)議等的傳播。此時(shí)你需要權(quán)衡周期和成本的因素。<br />一般來(lái)說(shuō)一周以內(nèi)的時(shí)間不太可能做出優(yōu)質(zhì)的HTML5 ，這時(shí)候你可能要考慮幻燈片式的簡(jiǎn)易開(kāi)發(fā)或者參考已有的作品，然后著重從設(shè)計(jì)和文案上下功夫。如果有一到兩周的時(shí)間可以嘗試做一些輕交互的HTML5 ，除了常見(jiàn)的那些平移、縮放、淡入淡出的動(dòng)效以外，在這里我比較建議大家嘗試一下css3 3D的效果，這是一個(gè)趨勢(shì)，當(dāng)然成本也會(huì)相應(yīng)的上升一個(gè)量級(jí)。<br />2、大型活動(dòng)/品牌事件的傳播，預(yù)算充足、計(jì)劃性強(qiáng)、周期較長(zhǎng)。一般大家看到的那些美輪美奐并且極具傳播性的HTML5 基本上都屬于這一類，比如上文提到的可口可樂(lè)“分享快樂(lè)128年”，以及我們之前分享過(guò)的潘婷“一封來(lái)自1947年的明信片”。像這一類在美學(xué)、交互和故事性上都表現(xiàn)突出的案例，都不是一兩周的功夫能做出來(lái)的，不計(jì)算創(chuàng)意、設(shè)計(jì)和文案的時(shí)間，光是開(kāi)發(fā)和調(diào)試也要小一個(gè)月。<br />因此大家看到好的作品要理性看待，不能覺(jué)得很?；蛘呃习逭f(shuō)好就想著也做一個(gè)，其實(shí)像這種交互與故事一體的應(yīng)用，如果時(shí)間不夠只完成一半，整個(gè)HTML5 基本是沒(méi)法用的，也就是所有之前的投入都是無(wú)用功。這也是為什么有很多供應(yīng)商無(wú)法在指定時(shí)間交付的原因，可能一開(kāi)始就在做一個(gè)完不成的任務(wù)。<br />功能型 HTML5<br />看一下以下的兩個(gè)例子，第一個(gè)是百度針對(duì)地鐵漲價(jià)做的HTML5 ，它可以計(jì)算你每天坐地鐵要多少錢(qián)并且實(shí)時(shí)顯示大家的評(píng)論；第二個(gè)是STC的社交移動(dòng)風(fēng)云榜，很簡(jiǎn)單，就是精品HTML5 的展示：<br />這兩個(gè)H5都有一個(gè)特點(diǎn)，除了針對(duì)受眾的熱點(diǎn)內(nèi)容傳播以外，它們很像一個(gè)“供用戶重復(fù)使用”的產(chǎn)品，這就是所謂的功能型H5。其實(shí)大家看到風(fēng)云榜可能會(huì)覺(jué)得它只是一個(gè)再簡(jiǎn)單不過(guò)的網(wǎng)頁(yè)，但如果從它滿足用戶需求并產(chǎn)生重復(fù)“使用”行為的角度，它其實(shí)是一個(gè)產(chǎn)品，事實(shí)上我們從一開(kāi)始就是把它當(dāng)產(chǎn)品來(lái)運(yùn)營(yíng)的，關(guān)注Social Talent的朋友可能會(huì)有所感受——每周更新、定期群發(fā)推薦HTML5 的圖文、欄目更新通知等等。<br />功能型HTML5 的獨(dú)特價(jià)值在于，除了具備傳播性以外，它通過(guò)用戶的重復(fù)使用行為使得HTML5 的傳播是一個(gè)持續(xù)不斷的過(guò)程，這一點(diǎn)是一般的HTML5 所不具備的。風(fēng)云榜首次發(fā)布時(shí)轉(zhuǎn)發(fā)6w+多，目前每月的訪問(wèn)量都在10w左右，不算多，但是給我們帶來(lái)的流量轉(zhuǎn)化都是精準(zhǔn)的，關(guān)注我們的大多還是從事?tīng)I(yíng)銷相關(guān)職業(yè)的朋友。<br />個(gè)人覺(jué)得web應(yīng)用肯定是未來(lái)發(fā)展的方向，就像上文所說(shuō)的，很有可能未來(lái)的操作系統(tǒng)將被瀏覽器所取代，服務(wù)和應(yīng)用將進(jìn)入完全的云世界。當(dāng)然距離這種假設(shè)還比較遠(yuǎn)，但唯一大家可以放心遵守的原則，就是聚焦于用戶需求。<br />我所說(shuō)的功能型HTML5 ，是同時(shí)聚焦于用戶需求并且注重傳播性的H5輕應(yīng)用，也就是在設(shè)計(jì)HTML5 的時(shí)候除了考慮傳播的問(wèn)題以外，也要思考如何把它變成一個(gè)持續(xù)運(yùn)營(yíng)的產(chǎn)品。這里面其實(shí)是思考角度的問(wèn)題，從“我要傳播什么”到“我希望用戶傳播什么”的轉(zhuǎn)變。<br />★ 應(yīng)用場(chǎng)景<br />輕交互重功能的功能型HTML5 制作周期較短、成本也不高，成功的關(guān)鍵不在于酷炫的交互，而在于用戶需求的把握以及后續(xù)的運(yùn)營(yíng)。<br />因此，這一類HTML5 需要的是一名高水平的的產(chǎn)品經(jīng)理，而以設(shè)計(jì)、開(kāi)發(fā)為輔。功能型HTML5 目前沒(méi)有太多成熟的例子，不過(guò)我認(rèn)為離線存儲(chǔ)的技術(shù)可能會(huì)是功能型HTML5 的應(yīng)用重點(diǎn)，大家可以關(guān)注一下。<br />以下是總結(jié)的應(yīng)用場(chǎng)景：<br />1、品牌賬號(hào)的粉絲運(yùn)營(yíng)。功能型HTML5 由于具備一定的產(chǎn)品特性，其大的價(jià)值就是提高粉絲活躍度和忠誠(chéng)度。我們需要根據(jù)本身品牌的形象定位以及受眾的特性設(shè)計(jì)功能型HTML5 ，要將品牌或產(chǎn)品的功能性特征抽象到生活方式或者精神追求的層次。<br />舉個(gè)例子，賣(mài)洗手液的可以抽象為健康生活方式，設(shè)計(jì)一個(gè)改善生活健康狀態(tài)的功能型HTML5 ；服裝品牌可以抽象為追求時(shí)尚前沿，設(shè)計(jì)一個(gè)定期更新時(shí)尚潮流資訊的功能型HTML5 。事實(shí)上，以粉絲需求為中心的功能型HTML5 將潛移默化的提升品牌影響力，在提升忠誠(chéng)度的同時(shí)帶來(lái)持續(xù)的口碑傳播。<br />2、結(jié)合熱點(diǎn)內(nèi)容的品牌傳播。這種類型的傳播是最常見(jiàn)的，但是往往很多結(jié)合熱點(diǎn)的HTML5 傳播都是一次性?shī)蕵?lè)消費(fèi)，大家看過(guò)就忘了。其實(shí)如果能從用戶需求挖掘和產(chǎn)品運(yùn)營(yíng)的角度去思考，許多針對(duì)熱點(diǎn)的HTML5 傳播都有很大提升的空間。<br />近來(lái)大家都喜歡報(bào)道習(xí)大大和彭麻麻的“私生活”或者非正式領(lǐng)導(dǎo)會(huì)晤之類的，如果有人能做一個(gè)類似微博“學(xué)習(xí)粉絲團(tuán)”那樣，定期更新“學(xué)習(xí)資訊”的功能型HTML5 ，想來(lái)必火。<br />Part 3 HTML5 如何推廣？<br />實(shí)際上HTML5 可以推廣的渠道有限，不像App的推廣有各類應(yīng)用商店的流量。關(guān)于這個(gè)問(wèn)題可以說(shuō)的不多，我僅針對(duì)性的提出幾點(diǎn)建議：<br />1、從用戶角度挖掘HTML5 的價(jià)值點(diǎn)，寫(xiě)一篇軟文。通過(guò)圖文群發(fā)來(lái)推廣HTML5 無(wú)疑是最重要的方式，但是如果只是簡(jiǎn)單硬性推廣，比如宣布今天創(chuàng)新互聯(lián)上線了一個(gè)高大上云云的HTML5 ，然后就讓用戶點(diǎn)擊“閱讀原文”自己看，顯然這種新聞通稿式的推廣不會(huì)有太好的效果。<br />一個(gè)好的HTML5 一定具備打動(dòng)用戶的價(jià)值點(diǎn)，從一個(gè)角度切入寫(xiě)一篇軟文，無(wú)論通過(guò)投稿的方式還是大號(hào)轉(zhuǎn)發(fā)都能給你帶來(lái)意想不到的傳播效果。投入再大再精彩的HTML5 ，如果沒(méi)有好的推廣就只能孤芳自賞，所以哪怕是留點(diǎn)推廣預(yù)算也是值得的。<br />2、盡你所能利用所有能推廣HTML5 的渠道。目前比較常用的方式：通過(guò)公眾號(hào)的圖文群發(fā)推廣、微信群推廣、線下二維碼推廣，以及前面提到的KOL轉(zhuǎn)發(fā)和投稿等。這里主要說(shuō)一下有關(guān)微信群的幾點(diǎn)建議。<br />首先，你需要列出所有你能用到的資源，并發(fā)動(dòng)內(nèi)部人員轉(zhuǎn)發(fā)，當(dāng)然前提是HTML5 做得很棒。值得注意的一點(diǎn)是，每個(gè)微信群其實(shí)都有自己的定位——工作、生活或者閑聊扯淡，所以為了提升打開(kāi)率可以適當(dāng)?shù)臑椴煌奈⑿湃憾ㄖ妻D(zhuǎn)發(fā)的文案，比如以上文的STC風(fēng)云榜為例，對(duì)于工作學(xué)習(xí)為主的群可以是“品牌HTML5 做成這樣也是蠻拼的！”，如果是更加生活化的群就可以是“史上最好玩的HTML5 應(yīng)用，根本停不下來(lái)”之類的，但是如果H5的調(diào)性實(shí)在和微信群的定位不搭，建議不要造成打擾。<br />3、充分利用“閱讀原文”和自定義菜單。由于微信的限制，圖文中唯一能跳轉(zhuǎn)的鏈接就是“閱讀原文”。關(guān)于如何利用好“閱讀原文”有三點(diǎn)小tips：<br />不要浪費(fèi)每一篇圖文的“閱讀原文”，可能的話對(duì)于每一篇圖文用不同的文案引導(dǎo)點(diǎn)擊；<br />如果你的目的是推廣HTML5 ，不要在閱讀原文的提示之后或者閱讀原文引導(dǎo)和正文之間插播公眾號(hào)的廣告；<br />通過(guò)字體或者顏色的視覺(jué)跳躍引起讀者的注意，而且不要長(zhǎng)期使用同一個(gè)格式，因?yàn)楫?dāng)用戶習(xí)慣了固定的格式之后會(huì)不自覺(jué)的忽略這些內(nèi)容。<br /><p>此外，自定義菜單也是需要充分利用的功能，一般來(lái)說(shuō)新增粉絲都會(huì)瀏覽一遍公眾號(hào)的菜單，根據(jù)我們的數(shù)據(jù)監(jiān)測(cè)，平均每個(gè)菜單項(xiàng)會(huì)有20%的新增粉絲點(diǎn)擊。假如你的賬號(hào)每天能有500個(gè)粉絲增長(zhǎng)，就會(huì)有100個(gè)人以上點(diǎn)擊了菜單的某一項(xiàng)，因?yàn)檫@是持續(xù)進(jìn)行的主動(dòng)行為，由此為HTML5 帶來(lái)的瀏覽量可能比圖文群發(fā)還要高。</p><br /><p>關(guān)鍵詞：創(chuàng)新互聯(lián),成都品牌<a ><strong>網(wǎng)站建設(shè)公司</strong></a>,<a ><strong>網(wǎng)站制作</strong>公司</a>,<a ><strong>重慶網(wǎng)站建設(shè)</strong></a>,<a href="http://chinadenli.net/"><strong>網(wǎng)站設(shè)計(jì)</strong></a>,網(wǎng)站建設(shè),手機(jī)<a ><strong>網(wǎng)站開(kāi)發(fā)</strong></a></p> <p>
本文標(biāo)題：<a href="http://chinadenli.net/news/170259.html">HTML5品牌營(yíng)銷實(shí)戰(zhàn)指南</a>
<br>
文章源于：<a href="http://chinadenli.net/news/170259.html">http://chinadenli.net/news/170259.html</a>
</p>
<p>
<a href="http://chinadenli.net/" target="_blank">成都網(wǎng)站建設(shè)公司</a>_<a target="_blank">創(chuàng)新互聯(lián)</a>，為您提供<a href="http://chinadenli.net/news/yidongjianshe/">移動(dòng)網(wǎng)站建設(shè)</a>、<a href="http://chinadenli.net/news/mbxdh/">面包屑導(dǎo)航</a>、<a href="http://chinadenli.net/news/keywordsseo/">關(guān)鍵詞優(yōu)化</a>、<a href="http://chinadenli.net/news/jingtai/">靜態(tài)網(wǎng)站</a>、<a href="http://chinadenli.net/news/xiangyingshi/">響應(yīng)式網(wǎng)站</a>、<a href="http://chinadenli.net/news/xiaochengxu/">小程序開(kāi)發(fā)</a> </p>
<p class="adpic">
<a href="http://chinadenli.net/service/ad.html" target="_blank" class="ad">廣告</a>
<a href="" target="_blank" class="adimg"><img src=""></a>
</p>
<p class="copy">
聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：
<a href="http://chinadenli.net/" target="_blank">創(chuàng)新互聯(lián)</a>
</p>
</div>
<div id="vfzphfz" class="newsmorelb">
<p>猜你還喜歡下面的內(nèi)容</p>
<ul>
<li>
<a href="/news/170254.html">強(qiáng)勢(shì)品牌建立 網(wǎng)站推廣企業(yè)三力闖市場(chǎng)</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170252.html">原創(chuàng)文章那點(diǎn)事兒，你知嗎？</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170250.html">字體與排版應(yīng)用指南</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170248.html">網(wǎng)站優(yōu)化的四種特性</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170240.html">成都軟件公司報(bào)價(jià)應(yīng)該怎么看</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170238.html">成都企業(yè)手機(jī)網(wǎng)站有必要制作嗎？</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170236.html">網(wǎng)站需要備案嗎？</a>
<span>2022-06-21</span>
</li><li>
<a href="/news/170234.html">如何做好手機(jī)網(wǎng)站seo優(yōu)化?</a>
<span>2022-06-21</span>
</li> </ul>
</div>
</div>
<div id="rndhbvv" class="col-lg-3 noneb">
<a href="http://chinadenli.net/waimao.html" title="外貿(mào)網(wǎng)站制作" target="_blank"><img src="/upload/news/waimaowangzhanjianshe.png" alt="外貿(mào)網(wǎng)站制作" class="img-responsive"></a>
<div id="rjxvzzb" class="bkright">
<p><a href="http://chinadenli.net/news/jianshe/">網(wǎng)站建設(shè)知識(shí)</a></p>
<ul>
<li>
<a class="text_overflow" href="/news/170255.html">Web前端構(gòu)建工具版本號(hào)管理方案思考</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170249.html">選擇網(wǎng)站域名常用哪些技巧?</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170239.html">企業(yè)網(wǎng)站如何防范勒索網(wǎng)站攻擊？</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170237.html">SEO優(yōu)化時(shí)如何準(zhǔn)確把握關(guān)鍵詞密度?</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170235.html">淺談百度蜘蛛IP的意義</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170233.html">慎重的使用向右的指向性符號(hào)</a>
<span>2022-06-21</span>
</li> <li>
<a class="text_overflow" href="/news/170232.html">交互式網(wǎng)頁(yè)設(shè)計(jì)之新手入門(mén)手冊(cè)</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170231.html">企業(yè)衡量網(wǎng)站SEO優(yōu)化工作成果好壞的標(biāo)準(zhǔn)具體是哪些？</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170230.html">網(wǎng)站推廣企業(yè)實(shí)施品牌戰(zhàn)略，受益良多!</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170229.html">創(chuàng)新互聯(lián)淺談什么是Web</a>
<span>2022-06-21</span>
</li><li>
<a class="text_overflow" href="/news/170228.html">網(wǎng)頁(yè)設(shè)計(jì)中7個(gè)令人抓狂的錯(cuò)誤</a>
<span>2022-06-21</span>
</li> </ul>
</div>
<div id="dnhxbjn" class="bkright tag">
<p><a href="http://chinadenli.net/hangye/" target="_blank">行業(yè)網(wǎng)站建設(shè)</a></p>
<ul>
<li id="pptrlbv" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/sdgz/" target="_blank">水電改造</a>
</li><li id="thdftxn" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/shipaifang/" target="_blank">石牌坊</a>
</li><li id="zvjnhpf" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/weilanhulan/" target="_blank">圍欄護(hù)欄</a>
</li><li id="pdbnjpl" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/gaokongche/" target="_blank">高空作業(yè)車租賃</a>
</li><li id="fjjzzvt" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/hntjbg/" target="_blank">混凝土攪拌罐</a>
</li><li id="rrzdhxr" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/iso/" target="_blank">iso認(rèn)證</a>
</li><li id="jbjvdlx" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/qchs/" target="_blank">報(bào)廢汽車回收</a>
</li><li id="znvrnfn" class="col-lg-6 col-md-6 col-sm-6 col-xs-6">
<a href="http://chinadenli.net/hangye/baiwuyu/" target="_blank">白烏魚(yú)</a>
</li> </ul>
</div>
</div>
</div>
<footer>
<div id="vrdlzpf" class="carousel-inner footjz">
<div id="rjdlhxr" class="container">
<i class="icon iconfont zbw"></i>
高品質(zhì)定制 <i class="icon iconfont"></i>
跨終端自動(dòng)兼容 <i class="icon iconfont"></i>
節(jié)約開(kāi)發(fā)成本 <i class="icon iconfont"></i>
開(kāi)發(fā)周期短 <i class="icon iconfont"></i>
一體化服務(wù)
<button type="button" class="btn btn-default btn-lg" onClick="window.location.href='tencent://message/?uin=631063699&Site=&Menu=yes'"> 立即開(kāi)始2800定制網(wǎng)站建設(shè)</button>
<button type="button" class="btn btn-default btn-xs" onClick="window.location.href='tencent://message/?uin=631063699&Site=&Menu=yes'"> 2800定制網(wǎng)站建設(shè)</button>
</div>
</div>
<div id="bphlplh" class="carousel-inner bqsy">
<div id="tfvpbbv" class="container">
<div id="tbrvhnf" class="lxfs">
<h4 class="yutelnone">028-86922220 13518219792</h4>
<h4 class="yutelblock"><a href="tel:02886922220">028-86922220</a> <a href="tel:13518219792">13518219792</a></h4>
<a class="btn btn-default" href="tencent://message/?uin=532337155&Site=&Menu=yes" role="button">網(wǎng)站建設(shè)<span>QQ</span>：532337155</a>
<a class="btn btn-default" href="tencent://message/?uin=631063699&Site=&Menu=yes" role="button">營(yíng)銷推廣<span>QQ</span>：631063699</a>
<a class="btn btn1 btn-default" href="mqqwpa://im/chat?chat_type=wpa&uin=532337155&version=1&src_type=web&web_src=oicqzone.com" role="button">網(wǎng)站制作<span>QQ</span>：532337155</a>
<a class="btn btn1 btn-default" href="mqqwpa://im/chat?chat_type=wpa&uin=631063699&version=1&src_type=web&web_src=oicqzone.com" role="button">營(yíng)銷推廣<span>QQ</span>：631063699</a>
<a class="btn btn-default nonea" href="tencent://message/?uin=1683211881&Site=&Menu=yes" role="button">售后QQ：1683211881</a>
<div id="ntxzrdb" class="dz">專注：
<a target="_blank">網(wǎng)站設(shè)計(jì)制作</a><a target="_blank">服務(wù)器托管</a><a target="_blank">定制網(wǎng)站建設(shè)</a><a target="_blank">成都網(wǎng)站設(shè)計(jì)</a><a target="_blank">成都制作網(wǎng)站</a> <address>地址：成都太升南路288號(hào)錦天國(guó)際A幢10樓</address>
</div>
</div>
<div id="hhpfnpt" class="bzdh dz"><img src="../imges/bottom_logo.png" alt="創(chuàng)新互聯(lián)">
<p><a href="http://chinadenli.net/menu.html" target="_blank">成都創(chuàng)新互聯(lián)科技有限公司</a><br>
Tel：400-028-6601（7x24h）</p></div>
</div>
</div>
</footer>
<footer>
<div class="friendship-link">
<p>感谢您访问我们的网站，您可能还对以下资源感兴趣：</p>
<a href="http://chinadenli.net/" title="欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区">欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区</a>
<div class="friend-links">
</div>
</div>
</footer>
<a href="http://www.hfcsx.net" target="_blank">亚洲黑人精品一区二区欧美</a>|
<a href="http://www.fangyuzhao.net" target="_blank">很黄很污在线免费观看</a>|
<a href="http://www.qqch.net" target="_blank">欧美午夜一区二区福利视频</a>|
<a href="http://www.sekine-k.net" target="_blank">日韩特级黄色大片在线观看</a>|
<a href="http://www.syxxx.net" target="_blank">欧美精品久久男人的天堂</a>|
<a href="http://www.samtina.net" target="_blank">欧美精品久久99九九</a>|
<a href="http://www.haoyanghs.net" target="_blank">少妇成人精品一区二区</a>|
<a href="http://www.gdfu.net" target="_blank">亚洲内射人妻一区二区</a>|
<a href="http://www.qdtaxi.net" target="_blank">精品国产日韩一区三区</a>|
<a href="http://www.knitplus.net" target="_blank">区一区二区三中文字幕</a>|
<a href="http://www.cvyoo.net" target="_blank">少妇特黄av一区二区三区</a>|
<a href="http://www.xingchenge.net" target="_blank">成人综合网视频在线观看</a>|
<a href="http://www.114aigo.net" target="_blank">高潮日韩福利在线观看</a>|
<a href="http://www.haifeng268.net" target="_blank">亚洲国产精品久久琪琪</a>|
<a href="http://www.xiangpiren.net" target="_blank">日本不卡一本二本三区</a>|
<a href="http://www.kissedu.net" target="_blank">日韩欧美中文字幕人妻</a>|
<a href="http://www.jinyimeng.net" target="_blank">欧美日韩国产精品自在自线</a>|
<a href="http://www.zishanmao.net" target="_blank">亚洲一区二区三区四区性色av</a>|
<a href="http://www.jiuchuan.net" target="_blank">欧美国产日韩变态另类在线看</a>|
<a href="http://www.ndcar.net" target="_blank">欧洲日韩精品一区二区三区</a>|
<a href="http://www.juneshine.net" target="_blank">国产精品福利一级久久</a>|
<a href="http://www.kakashow.net" target="_blank">大香蕉久久精品一区二区字幕</a>|
<a href="http://www.fs-keying.net" target="_blank">久久精品国产亚洲熟女</a>|
<a href="http://www.jjtec.net" target="_blank">精品国产品国语在线不卡</a>|
<a href="http://www.gtrue.net" target="_blank">欧美极品欧美精品欧美</a>|
<a href="http://www.aeonmed.net" target="_blank">欧美日韩综合综合久久久</a>|
<a href="http://www.sswhcm.net" target="_blank">亚洲婷婷开心色四房播播</a>|
<a href="http://www.bazai.net" target="_blank">91插插插外国一区二区</a>|
<a href="http://www.trosco.net" target="_blank">我想看亚洲一级黄色录像</a>|
<a href="http://www.hljyb.net" target="_blank">日韩午夜老司机免费视频</a>|
<a href="http://www.boeryang.net" target="_blank">亚洲一区二区三区中文久久</a>|
<a href="http://www.jiuyecheng.net" target="_blank">亚洲精品伦理熟女国产一区二区</a>|
<a href="http://www.liuxiaoning.net" target="_blank">伊人网免费在线观看高清版</a>|
<a href="http://www.jlkq.net" target="_blank">久久夜色精品国产高清不卡</a>|
<a href="http://www.gtrue.net" target="_blank">欧美一区二区三区高潮菊竹
</a>|
<a href="http://www.daxingwujin.net" target="_blank">免费亚洲黄色在线观看</a>|
<a href="http://www.comsone.net" target="_blank">九九热精品视频免费在线播放</a>|
<a href="http://www.xjfdc.net" target="_blank">91精品国自产拍老熟女露脸</a>|
<a href="http://www.e6tong.net" target="_blank">激情五月综五月综合网</a>|
<a href="http://www.zaozaojiao.net" target="_blank">日本午夜福利视频免费观看</a>|
<a href="http://www.sghm.net" target="_blank">国产传媒精品视频一区</a>|
<script>
(function(){
var bp = document.createElement('script');
var curProtocol = window.location.protocol.split(':')[0];
if (curProtocol === 'https') {
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
}
else {
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
}
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(bp, s);
})();
</script>
</body><div id="dhdfn" class="pl_css_ganrao" style="display: none;"><div id="dhdfn"></div><ins id="dhdfn"><ruby id="dhdfn"><font id="dhdfn"><tt id="dhdfn"></tt></font></ruby></ins><strong id="dhdfn"></strong><nobr id="dhdfn"></nobr><strike id="dhdfn"><legend id="dhdfn"><ol id="dhdfn"><meter id="dhdfn"></meter></ol></legend></strike><thead id="dhdfn"><strong id="dhdfn"><dl id="dhdfn"><listing id="dhdfn"></listing></dl></strong></thead><meter id="dhdfn"><p id="dhdfn"><thead id="dhdfn"><sup id="dhdfn"></sup></thead></p></meter><pre id="dhdfn"><i id="dhdfn"></i></pre><th id="dhdfn"></th><sup id="dhdfn"></sup><em id="dhdfn"><nobr id="dhdfn"></nobr></em><listing id="dhdfn"><u id="dhdfn"><output id="dhdfn"><rp id="dhdfn"></rp></output></u></listing><label id="dhdfn"></label><menuitem id="dhdfn"></menuitem><legend id="dhdfn"><u id="dhdfn"><optgroup id="dhdfn"><rp id="dhdfn"></rp></optgroup></u></legend><form id="dhdfn"><var id="dhdfn"><label id="dhdfn"><label id="dhdfn"></label></label></var></form><acronym id="dhdfn"></acronym><i id="dhdfn"><p id="dhdfn"></p></i><u id="dhdfn"><optgroup id="dhdfn"></optgroup></u><video id="dhdfn"><th id="dhdfn"></th></video><form id="dhdfn"><font id="dhdfn"><tt id="dhdfn"><meter id="dhdfn"></meter></tt></font></form><video id="dhdfn"><meter id="dhdfn"><small id="dhdfn"><u id="dhdfn"></u></small></meter></video><rp id="dhdfn"><em id="dhdfn"></em></rp><strong id="dhdfn"></strong><ruby id="dhdfn"><font id="dhdfn"></font></ruby><big id="dhdfn"><acronym id="dhdfn"><mark id="dhdfn"><address id="dhdfn"></address></mark></acronym></big><sup id="dhdfn"></sup><pre id="dhdfn"><legend id="dhdfn"><strike id="dhdfn"><legend id="dhdfn"></legend></strike></legend></pre><th id="dhdfn"><listing id="dhdfn"><mark id="dhdfn"><output id="dhdfn"></output></mark></listing></th><form id="dhdfn"><strong id="dhdfn"></strong></form><strike id="dhdfn"></strike><rp id="dhdfn"></rp><menuitem id="dhdfn"><dfn id="dhdfn"><sub id="dhdfn"><font id="dhdfn"></font></sub></dfn></menuitem><track id="dhdfn"><nobr id="dhdfn"></nobr></track><address id="dhdfn"><thead id="dhdfn"></thead></address><progress id="dhdfn"></progress><pre id="dhdfn"><style id="dhdfn"></style></pre><style id="dhdfn"><legend id="dhdfn"></legend></style><menuitem id="dhdfn"></menuitem><ruby id="dhdfn"><video id="dhdfn"></video></ruby><menuitem id="dhdfn"><form id="dhdfn"><sub id="dhdfn"><video id="dhdfn"></video></sub></form></menuitem><small id="dhdfn"></small><u id="dhdfn"><label id="dhdfn"><rp id="dhdfn"><track id="dhdfn"></track></rp></label></u><dfn id="dhdfn"></dfn><var id="dhdfn"></var><big id="dhdfn"><meter id="dhdfn"></meter></big><rp id="dhdfn"><track id="dhdfn"></track></rp><listing id="dhdfn"><var id="dhdfn"></var></listing><thead id="dhdfn"><em id="dhdfn"></em></thead><rp id="dhdfn"><track id="dhdfn"></track></rp><optgroup id="dhdfn"><rp id="dhdfn"><track id="dhdfn"><nobr id="dhdfn"></nobr></track></rp></optgroup><track id="dhdfn"><b id="dhdfn"></b></track><video id="dhdfn"><th id="dhdfn"><listing id="dhdfn"><u id="dhdfn"></u></listing></th></video><font id="dhdfn"><tt id="dhdfn"><meter id="dhdfn"><span id="dhdfn"></span></meter></tt></font><meter id="dhdfn"></meter><track id="dhdfn"><nobr id="dhdfn"></nobr></track><listing id="dhdfn"><var id="dhdfn"></var></listing><strike id="dhdfn"></strike><tt id="dhdfn"></tt><dl id="dhdfn"><pre id="dhdfn"></pre></dl><pre id="dhdfn"><strike id="dhdfn"></strike></pre><legend id="dhdfn"><big id="dhdfn"><acronym id="dhdfn"><span id="dhdfn"></span></acronym></big></legend><form id="dhdfn"></form><menuitem id="dhdfn"><ins id="dhdfn"><ruby id="dhdfn"><video id="dhdfn"></video></ruby></ins></menuitem><style id="dhdfn"><listing id="dhdfn"><var id="dhdfn"><label id="dhdfn"></label></var></listing></style><label id="dhdfn"><label id="dhdfn"></label></label><font id="dhdfn"><tt id="dhdfn"><mark id="dhdfn"><address id="dhdfn"></address></mark></tt></font><meter id="dhdfn"></meter><legend id="dhdfn"></legend><style id="dhdfn"></style><menuitem id="dhdfn"><dfn id="dhdfn"></dfn></menuitem><form id="dhdfn"></form><dfn id="dhdfn"><strong id="dhdfn"></strong></dfn><strong id="dhdfn"><style id="dhdfn"></style></strong><nobr id="dhdfn"><dfn id="dhdfn"><form id="dhdfn"><strong id="dhdfn"></strong></form></dfn></nobr><pre id="dhdfn"><form id="dhdfn"></form></pre><strong id="dhdfn"><style id="dhdfn"></style></strong><output id="dhdfn"><rp id="dhdfn"><track id="dhdfn"><nobr id="dhdfn"></nobr></track></rp></output><pre id="dhdfn"><pre id="dhdfn"><listing id="dhdfn"><u id="dhdfn"></u></listing></pre></pre><form id="dhdfn"><sub id="dhdfn"></sub></form><strong id="dhdfn"></strong><i id="dhdfn"><dfn id="dhdfn"><form id="dhdfn"><video id="dhdfn"></video></form></dfn></i><style id="dhdfn"><legend id="dhdfn"></legend></style><u id="dhdfn"><label id="dhdfn"></label></u><legend id="dhdfn"><big id="dhdfn"><meter id="dhdfn"><span id="dhdfn"></span></meter></big></legend><dl id="dhdfn"><pre id="dhdfn"></pre></dl><th id="dhdfn"><listing id="dhdfn"><var id="dhdfn"><optgroup id="dhdfn"></optgroup></var></listing></th><strike id="dhdfn"><legend id="dhdfn"><label id="dhdfn"><pre id="dhdfn"></pre></label></legend></strike><font id="dhdfn"></font><menuitem id="dhdfn"></menuitem><form id="dhdfn"><strong id="dhdfn"></strong></form><thead id="dhdfn"></thead><span id="dhdfn"></span><strike id="dhdfn"><label id="dhdfn"></label></strike><big id="dhdfn"></big><rp id="dhdfn"></rp><output id="dhdfn"></output><dl id="dhdfn"><pre id="dhdfn"></pre></dl><big id="dhdfn"><acronym id="dhdfn"><span id="dhdfn"><address id="dhdfn"></address></span></acronym></big><legend id="dhdfn"></legend></div>
</html>