基于HTML5技術(shù)的廣告設(shè)計應(yīng)用及其特征分析

摘 要：由于當(dāng)代手機、平板電腦等移動智能設(shè)備有著良好的移動性、交互性以及便攜性，移動浪潮開始在人類社會普及并發(fā)展，且對人類受眾產(chǎn)生了深而遠的影響。HTML5依托于大數(shù)據(jù)可以對用戶的需求、興趣進行分析，從而準(zhǔn)確地給用戶推薦適合于自身的廣告信息。HTML5廣告的分類和表現(xiàn)形式多種多樣，它作為新媒體的新興產(chǎn)物，在未來幾年里被使用的頻率會呈現(xiàn)上升趨勢，并且在技術(shù)與形式上還會不斷更新。

關(guān)鍵詞：HTML5廣告;新媒體;移動端;表現(xiàn)形式

0 引言

結(jié)合當(dāng)代智能手機、Pod、電子書等移動設(shè)備良好的移動性、交互性以及便攜性，流動性的浪潮已經(jīng)開始在人類社會中傳播和發(fā)展，且對人類受眾產(chǎn)生了深遠的影響。HTML5①是移動端互聯(lián)網(wǎng)發(fā)展的產(chǎn)物之一，它也是標(biāo)準(zhǔn)通用標(biāo)記語言（GML）下的超文本標(biāo)記語言（HTML）的應(yīng)用。此類技術(shù)徹底顛覆了傳統(tǒng)廣告的形式格局，PC端互聯(lián)網(wǎng)不再是及時滿足人類獲取信息與服務(wù)的主流途徑。

HTML5引入了新的語法功能支持多媒體，如視頻、音頻和canvas標(biāo)記。HTML5還引入了可以真正改變用戶與文檔交互方式的新特性，包括增強靈活性的新解析規(guī)則、新屬性以及淘汰過時或冗余屬性。同時，HTML5也優(yōu)化了移動端客戶的體驗感，它融合了視覺、觸覺、聽覺等多維感官，突破了傳統(tǒng)廣告在時間與空間上的限制，增加了用戶與信息的交互性，帶給用戶多方面的新奇體驗。

1 HTML5的廣告設(shè)計應(yīng)用

1.1 廣告概況研究

隨著當(dāng)今互聯(lián)網(wǎng)技術(shù)的發(fā)展以及人類用戶需求的不斷提高，HTML5廣告不僅是以設(shè)計為主導(dǎo)，而且要以技術(shù)為支撐。HTML5廣告在當(dāng)今社會的應(yīng)用越來越廣泛，早在2015年9月1日，Google瀏覽器就不再自動播放Flash動畫廣告。如今使用移動設(shè)備如手機、平板電腦的用戶日益增多，而iOS系統(tǒng)完全不支持Flash動畫的播放。2011年11月，Adobe還宣布計劃停止在Android設(shè)備上支持Flash。因此，F(xiàn)lash將不再支持2011年底發(fā)布超過Android 4.0的設(shè)備，例如Google發(fā)布的Android 4.1 Jelly Bean系統(tǒng)。自8月初以來，98.5% Android用戶仍然屬于這一類，其中60.6%用戶仍然使用Android 2.3。隨著Android設(shè)備的升級和4.1系統(tǒng)的預(yù)安裝，F(xiàn)lash將逐漸從Android系統(tǒng)中消失。由此可見，HTML5廣告會逐步替代Flash廣告，也會成為當(dāng)今主流且新穎的一種線上傳播的廣告形式。而一部優(yōu)質(zhì)的HTML5廣告離不開它對畫面設(shè)計、文案、音效、情感、創(chuàng)意手法等多方面的渲染。

