整合營(yíng)銷(xiāo)服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
編為大家收集了11個(gè)web前端開(kāi)發(fā)，大企業(yè)實(shí)戰(zhàn)項(xiàng)目案例+5W行源碼！拿走玩去吧！
獲取途徑：轉(zhuǎn)發(fā)+關(guān)注并私信小編：“前端”全部打包帶走！
下面給大家簡(jiǎn)單介紹幾個(gè)：
小米官網(wǎng)：
項(xiàng)目描述
首先選擇小米官網(wǎng)為第一個(gè)實(shí)戰(zhàn)案例，是因?yàn)閯傞_(kāi)始入門(mén)，有個(gè)參考點(diǎn)，另外站點(diǎn)比較偏向目前的卡片式設(shè)計(jì)，實(shí)現(xiàn)常見(jiàn)效果。目的為學(xué)者練習(xí)編寫(xiě)小米官網(wǎng)，熟悉div+css布局。學(xué)習(xí)資料的話可以加下web前端開(kāi)發(fā)學(xué)習(xí)裙：600加上610再加上151自己去群里下載下。
項(xiàng)目技術(shù)：
HTML+CSS+Div布局
迅雷官網(wǎng)：
項(xiàng)目描述
此站點(diǎn)特效較多，所以通過(guò)練習(xí)編寫(xiě)次站點(diǎn)，學(xué)生可以更多練習(xí)CSS3的新特性過(guò)渡與動(dòng)畫(huà)的實(shí)現(xiàn)，并且可以很好的練習(xí)div+css布局。
項(xiàng)目技術(shù)：
HTML5+CSS3新特性
音樂(lè)播放器：
項(xiàng)目描述
本項(xiàng)目為音樂(lè)類(lèi)項(xiàng)目，主要實(shí)現(xiàn)音樂(lè)首頁(yè)展示，今日推薦類(lèi)別，歌曲列表，歌曲播放及歌手列表和搜索功能。主要練習(xí)Vue的基礎(chǔ)應(yīng)用和組件如何設(shè)計(jì)。項(xiàng)目如何構(gòu)架與測(cè)試。通過(guò)本項(xiàng)目可以讓學(xué)者更快的熟悉Vue框架的使用。并且熟練的構(gòu)建整個(gè)項(xiàng)目需求的架構(gòu)。
項(xiàng)目技術(shù)：
Vue+Flex+Vue-Router+Webpack+ES6
微信小程序：
項(xiàng)目描述
此階段的內(nèi)容為微信小程序開(kāi)發(fā)，本階段并非以基礎(chǔ)知識(shí)點(diǎn)開(kāi)始入手講解，基于學(xué)者經(jīng)歷過(guò)以上的學(xué)習(xí)，在此時(shí)已經(jīng)掌握項(xiàng)目框架，包含常見(jiàn)的一些實(shí)現(xiàn)規(guī)范，所以，這里我們將直接講解項(xiàng)目，根據(jù)項(xiàng)目需求的效果使用微信小程序技術(shù)實(shí)現(xiàn)對(duì)應(yīng)功能。
項(xiàng)目技術(shù)：
微信小程序
Love：
項(xiàng)目描述
這是一款為女性專門(mén)打造的App，推薦更好的產(chǎn)品，產(chǎn)品包含化妝用品，護(hù)理用品，穿戴用品。功能包含瀏覽，推薦，活動(dòng)，購(gòu)物車(chē)與購(gòu)買(mǎi)功能
項(xiàng)目技術(shù)：
HTML+CSS+JavaScript+第三方框架
當(dāng)然還有整套的web前端開(kāi)發(fā)視頻教程哦！
第一階段：
HTML+CSS:
HTML進(jìn)階、CSS進(jìn)階、div+css布局、HTML+css整站開(kāi)發(fā)、
JavaScript基礎(chǔ)：
Js基礎(chǔ)教程、js內(nèi)置對(duì)象常用方法、常見(jiàn)DOM樹(shù)操作大全、ECMAscript、DOM、BOM、定時(shí)器和焦點(diǎn)圖。
JS基本特效：
常見(jiàn)特效、例如：tab、導(dǎo)航、整頁(yè)滾動(dòng)、輪播圖、JS制作幻燈片、彈出層、手風(fēng)琴菜單、瀑布流布局、滾動(dòng)事件、滾差視圖。
JS高級(jí)特征：
正則表達(dá)式、排序算法、遞歸算法、閉包、函數(shù)節(jié)流、作用域鏈、基于距離運(yùn)動(dòng)框架、面向?qū)ο蠡A(chǔ)、
JQuery：基礎(chǔ)使用
懸著器、DOM操作、特效和動(dòng)畫(huà)、方法鏈、拖拽、變形、JQueryUI組件基本使用。
第二階段：HTML5和移動(dòng)Web開(kāi)發(fā)
HTML5：
HTML5新語(yǔ)義標(biāo)簽、HTML5表單、音頻和視頻、離線和本地存儲(chǔ)、SVG、Web Socket、Canvas.
CSS3:
CSS3新選擇器、偽元素、臉色表示法、邊框、陰影、background系列屬性改變、Transition、動(dòng)畫(huà)、景深和深透、3D效果制作、Velocity.js框架、元素進(jìn)場(chǎng)、出場(chǎng)策略、炫酷CSS3網(wǎng)頁(yè)制作。
Bootstrap:
響應(yīng)式概念、媒體查詢、響應(yīng)式網(wǎng)站制作、刪格系統(tǒng)、刪格系統(tǒng)原理、Bootstrap常用模板、LESS和SASS。
移動(dòng)Web開(kāi)發(fā)：
跨終端WEB和主流設(shè)備簡(jiǎn)介、視口、流式布局、彈性盒子、rem、移動(dòng)終端JavaScript事件、手機(jī)中常見(jiàn)JS效果制作、Zepto.js、手機(jī)聚劃算頁(yè)面、手機(jī)滾屏。
第三階段：HTTP服務(wù)和AJAX編程
WEB服務(wù)器基礎(chǔ)：
服務(wù)器基礎(chǔ)知識(shí)、Apache服務(wù)器和其他WEB服務(wù)器介紹、Apache服務(wù)器搭建、HTTP介紹。
PHP基礎(chǔ)：
PHP基礎(chǔ)語(yǔ)法、使用PHP處理簡(jiǎn)單的GET或者POST請(qǐng)求、
AJAX上篇：
Ajax簡(jiǎn)介和異步的概念、Ajax框架的封裝、XMLHttpRequest對(duì)象詳細(xì)介紹方法、兼容性處理方法、Ajax框架的封裝、Ajax中緩存問(wèn)題、XML介紹和使用。
AJAX下篇：
JSON和JSON解析、數(shù)據(jù)綁定和模板技術(shù)、JSONP、跨域技術(shù)、圖片預(yù)讀取和lazy-load技術(shù)、JQuery框架中的AjaxAPI、使用Ajax實(shí)現(xiàn)爆布流案例額。
第四階段：面向?qū)ο筮M(jìn)階
面向?qū)ο蠼K極篇：
從內(nèi)存角度到理解JS面向?qū)ο蟆⒒绢?lèi)型、復(fù)雜類(lèi)型、原型鏈、ES6中的面向?qū)ο蟆傩宰x寫(xiě)權(quán)限、設(shè)置器、訪問(wèn)器。
面向?qū)ο笕筇卣鳎?/p>
繼承性、多態(tài)性、封裝性、接口。
設(shè)計(jì)模式：
面向?qū)ο缶幊趟季S、單例模式、工廠模式、策略模式、觀察者模式、模板方法模式、代理模式、裝飾者模式、適配器模式、面向切面編程。
第五階段：封裝一個(gè)屬于自己的框架
框架封裝基礎(chǔ)：
事件流、冒泡、捕獲、事件對(duì)象、事件框架、選擇框架。
框架封裝中級(jí)：
運(yùn)動(dòng)原理、單物體運(yùn)動(dòng)框架、多物體運(yùn)動(dòng)框架、運(yùn)動(dòng)框架面向?qū)ο蠓庋b。
框架封裝高級(jí)和補(bǔ)充：
JQuery框架雛形、可擴(kuò)展性、模塊化、封裝屬于傳智自己的框架。
第六階段：模塊化組件開(kāi)發(fā)
面向組件編程：
面向組件編程的方式、面向組件編程的實(shí)現(xiàn)原理、面向組件編程實(shí)戰(zhàn)、基于組件化思想開(kāi)發(fā)網(wǎng)站應(yīng)用程序。
面向模塊編程：
AMD設(shè)計(jì)規(guī)范、CMD設(shè)計(jì)規(guī)范、RequireJS，LoadJS、淘寶的SeaJS。
第七階段：主流的流行框架
Web開(kāi)發(fā)工作流：
GIT/SVN、Yeoman腳手架、NPM/Bower依賴管理工具、Grunt/Gulp/Webpack。
MVC/MVVM/MVW框架：
Angular.js、Backbone.js、Knockout/Ember。
常用庫(kù)：
React.js、Vue.js、Zepto.js。
第八階段：HTML5原生移動(dòng)應(yīng)用開(kāi)發(fā)
Cordova：
WebApp/NativeApp/HybirdApp簡(jiǎn)介、Cordova簡(jiǎn)介、與PhoneGap之間的關(guān)系、開(kāi)發(fā)環(huán)境搭建、Cordova實(shí)戰(zhàn)（創(chuàng)建項(xiàng)目，配置，編譯，調(diào)試，部署發(fā)布）。
Ionic：
Ionic簡(jiǎn)介和同類(lèi)對(duì)比、模板項(xiàng)目解析、常見(jiàn)組件及使用、結(jié)合Angular構(gòu)建APP、常見(jiàn)效果（下拉刷新，上拉加載，側(cè)滑導(dǎo)航，選項(xiàng)卡）。
React Native：
React Native簡(jiǎn)介、React Native環(huán)境配置、創(chuàng)建項(xiàng)目，配置，編譯，調(diào)試，部署發(fā)布、原生模塊和UI組件、原生常用API。
HTML5+：
HTML5+中國(guó)產(chǎn)業(yè)聯(lián)盟、HTML5 Plus Runtime環(huán)境、HBuilder開(kāi)發(fā)工具、MUI框架、H5+開(kāi)發(fā)和部署。
第九階段： Node.js全棧開(kāi)發(fā)：
快速入門(mén)：
Node.js發(fā)展、生態(tài)圈、Io.js、Linux/Windows/OS X環(huán)境配置、REPL環(huán)境和控制臺(tái)程序、異步編程，非阻塞I/O、模塊概念，模塊管理工具、開(kāi)發(fā)流程，調(diào)試，測(cè)試。
核心模塊和對(duì)象：
全局對(duì)象global，process，console，util、事件驅(qū)動(dòng)，事件發(fā)射器、加密解密，路徑操作，序列化和反序列化、文件流操作、HTTP服務(wù)端與客戶端、Socket.IO。
Web開(kāi)發(fā)基礎(chǔ)：
HTTP協(xié)議，請(qǐng)求響應(yīng)處理過(guò)程、關(guān)系型數(shù)據(jù)庫(kù)操作和數(shù)據(jù)訪問(wèn)、非關(guān)系型數(shù)據(jù)庫(kù)操作和數(shù)據(jù)訪問(wèn)、原生的Node.js開(kāi)發(fā)Web應(yīng)用程序、Web開(kāi)發(fā)工作流、Node.js開(kāi)發(fā)Blog案例。
快速開(kāi)發(fā)框架：
Express簡(jiǎn)介+MVC簡(jiǎn)介、Express常用API、Express路由模塊、Jade/Ejs模板引擎、使用Express重構(gòu)Blog案例、Koa等其他常見(jiàn)MVC框架。
Node.js開(kāi)發(fā)電子商務(wù)實(shí)戰(zhàn)：
需求與設(shè)計(jì)、賬戶模塊注冊(cè)登錄、會(huì)員中心模塊、前臺(tái)展示模塊、購(gòu)物車(chē)，訂單結(jié)算、在線客服即時(shí)通訊模塊。
關(guān)注我的頭條號(hào)，分享更多的技術(shù)學(xué)習(xí)文章，我自己是一名從事了多年開(kāi)發(fā)的web前端老程序員，目前辭職在做自己的web前端私人定制課程，今年年初我花了一個(gè)月整理了一份最適合2019年學(xué)習(xí)的web前端學(xué)習(xí)干貨，各種框架都有整理，送給每一位前端小伙伴，想要獲取的可以關(guān)注我的頭條號(hào)并在后臺(tái)私信我：前端，即可免費(fèi)獲取。
#34;夏哉ke"：quangneng.com/5065/
前端必學(xué) 40個(gè)精選案例實(shí)戰(zhàn)：一課吃透HTML5+CSS3+JS
隨著互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展，前端開(kāi)發(fā)已成為現(xiàn)代Web應(yīng)用開(kāi)發(fā)的核心。本文將介紹40個(gè)精選的前端案例實(shí)戰(zhàn)，涵蓋HTML5、CSS3和JavaScript（JS）的基礎(chǔ)知識(shí)和高級(jí)技巧，幫助讀者全面掌握前端開(kāi)發(fā)技能。
一、HTML5必學(xué)案例
二、CSS3必學(xué)案例
三、JavaScript必學(xué)案例
四、綜合實(shí)戰(zhàn)案例
五、前端必學(xué)案例實(shí)戰(zhàn)進(jìn)階
六、前端性能優(yōu)化
七、前端安全與最佳實(shí)踐
八、總結(jié)
通過(guò)學(xué)習(xí)本文介紹的前端必學(xué)案例實(shí)戰(zhàn)，讀者可以全面掌握HTML5、CSS3和JavaScript的基礎(chǔ)知識(shí)和高級(jí)技巧，為前端開(kāi)發(fā)打下堅(jiān)實(shí)的基礎(chǔ)。隨著技術(shù)的不斷進(jìn)步，前端開(kāi)發(fā)將繼續(xù)擴(kuò)展其邊界，為開(kāi)發(fā)者提供更多的創(chuàng)新機(jī)會(huì)。希望本文能幫助讀者在前端開(kāi)發(fā)的道路上越走越遠(yuǎn)，不斷提升自己的技能水平。
銷(xiāo)代有手段出，各領(lǐng)風(fēng)騷數(shù)百天。要論2014年的傳播業(yè)哪些方式最“風(fēng)騷”，屢屢刷爆朋友圈的HTML 5（簡(jiǎn)稱H5）炫酷頁(yè)面絕對(duì)獨(dú)占鰲頭，今天@TopMarketing的同學(xué)挑出了10個(gè)最經(jīng)典的案例，來(lái)看你玩過(guò)哪些？
先來(lái)一段背景介紹：正像大家知道的那樣，移動(dòng)互聯(lián)網(wǎng)的江湖上，APP派和Web派爭(zhēng)斗已久。起初是App以良好的用戶體驗(yàn)迅速俘獲用戶芳心，沐浴無(wú)盡恩寵。不甘失落的Web派逐漸放棄了傳統(tǒng)Wap，推出了更加方面快捷的H5技術(shù)，但在強(qiáng)大的App面前曾長(zhǎng)期不溫不火。直到后來(lái)微信和朋友圈的快速發(fā)展，H5靠著無(wú)需下載、即點(diǎn)即用的屬性迅速上位，一躍變成當(dāng)紅炸子雞，Web終于成功逆襲。
話說(shuō)H5滿天飛，質(zhì)量也是參差不齊，虧得Top 君有火（ao）眼（ye）金（jia）睛（ban），才在沙子堆里翻揀出10塊金子，集成此篇泣血之作，以饗粉絲。
1、圍住神經(jīng)貓
入選理由：堪稱一代流行小游戲之標(biāo)本。
其實(shí)HTML5技術(shù)在幾年前就基本成熟，但一直不溫不火，今年能從“二三線小明星”搖身一變成“移動(dòng)營(yíng)銷(xiāo)一姐”，它必需感謝一只欠抽的神經(jīng)貓——它體態(tài)妖嬈，表情風(fēng)騷，不斷在屏幕中扭來(lái)扭去，勾引玩家發(fā)起毫不留情地圍剿。
這只貓完美得能做微信流行小游戲的標(biāo)本：形象賤萌，讓人忍俊不禁；上手簡(jiǎn)單，又有一定的數(shù)學(xué)挑戰(zhàn)性；在醒目位置添加網(wǎng)絡(luò)流行俗語(yǔ)；引入競(jìng)爭(zhēng)機(jī)制，撩撥玩家的攀比心態(tài)。
但因?yàn)槭恰盁o(wú)心插柳”，《圍住神經(jīng)貓》的營(yíng)銷(xiāo)指數(shù)相對(duì)較弱，在它短短幾天的生命里，只在火起來(lái)之后接入了廣告文字鏈，也很快就銷(xiāo)聲匿跡了。
2、全民找祖名
入選理由：熱點(diǎn)新聞催生出的單細(xì)胞生物。
除了神經(jīng)貓這類(lèi)“平地起風(fēng)波”的，更多的微信小游戲借熱點(diǎn)而生。
比如8月份，柯震東、房祖名相繼跳入毒坑，在網(wǎng)友們“絕不放過(guò)任何角度”的調(diào)侃大潮中，HTML5的技術(shù)男們也不甘落后，推出了《全民尋找房祖名》：“雖然柯少向龍叔保證不會(huì)帶壞房祖名，但龍叔實(shí)在不放心，現(xiàn)在請(qǐng)求你幫忙在一群柯震東的頭像里撈出唯一一個(gè)房祖名”。
還好不是從一堆張默里找出一個(gè)房祖名。。。。
如果說(shuō)類(lèi)似五子棋的神經(jīng)貓還需考校智商的話，那么和“看你有多色”玩法相同的“找祖名”則更傾向于眼力的比拼——也就是說(shuō)，更弱智（#咳咳，此處并無(wú)歧視之意#）。然而越傻瓜，就越流行，在它身后涌現(xiàn)出了一大批的追隨者，例如前些天的“在霧霾里找北京”。
盈利問(wèn)題當(dāng)然也是這類(lèi)H5心中的痛，但好在至少可以讓它的開(kāi)發(fā)者暫時(shí)脫穎而出。
3、杜蕾斯 一夜N次郎
入選理由：小杜杜就是個(gè)品牌游戲定制狂。
既然神經(jīng)貓和找祖名們都這么火了，品牌們又怎么會(huì)想不到開(kāi)發(fā)專屬的小游戲呢？自己動(dòng)手得來(lái)的高級(jí)定制，首先肯定合身，然后款式也多選——既可以根據(jù)品牌特性開(kāi)發(fā)原創(chuàng)游戲，也可以選擇在經(jīng)典游戲中融入品牌元素。
在微博上大名鼎鼎的“小杜杜”就是游戲“高定”的瘋狂愛(ài)好者，推出過(guò)《我要持久》、《杜杜line一發(fā)》《一夜N次郎》等多款作品。（#瞅瞅這些香艷的名字#）以“N次郎”為例，其實(shí)是經(jīng)典游戲“別踩白塊兒”的山寨版，然后把黑白塊替換為五顏六色的杜蕾斯套套，玩家只要努力踩TT就夠了，別的什么禁區(qū)都沒(méi)有。
照這個(gè)拆套套的速度，一夜包你-嗶-盡人亡。
4、維多利亞的秘密
入選理由：“摩擦摩擦”技能首創(chuàng)者。
以上羅列的是H5國(guó)度中的“游戲派”，利用“曬成績(jī)”心理誘惑用戶上癮并分享是它們的立身之本。而接下來(lái)將為大家介紹劃江而治的另一大門(mén)派——“互動(dòng)體驗(yàn)派”，它們是一群標(biāo)準(zhǔn)的技術(shù)宅，篤信“科技改變營(yíng)銷(xiāo)”。
“互動(dòng)體驗(yàn)派”的大師姐是內(nèi)衣品牌維多利亞的秘密，她出師早，名聲也響，成名技為“摩擦有驚喜”。7月初為預(yù)熱七夕，維秘上線了一款形式炫酷的輕應(yīng)用：首頁(yè)是一幅經(jīng)過(guò)霧化處理的照片，用戶只需用手指摩擦屏幕，就會(huì)有一位性感女郎浮出水面，繼續(xù)瀏覽下去則是品牌介紹，最后到達(dá)內(nèi)衣?lián)屬?gòu)頁(yè)面。
這項(xiàng)技能后來(lái)被多個(gè)品牌效法，現(xiàn)已發(fā)揚(yáng)光大。縱然是神通廣大的小編，也沒(méi)能找到原版鏈接，╮(╯▽╰)╭。這里有一個(gè)都市麗人的模仿版，小伙伴們湊合湊合吧。
5、百度智呼吸，吹一口神仙氣
入選理由：非一般的重力感應(yīng)。
重力感應(yīng)則是繼“觸屏指”之后的另一套神功，這里小編選擇了“技術(shù)大拿”百度的“智呼吸”應(yīng)用作為正面教材進(jìn)行展示。
這是一款神奇的輕應(yīng)用——你只要對(duì)著手機(jī)吹口氣，就能知道自己的健康值（比孫悟空還厲害呢？）：第一步，把手機(jī)水平放好（實(shí)際上是利用重力感應(yīng)糾正手機(jī)平衡）；第二步，深呼吸（#閉上你的眼睛，全世界有最清新洋氣#）；第三步，對(duì)著手機(jī)下方吹一口氣。幾秒鐘后，你的健康值就出來(lái)了，同時(shí)附有這口氣各種成分的數(shù)值，非常全面。
估計(jì)吃頭大蒜，顯示的就是被全國(guó)67.6%的人打敗了。
6、可口可樂(lè) 我們?cè)诤?/strong>
入選理由：這是一份“會(huì)動(dòng)”的CRS報(bào)告。
雜糅圖片、文字和視音頻等多媒體是H5的又一大優(yōu)勢(shì)。而當(dāng)這種生動(dòng)的形式與一些嚴(yán)肅的內(nèi)容相遇，往往發(fā)生出人意料的化學(xué)反應(yīng)。
以前段時(shí)間席卷朋友圈的可口可樂(lè)“我們?cè)诤酢睘槔恼嫔肀臼且环菁缲?fù)企業(yè)CSR重任的“可持續(xù)發(fā)展報(bào)告”，內(nèi)容雖力求形象但扔難掩厚重。為了在社交時(shí)代更接地氣，可口可樂(lè)嘗試用H5為報(bào)告“瘦身美容”：選取報(bào)告中的部分核心數(shù)據(jù)，共十五頁(yè)畫(huà)面，直觀展現(xiàn)可口可樂(lè)的努力，變成適應(yīng)網(wǎng)絡(luò)傳播特點(diǎn)、特別是移動(dòng)端觀看及分享需求的形式。
7、2014百度世界
入選理由：美輪美奐的邀請(qǐng)函。
集視聽(tīng)多重感官于一體的H5還改造了千人一面的邀請(qǐng)函。
標(biāo)桿案例如今年的百度世界大會(huì)，將會(huì)議邀請(qǐng)和星空元素緊密結(jié)合：在一片唯美的星空背景之上，每劃過(guò)一道流星，就浮現(xiàn)出一位意見(jiàn)領(lǐng)袖對(duì)移動(dòng)互聯(lián)網(wǎng)的看法和愿景，最后是會(huì)議的時(shí)間地點(diǎn)，并可進(jìn)行在線搶票。（#納尼，又是百度的？！小編就不展開(kāi)說(shuō)了，夸那么多一分錢(qián)沒(méi)收到何必呢？#）
8、巴寶莉 從倫敦到上海的旅程
入選理由：堪稱互動(dòng)體驗(yàn)派的集大成者。
前面幾個(gè)例子都是“專業(yè)人才”，在技術(shù)的運(yùn)用上各精一道，或是觸屏，或是多媒體，或是重力感應(yīng)。當(dāng)然還有集各項(xiàng)技術(shù)于一身的“全才”，這里最有名的要數(shù)巴寶莉“從倫敦到上海”的旅程。
要進(jìn)入這個(gè)渾身上下散發(fā)著濃濃文藝氣息的H5，第一步，得先“搖一搖”；第二步，點(diǎn)擊屏幕進(jìn)入油畫(huà)般的倫敦清晨；第三步，摩擦屏幕使晨霧散去；第四步，點(diǎn)擊“河面”，河水泛起漣漪；最后點(diǎn)擊屏幕上的白點(diǎn)，達(dá)到終點(diǎn)站上海。
總而言之，你能想到的互動(dòng)方式，burberry都用在里面了。
9、網(wǎng)易 習(xí)近平和奧巴馬是這樣夜游中南海的
入選理由：為可視化軟文提供參考。
盤(pán)點(diǎn)進(jìn)行到這兒，“十佳”里就剩下兩席了，小編要把這2個(gè)珍貴的位置留給兩家媒體同仁。
首先獲此殊榮的是網(wǎng)易新聞中心的《習(xí)近平和奧巴馬是這樣夜游中南海的》。它是一篇“可視化”新聞，除了生動(dòng)的圖片，更多信息通過(guò)動(dòng)畫(huà)效果呈現(xiàn)出層次感和互動(dòng)感，就像一個(gè)flash動(dòng)畫(huà)一樣，把中美兩位政治大佬的夜游中南海的信息傳播得通通透透，各種場(chǎng)景切換，使讀者如臨其境、如見(jiàn)其人、如聞其聲。
這給品牌活動(dòng)帶來(lái)很大啟示——想要告別過(guò)去干燥無(wú)味的新聞稿嗎？可視化新聞為你提供了一種給力的選擇，尤其是現(xiàn)場(chǎng)活動(dòng)的呈現(xiàn)，多媒體形式更具傳播性。
10、央視春晚 家和萬(wàn)事興
入選理由：內(nèi)容的共鳴才是王道。
當(dāng)然，不管形式如何花樣百出，最終還得仰仗過(guò)硬的內(nèi)容才能成大氣候。
典型例證就是央視春晚的“家和萬(wàn)事興”：“我們對(duì)世界微笑，彬彬有禮，卻帶著一身疲憊和抱怨回到家里；我們?cè)谕馄疵圪u(mài)自己的觀點(diǎn)，卻懶得和父母解釋我在忙什么（#講真，內(nèi)斂含蓄的小編聽(tīng)這臺(tái)詞肉麻兮兮的#）……”H5從一個(gè)與父母聚少離多的小故事講起，通過(guò)催人淚下的文案和煽動(dòng)人心的音樂(lè)引發(fā)共鳴，然后與“家和萬(wàn)事興”的主題緊密貼合，最終號(hào)召網(wǎng)友“按手印”表達(dá)支持。
呃，按手印的時(shí)候有木有一種簽字畫(huà)押的趕腳？
總結(jié)完畢，來(lái)關(guān)注Top 君的微信號(hào)：TMarketeting
*請(qǐng)認(rèn)真填寫(xiě)需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
