當(dāng)前位置:首頁(yè) >  站長(zhǎng) >  網(wǎng)站運(yùn)營(yíng) >  正文

案例分析:奧巴馬籌款網(wǎng)站的制作過(guò)程

 2012-12-17 14:58  來(lái)源: 阮一峰   我來(lái)投稿 撤稿糾錯(cuò)

  域名預(yù)訂/競(jìng)價(jià),好“米”不錯(cuò)過(guò)

1.

Kyle Rush是一個(gè)網(wǎng)站工程師。

 

2011年6月,他加入BarackObama.com,負(fù)責(zé)設(shè)計(jì)2012美國(guó)大選的奧巴馬官網(wǎng)。

 

(圖為2011年6月的奧巴馬官網(wǎng))

除了宣傳,官網(wǎng)的主要目的就是籌款。

上一次大選,奧巴馬籌到了6.9億美元。這是一個(gè)很大的數(shù)字,但由于過(guò)去4年美國(guó)經(jīng)濟(jì)一直沒(méi)有起色,本次大選勢(shì)必要投入更多的資金,團(tuán)隊(duì)內(nèi)部估計(jì)資金需求將達(dá)到創(chuàng)紀(jì)錄的10億美元。

一個(gè)籌集10億美元的網(wǎng)站,歷史上從來(lái)沒(méi)有過(guò)。Kyle Rush不知道自己能否做到,但是他很清楚,如果籌不到錢(qián),奧巴馬沒(méi)法贏得大選。

 

2.

2012年美國(guó)大選現(xiàn)在已經(jīng)結(jié)束了,奧巴馬有驚無(wú)險(xiǎn)地?fù)魯×肆_姆尼。他最終籌到了11億美元,成為歷史上籌款金額最高(也是花錢(qián)最多)的總統(tǒng)候選人。(排在第二位的就是羅姆尼,他也籌到了10億美元。)

 

這11億美元之中,線下籌集了4.1億,線上籌集了6.9億。單單BarackObama.com一個(gè)網(wǎng)站,就創(chuàng)造了2.5億美元的捐款。

在6個(gè)月的時(shí)間里,BarackObama.com共有

* 17,807,917個(gè)訪問(wèn)者,81,548,259次頁(yè)面訪問(wèn)

* 4,276,463次捐款

* 捐款轉(zhuǎn)化率24%(每四個(gè)訪問(wèn)者,就有一人會(huì)捐款)

這樣輝煌的成績(jī),是如何取得的?

3.

制作一個(gè)超大流量的、體驗(yàn)良好的、能夠說(shuō)服人們捐款、并能安全快速處理這些捐款的網(wǎng)站、絕非易事。

最近,Kyle Rush寫(xiě)了一篇文章,披露了許多內(nèi)幕,從技術(shù)角度總結(jié)了BarackObama.com的制作心得。下面,我們就來(lái)看看奧巴馬的技術(shù)團(tuán)隊(duì)是怎么做到的。

 

(圖為2012年5月的奧巴馬官網(wǎng))

網(wǎng)站的制作班子,從2011年下半開(kāi)始組建,Kyle Rush是第一個(gè)加入的前端工程師,負(fù)責(zé)網(wǎng)頁(yè)的外觀和用戶體驗(yàn)。

一開(kāi)始,網(wǎng)站放在團(tuán)隊(duì)自購(gòu)的服務(wù)器上,運(yùn)行和捐款都還算平穩(wěn)。但是,隨著競(jìng)爭(zhēng)不斷加劇,局勢(shì)變得令人擔(dān)憂了。到了2012年5月,羅姆尼當(dāng)月的籌款金額第一次超過(guò)了奧巴馬。

競(jìng)選總部決定,網(wǎng)站必須改版,盡一切可能爭(zhēng)取捐款。于是,技術(shù)團(tuán)隊(duì)開(kāi)始大規(guī)模的擴(kuò)充,全職的前端工程師從1個(gè)人擴(kuò)充到了14個(gè)人,其中6人專(zhuān)門(mén)負(fù)責(zé)制作籌款頁(yè)面。

4.