HTML5依托大數(shù)據(jù)可以對用戶的需求、興趣進行分析，從而準(zhǔn)確地給用戶推薦適合于自身的廣告信息。與此同時，用戶也可對廣告信息作出反饋，廣告主接收到反饋后可以立即對信息作出更改并完善。HTML5的技術(shù)可以程度最大化地提高信息的有效性，也可大幅度地增加廣告的利益，HTML5廣告實現(xiàn)了點對點、點對面和面對面的傳播。

1.2 廣告分類研究

（1）以運營活動為目的。以運營活動為目的的HTML5廣告是占比例最多最常見的形式，多運用于電子邀請函、賀卡、小游戲、企業(yè)活動等方面，形式新穎且多樣化，內(nèi)容豐富且圖文并茂。與傳統(tǒng)的平面廣告不同的是，HTML5廣告是多維感官的結(jié)合，具有更強的交互性、趣味性以及視覺效果，這些優(yōu)勢對于廣告信息來說更利于傳播。在進行一項活動策劃時，活動運營需要抓住當(dāng)下熱點、抓住時事，例如把握節(jié)日活動、造節(jié)營銷等。

（2）以宣傳品牌為目的。以宣傳品牌為目的的HTML5廣告頁面相當(dāng)于是一個品牌的微官網(wǎng)，主要是為了打造品牌的良好形象，讓更多用戶熟知并了解到品牌，向用戶傳達品牌文化以及精神態(tài)度。在設(shè)計過程中加入品牌的LOGO、標(biāo)準(zhǔn)字等，運用品牌的標(biāo)準(zhǔn)色可以加深用戶對品牌的印象，從視覺上給用戶直接的沖擊。

（3）以介紹產(chǎn)品功能為目的。以介紹產(chǎn)品功能為目的的HTML5廣告主要是將內(nèi)容集中在介紹產(chǎn)品的功能屬性上，聚焦于產(chǎn)品的賣點以及優(yōu)勢，借助HTML5多維感官的特性將產(chǎn)品的功能最大限度地傳達給用戶，讓用戶熟知產(chǎn)品，引發(fā)用戶的購買欲望從而產(chǎn)生相應(yīng)的購買行為。產(chǎn)品功能型的HTML5廣告是將產(chǎn)品功能、用戶需求以及用戶體驗相結(jié)合，而有趣的交互體驗則更能讓用戶產(chǎn)生深刻印象，可在碎片化的時間里以新穎有趣的形式呈現(xiàn)出來，向用戶傳遞有價值的信息并更深入地了解產(chǎn)品。

（4）以應(yīng)用數(shù)據(jù)為目的。以應(yīng)用數(shù)據(jù)為目的的HTML5廣告是以用戶在發(fā)生使用行為時的數(shù)據(jù)為基礎(chǔ)，貫穿于用戶生活的各個方面，其中最熱門的案例當(dāng)屬支付寶的十年賬單。支付寶利用賬單這個載體將用戶與HTML5數(shù)據(jù)緊密聯(lián)系，這種互動體驗讓用戶參與其中，使原本無趣味性的總結(jié)報告變得生動有趣。而后，各大企業(yè)開始爭相學(xué)習(xí)這種優(yōu)秀的互動方式，年終總結(jié)報告也開始熱衷于使用HTML5技術(shù)來表現(xiàn)。應(yīng)用數(shù)據(jù)型HTML5廣告的優(yōu)勢在于其與用戶息息相關(guān)，在某一方面迎合了用戶的炫耀心理，用戶樂忠于將其分享至朋友圈，從而加大了此類HTML5廣告的傳播力度。

2 HTML5的廣告特征分析

2.1 新媒體廣告與傳統(tǒng)媒體廣告的對比分析

傳統(tǒng)廣告的載體主要包括報紙、雜志、電視、廣播等，而新媒體廣告主要包括移動端廣告、PC端廣告、戶外媒體廣告等。傳統(tǒng)廣告與新媒體廣告并不矛盾，兩者的關(guān)系是相輔相成、互相影響的，新媒體廣告依附傳統(tǒng)媒體強大的信息鏈獲取重要信息，傳統(tǒng)媒體則利用新媒體廣泛的傳播渠道來達到信息擴散的效果，兩者結(jié)合才能使信息傳播效率實現(xiàn)最大化。