技術(shù)團(tuán)隊(duì)做出的第一個(gè)決定是,使用靜態(tài)網(wǎng)站生成器Jekyll,用靜態(tài)網(wǎng)頁(yè)取代動(dòng)態(tài)網(wǎng)頁(yè),加快網(wǎng)頁(yè)打開(kāi)速度。網(wǎng)站的打開(kāi)應(yīng)該越快越好。有研究稱(chēng),打開(kāi)速度每慢100毫秒,Amazon的銷(xiāo)售額就下降1%。

第二個(gè)決定是,將全部網(wǎng)頁(yè)放上CDN,使用的服務(wù)商是Akamai。它是世界最大的CDN供應(yīng)商,共部署了50000多臺(tái)服務(wù)器,美國(guó)各地都能獲得理想的訪問(wèn)速度。奧巴馬芝加哥競(jìng)選總部,可以在20毫秒內(nèi)載入官網(wǎng)的HTML網(wǎng)頁(yè)。

第三個(gè)決定是,將捐款的后臺(tái)做成API調(diào)用。這是因?yàn)橛?3%的訪問(wèn)者使用移動(dòng)設(shè)備,所以必須部署多個(gè)前端(Web端和移動(dòng)端)。使用API,可以讓不同前端以相同方式與后臺(tái)通信,彼此之間用JSON格式傳遞信息。

第四個(gè)決定是,后臺(tái)用PHP語(yǔ)言開(kāi)發(fā),放在Amazon的EC2平臺(tái)上。

第五個(gè)決定是,為了避免宕機(jī),開(kāi)發(fā)兩個(gè)后臺(tái)。一旦一個(gè)系統(tǒng)停止工作,立刻自動(dòng)切換到另一個(gè)。這點(diǎn)很重要,因?yàn)殄礄C(jī)不僅影響士氣,而且經(jīng)濟(jì)損失巨大。因?yàn)榫杩蠲糠昼姸荚谟咳?,最高記錄是一小時(shí)300萬(wàn)美元,你不能讓它停下來(lái)。

5.

新網(wǎng)站初步完成后,使用webpagetest.org進(jìn)行測(cè)試,結(jié)果令人鼓舞。

 

原版頁(yè)面4秒鐘后還沒(méi)載入,新版只用1秒就可以看到。整個(gè)平臺(tái)的訪問(wèn)速度上升了60%,捐款轉(zhuǎn)化率增加了14%。

接下來(lái),就是微調(diào)頁(yè)面的各種細(xì)節(jié),一共進(jìn)行了240次a/b測(cè)試,也就是說(shuō),至少迭代了240個(gè)版本。

調(diào)整后的頁(yè)面,視覺(jué)效果和用戶體驗(yàn)都有了巨大的提升(點(diǎn)擊看大圖),捐款轉(zhuǎn)化率因此又提高了49%。。

 

隨著奧巴馬的當(dāng)選,BarackObama.com共進(jìn)行了1101次前端部署。

6.

事實(shí)證明,整個(gè)開(kāi)發(fā)方案非常成功,順利完成籌款任務(wù),沒(méi)有一分鐘宕機(jī)。

Kyle Rush感到有必要總結(jié),留下記錄。除了上面的開(kāi)發(fā)過(guò)程,他還提到前端團(tuán)隊(duì)使用的工具:版本控制Github ,a/b測(cè)試管理Optimizely,代碼編譯CodeKit。

Kyle Rush最后總結(jié)說(shuō):

“我百分之百肯定,這是我經(jīng)歷過(guò)的最好的開(kāi)發(fā)環(huán)境。我們不斷調(diào)整,捐款轉(zhuǎn)化率的提高令人難以置信。整個(gè)團(tuán)隊(duì)感到無(wú)比滿足。但是,最高興的還是看到,2013年1月21日巴拉克·奧巴馬依然是美國(guó)總統(tǒng)!”

(完)

作者: 阮一峰

申請(qǐng)創(chuàng)業(yè)報(bào)道,分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處,共同探討創(chuàng)業(yè)新機(jī)遇!

相關(guān)文章

  • 點(diǎn)石成金大股東嚴(yán)杰受邀參加奧巴馬演講會(huì)暨第三屆全球中小企峰會(huì)

    (本網(wǎng)訊)11月28日第三屆全球中小企業(yè)峰會(huì)在上海世博中心正式召開(kāi),美國(guó)第44任總統(tǒng)奧巴馬、德國(guó)第10任聯(lián)邦總統(tǒng)武爾夫及多位專(zhuān)家、學(xué)者、企業(yè)家參會(huì),受到了社會(huì)各界的廣泛關(guān)注,本次峰會(huì)被譽(yù)為2017年度“最高企業(yè)峰會(huì)”。阿里巴巴生態(tài)鐵軍代表人物、國(guó)內(nèi)知名高新技術(shù)企業(yè)深圳點(diǎn)石成金科技有限公司大股東嚴(yán)杰,

    標(biāo)簽:
    奧巴馬
    奧巴馬
  • 奧巴馬出席意大利米蘭國(guó)際食品博覽會(huì) 與劍南春深入交流

    5月8日-11日,意大利米蘭國(guó)際食品博覽會(huì)隆重舉行,吸引了來(lái)自全球各地的食品飲料商參展,中國(guó)三大名酒劍南春作為中國(guó)白酒高端品牌代表應(yīng)邀出席了本屆博覽會(huì)。美國(guó)前總統(tǒng)奧巴馬以榮譽(yù)客座嘉賓身份參加了本次博覽會(huì)舉辦的“Seeds&Chips”全球食品創(chuàng)新峰會(huì)并發(fā)表了重要演講,會(huì)后奧巴馬與中國(guó)三大名酒劍南春進(jìn)

    標(biāo)簽:
    奧巴馬
    奧巴馬
  • 斗魚(yú)TV中單Faker直播狂秀 用奧巴馬引發(fā)粉絲驚呼

    原標(biāo)題:斗魚(yú)TV中單Faker直播狂秀用奧巴馬引發(fā)粉絲驚呼斗魚(yú)TV中單Faker直播用奧巴馬在韓服天梯大殺四方。熟悉LCK的粉絲們一定都知道KT戰(zhàn)隊(duì)被玩家們戲稱(chēng)為杰斯隊(duì),原因就是隊(duì)中五個(gè)人除了打野Score都比較“會(huì)玩”杰斯。比較出名的就是Deft的傳送杰斯以及Mata的杰斯輔助了。所以玩家們調(diào)侃打

    標(biāo)簽:
    斗魚(yú)tv
    奧巴馬
    奧巴馬
  • 奧巴馬與默克爾親臨威圖漢諾威展臺(tái)

    4月25日至29日的德國(guó)漢諾威工業(yè)博覽會(huì)今日開(kāi)幕。今年的漢諾威博覽會(huì)是美國(guó)主題年,美國(guó)總統(tǒng)奧巴馬與德國(guó)總理默克爾,在展會(huì)開(kāi)幕之際前來(lái)威圖展臺(tái)參觀。奧巴馬稱(chēng)贊威圖:“Thisisafinecompany(這是一家很好的公司)!”秉承“OurExpertise.YourBenefit(我們的專(zhuān)業(yè)–您的收

    標(biāo)簽:
    奧巴馬
    奧巴馬
  • 向“奧巴馬”學(xué)郵件營(yíng)銷(xiāo)技巧

    又到了四年一屆的美國(guó)總統(tǒng)競(jìng)選時(shí)期,雙方競(jìng)選人都使出了渾身解數(shù),其中一位競(jìng)選人希拉里,相信中國(guó)人并不陌生,她是前總統(tǒng)克林頓的妻子。還有一件趣聞,估計(jì)沒(méi)人能想到,原來(lái)在現(xiàn)任美國(guó)總統(tǒng)奧巴馬的競(jìng)選過(guò)程中,郵件營(yíng)銷(xiāo)居然是重要武器,據(jù)統(tǒng)計(jì),奧巴馬團(tuán)隊(duì)針對(duì)年輕族群,主要使用網(wǎng)絡(luò)營(yíng)銷(xiāo)手段,而郵件營(yíng)銷(xiāo)費(fèi)用占到網(wǎng)絡(luò)營(yíng)銷(xiāo)

熱門(mén)排行

信息推薦