傳播速度：新媒體是全球化趨勢的產(chǎn)物，打破了傳統(tǒng)媒體對信息的壟斷。新媒體廣告相比于傳統(tǒng)廣告?zhèn)鞑ニ俣雀欤軌蚶煤笈_的數(shù)據(jù)進行及時準(zhǔn)確地分析，廣告主可獲取更有效的反饋數(shù)據(jù)并對數(shù)據(jù)分析結(jié)果采取進一步地修改，新媒體廣告在網(wǎng)絡(luò)上發(fā)布的信息能實現(xiàn)全球?qū)崟r發(fā)布和接收，不受時間與空間上的限制，控制成本。

傳播方式：傳統(tǒng)廣告?zhèn)鞑サ姆绞绞菃蜗騻鞑?，源于拉斯韋爾的“5W”理論。 這五個W是英文五個疑問代詞的第一個字母，即：Who（誰）、Says What（說了什么）、In Which Channel（通過什么渠道）、To Whom（向誰說）、With What Effect（有什么效果）。5W模型表明溝通過程是一個有目的的行為過程，目的是試圖影響觀眾。因此，他的傳播過程是一個說服過程，其中的五個環(huán)節(jié)是傳播活動的本質(zhì)。在這種模式下，用戶是在被動地接收廣告信息，沒有參與其中的過程。

新媒體廣告的傳播是雙向傳播，源自美國社會學(xué)家M.L德弗勒創(chuàng)建的交互式過程模型，又稱“大眾傳播雙循環(huán)模式”。該模型的主要內(nèi)容是在閉環(huán)傳播系統(tǒng)中，受傳者既是信息的接收器又是信息的傳送器，噪音可以出現(xiàn)在傳播過程的各個方面。該模型明顯補充了反饋的要素、鏈接和渠道，突出了雙向性質(zhì)，使得傳播過程更符合人類交流和互動的特點，因此被認為是描繪大眾傳播過程的相對完整的模型。新媒體的雙向傳播方式使用戶接收信息的方式不再是被動的、強迫性的，雙向溝通還能使廣告主明確用戶的喜好，在廣告的投放上有針對性，傳播效果與價值也會相應(yīng)提升。

交互方式：傳統(tǒng)廣告的感官形式比較單一，用戶在接收信息時是單向的，在技術(shù)上不存在交互性。而新媒體廣告在傳送信息時感官形式多樣化，包含視覺、聽覺、觸覺、嗅覺、味覺等多感官維度，增強用戶與信息、廣告主之間的交互性，同時使廣告信息具有更強的沖擊力，從而加深用戶對其品牌、產(chǎn)品信息的印象。交互方式的多樣化給用戶在瀏覽過程中帶來了更優(yōu)質(zhì)的體驗感，吸引用戶的注意力，使用戶身臨其境。

2.2 移動端互聯(lián)網(wǎng)廣告與PC端互聯(lián)網(wǎng)廣告的對比分析

隨著互聯(lián)網(wǎng)的不斷發(fā)展和變化，根據(jù)媒介的不同將其分為PC端互聯(lián)網(wǎng)和移動端互聯(lián)網(wǎng)。這兩個類別的互聯(lián)網(wǎng)廣告各有優(yōu)勢，PC端互聯(lián)網(wǎng)廣告的優(yōu)點在于屏幕大、形式多樣，而移動端互聯(lián)網(wǎng)廣告的優(yōu)點在于它的便捷性。但是PC端和移動端并不是矛盾的替代關(guān)系，而是互相依存、共同發(fā)展的互補關(guān)系，用戶不是只使用PC端或移動端中的一個類別，而是根據(jù)自身的需求選擇不同的互聯(lián)網(wǎng)媒介。PC端和移動端兩種媒介在發(fā)展的過程中，因其本身的特性而顯現(xiàn)出不同的偏向，比如用戶更樂忠于在PC端互聯(lián)網(wǎng)上瀏覽網(wǎng)頁，在移動端上使用App。因此，廣告主需將大部分用戶的喜好作為一項參考因素來制定科學(xué)的營銷策略從而進行正確的廣告投放，并重視用戶對廣告信息的反饋。

傳播速度：隨著當(dāng)今人們生活節(jié)奏的加快，人們所處的環(huán)境、時間、使用互聯(lián)網(wǎng)的行為均出現(xiàn)碎片化的現(xiàn)象，在這種大背景下廣告主需盡可能地利用用戶碎片化的時間來進行有效的信息傳遞。移動端互聯(lián)網(wǎng)廣告相比PC端互聯(lián)網(wǎng)廣告?zhèn)鞑ニ俣雀?，手機、iPad等移動設(shè)備具備隨時移動的特性，因此移動端廣告的即時性才更能得以體現(xiàn)，它能夠更快、更有效地讓用戶接收信息。

傳播方式：移動端互聯(lián)網(wǎng)廣告與PC端互聯(lián)網(wǎng)廣告相比，前者突破了時間與空間上的限制，移動端的跨時空性讓用戶可以隨時隨地地接收信息，并且對信息產(chǎn)生的問題及時地進行反饋?；ヂ?lián)網(wǎng)的出現(xiàn)與發(fā)展改變了人們以往的生活方式，而移動端的傳播方式也使用戶接收信息的過程更具時效性與便捷性。

3 結(jié)語

隨著HTML5廣告技術(shù)的發(fā)展，各大品牌都樂于使用這種廣告形式，HTML5廣告低成本、跨時空、便捷、即時的特點得到廣告主及用戶的廣泛青睞，根據(jù)移動端硬件的升級，這些特性也得到了進一步地顯現(xiàn)。HTML5吸引用戶的關(guān)鍵點在于：抓眼球、有創(chuàng)意、有情懷、故事化、娛樂化、參與性等，讓用戶沉浸其中，并且樂于主動分享，使用戶既是信息的接收者，同時也是信息的傳播者，廣告主可以把握用戶的心理來有效地實現(xiàn)品牌產(chǎn)品在傳播程度上的價值最大化。HTML5廣告作為新媒體的新興產(chǎn)物，在未來幾年里被使用的頻率會呈現(xiàn)上升趨勢，并且在技術(shù)與形式上還會不斷更新。

注釋：①HTML5：萬維網(wǎng)的核心語言、標(biāo)準(zhǔn)通用標(biāo)記語言下的一個應(yīng)用超文本標(biāo)記語言（HTML）的第五次重大修改。

參考文獻：

[1] 儲節(jié)旺，黃潔欽.HTML5與移動信息服務(wù)[J].情報理論與實踐，2013（7）：24-25.

[2] 覃京燕.大數(shù)據(jù)時代的大交互設(shè)計[J].包裝工程，2015，36（8）：3-4.

[3] 張余.移動互聯(lián)網(wǎng)時代HTML5頁面的設(shè)計與營銷[J].東南傳播，2015（9）.

[4] 李世國.交互設(shè)計[M].中國水利水電出版社，2012.

[5] 徐恒醇.設(shè)計符號學(xué)[M].清華大學(xué)出版社，2008.

[6] 周瑜嫄.移動端HTML5廣告的受眾體驗設(shè)計研究[D].江南大學(xué)，2016.

作者簡介：江楚吟（1996—），女，江蘇鎮(zhèn)江人，蘇州科技大學(xué)藝術(shù)學(xué)院藝術(shù)設(shè)計專業(yè)碩士研究生，研究方向：視覺傳達設(shè)計。