推薦：網(wǎng)站運(yùn)營(yíng)：蘑菇街網(wǎng)站高轉(zhuǎn)化率之運(yùn)營(yíng)策略
提到國(guó)內(nèi)女性購(gòu)物社區(qū)，人們很容易想到蘑菇街和美麗說(shuō)的火爆。有人說(shuō)是微博成就了這兩家網(wǎng)站，也有人說(shuō)是創(chuàng)新的營(yíng)銷模式打開(kāi)了市場(chǎng)，尤其是美麗說(shuō)和蘑菇街的微博營(yíng)銷，被很

來(lái)源：GBin1.com

編者的話：這是Mobify的CEO，Igor Faletski發(fā)表的一篇博文，Mobify，電子商務(wù)優(yōu)化平臺(tái)，為智能手機(jī)和平板電腦提供了適應(yīng)網(wǎng)站的工具。

你可能聽(tīng)人說(shuō)過(guò)，“我們生活在后電腦時(shí)代”。這對(duì)網(wǎng)絡(luò)開(kāi)發(fā)者而言意味什么？它意味著你的網(wǎng)站，有30%到50%的流量來(lái)自于移動(dòng)電子設(shè)備。它同時(shí)意味著，不久之后，桌面用戶或者筆記本電腦用戶將會(huì)成為網(wǎng)絡(luò)的少數(shù)派。 

面對(duì)這樣用戶模式構(gòu)建的轉(zhuǎn)變，我們又要如何應(yīng)對(duì)呢？我們已經(jīng)跨越了m-dot或是t-dot時(shí)代，步入了一個(gè)由響應(yīng)和自適應(yīng)設(shè)計(jì)技術(shù)統(tǒng)治的時(shí)期 - W3C將它稱為“一個(gè)網(wǎng)絡(luò)途徑”。W3C最主要的建議是：“所謂的‘一個(gè)網(wǎng)絡(luò)’是指，就合理性而言，網(wǎng)絡(luò)應(yīng)該為用戶提供同樣的信息以及服務(wù)，無(wú)論這個(gè)用戶使用的是什么終端設(shè)備。”

對(duì)于開(kāi)發(fā)者而言，使用“一個(gè)網(wǎng)絡(luò)”不僅是讓網(wǎng)站今時(shí)今日在智能手機(jī)或者平板電腦上暢行工作，更可以在今時(shí)今日，我們不能想象的，面向未來(lái)的終端上工作無(wú)誤。

當(dāng)前我們有三種最為普遍的，開(kāi)發(fā)“一個(gè)網(wǎng)絡(luò)”網(wǎng)站的方式：使用響應(yīng)式設(shè)計(jì)；客戶端適應(yīng)性設(shè)計(jì)和服務(wù)器端適應(yīng)性設(shè)計(jì)。

這三種開(kāi)發(fā)設(shè)計(jì)模式，并沒(méi)有誰(shuí)最好或者誰(shuí)最差之分，每一個(gè)都各有千秋，有優(yōu)點(diǎn)，也有缺點(diǎn)，而聰明的開(kāi)發(fā)者會(huì)在開(kāi)發(fā)前，考慮到這三種方法的優(yōu)缺點(diǎn)，從而選擇一個(gè)最為合適的途徑。

響應(yīng)式設(shè)計(jì)

響應(yīng)式網(wǎng)絡(luò)設(shè)計(jì)是最為大眾的“一個(gè)網(wǎng)絡(luò)”的設(shè)計(jì)方式。這種方式使用了CSS媒體查詢，用于根據(jù)不同終端顯示器的大小而改變網(wǎng)站的顯示。從波士頓環(huán)球報(bào)，到迪斯尼，再到Indochino，響應(yīng)式網(wǎng)站的數(shù)量正在迅速增加。

這種方式一個(gè)最為主要的優(yōu)點(diǎn)是，對(duì)于所有的終端設(shè)備，設(shè)計(jì)者只需要使用一個(gè)模板，在CSS中定義不同屏幕大小如何顯示內(nèi)容就可以了。而且，這些設(shè)計(jì)者可以繼續(xù)使用他們所熟悉的技術(shù)，例如CSS，HTML。另外，現(xiàn)在有更多的，友好響應(yīng)的開(kāi)源工具，例如Bootstrap或是Foundation，這些開(kāi)源工具簡(jiǎn)化了搭建響應(yīng)網(wǎng)站的過(guò)程。

另一方面，完整的響應(yīng)式設(shè)計(jì)很少有快捷便利的方式。要做到響應(yīng)，組織者往往需要承擔(dān)一個(gè)完整的網(wǎng)站重建。

設(shè) 計(jì)和測(cè)試會(huì)非常的繁瑣，因?yàn)橐�針�?duì)每一種可能設(shè)備的用戶體驗(yàn)做出設(shè)計(jì)是非常困難的。我們看到響應(yīng)式網(wǎng)站的布局看起來(lái)像是一塊塊拼圖，并不是契合的一體。響 應(yīng)式網(wǎng)站設(shè)計(jì)最好是應(yīng)用在移動(dòng)設(shè)備優(yōu)先的開(kāi)發(fā)上，即移動(dòng)設(shè)備用例在開(kāi)發(fā)中作為最優(yōu)先考慮。漸進(jìn)增強(qiáng)處理，在將設(shè)計(jì)延伸至平板電腦和桌面用例上。

性能也是響應(yīng)式網(wǎng)站的一大棘手難題。在Mobify，我們最近完成的對(duì)于15個(gè)流行的電子商務(wù)網(wǎng)站的分析指出，在這些網(wǎng)站中，主頁(yè)加載平均是87個(gè)資源和1.9MB的數(shù)據(jù)，一些響應(yīng)網(wǎng)頁(yè)竟然有15MB大小。

加 載的數(shù)據(jù)之所以這么大，是因?yàn)轫憫?yīng)式網(wǎng)站需要覆蓋所有的設(shè)備。你的用戶只用一種設(shè)備，他卻需要等待所有的界面元素和資源全部加載完全，才可以瀏覽使用。簡(jiǎn) 單地說(shuō)，性能問(wèn)題已經(jīng)觸及了你的底線。在智能手機(jī)上，用戶等待一秒鐘的時(shí)間，轉(zhuǎn)換率會(huì)下降3.5%。只需要3秒，用戶就會(huì)選擇完全離開(kāi)你的頁(yè)面了。

當(dāng)響應(yīng)網(wǎng)站很快的成為約定俗成的標(biāo)準(zhǔn)，它同時(shí)為在線商務(wù)帶來(lái)了新的挑戰(zhàn)，其中包括如何處理圖片，如何優(yōu)化移動(dòng)設(shè)備的性能，以及當(dāng)網(wǎng)站轉(zhuǎn)變?yōu)橐苿?dòng)設(shè)備優(yōu)先時(shí)，不得不面臨著重頭構(gòu)建的問(wèn)題。

客戶端適應(yīng)網(wǎng)站

適應(yīng)性設(shè)計(jì)是在特定的設(shè)備和環(huán)境的基礎(chǔ)上，依據(jù)響應(yīng)式設(shè)計(jì)的本質(zhì)，提供具有針對(duì)性的用戶體驗(yàn)。它使用JavaScript提供的先進(jìn)功能和強(qiáng)大的可定制性來(lái) 豐富網(wǎng)站。例如，自適應(yīng)網(wǎng)站可以只對(duì)Retina顯示屏（如新iPad，iPad mini）提供Retina素質(zhì)的圖片，而標(biāo)準(zhǔn)的顯示器只能接收低像素的圖片。

適應(yīng)性設(shè)計(jì)有兩種，一種是在客戶端的，即在用戶的瀏覽器上應(yīng) 用適應(yīng)性，另一種是服務(wù)器端的，需要繁重的檢測(cè)大量的設(shè)備然后加載適當(dāng)?shù)哪０濉？蛻舳诉m應(yīng)性網(wǎng)站的用例如Threadless和ideeli。適應(yīng)模板方 式最給力的一點(diǎn)是，在不同的設(shè)備之間，重復(fù)使用一套HTML和JavaScript，如此大大簡(jiǎn)化了管理和測(cè)試的工作。

客 戶端適應(yīng)網(wǎng)站意味 著你不需要重新構(gòu)建你的網(wǎng)站。取而代之的是，你可以在傳輸移動(dòng)響應(yīng)布局的同時(shí)，構(gòu)建現(xiàn)有的內(nèi)容。對(duì)于一個(gè)專家級(jí)的開(kāi)發(fā)者而言，這個(gè)方法還可以專門針對(duì)特定 的設(shè)備或屏幕分辨率。例如，對(duì)許多Mobify的在線時(shí)裝零售客戶，他們的移動(dòng)流量95%來(lái)自于iPhones。客戶端適應(yīng)意味著他們可以專門對(duì) Apple智能手機(jī)進(jìn)行優(yōu)化。

不同于相應(yīng)設(shè)計(jì)，適應(yīng)模板確保了在用戶的終端上，只有必須的資源被加載。因?yàn)樵O(shè)備檢測(cè)被移到了移動(dòng)終端自行檢測(cè)，CDN網(wǎng)絡(luò)，例如Akamai和Edgecast，就可以使用大部分的緩存功能而不破壞用戶體驗(yàn)。

客戶端適應(yīng)方法比起響應(yīng)設(shè)計(jì)，在使用上有著更高的門檻。開(kāi)發(fā)人員需要扎實(shí)的JavaScript基礎(chǔ)才能使用這項(xiàng)技術(shù)。同時(shí)它還需要依靠網(wǎng)站已存在的模板作為基礎(chǔ)。最后，因?yàn)榭蛻舳诉m應(yīng)性是在你已有的底層代碼上添加一層代碼，你必須保持你的網(wǎng)站作為一個(gè)整體而發(fā)展。

服務(wù)器適應(yīng)網(wǎng)站

我們可以用多種方法，通過(guò)服務(wù)器端插件和用戶代理檢測(cè)來(lái)完成服務(wù)器端適應(yīng)性網(wǎng)站的開(kāi)發(fā)。用服務(wù)器端適應(yīng)性開(kāi)發(fā)的網(wǎng)站包括Etsy，One Lings Lane和OnlineShoes.com。

我們?yōu)槭裁匆�選擇服務(wù)器端適應(yīng)來(lái)開(kāi)發(fā)網(wǎng)站呢？通常它為每一個(gè)設(shè)備提供一個(gè)獨(dú)有的模板，使得網(wǎng)站具有更強(qiáng)的定制性，并且它在服務(wù)器端保留著設(shè)備檢測(cè)邏輯，使較小的移動(dòng)頁(yè)面加載的更快。另外，現(xiàn)在還有許多服務(wù)器端插件提供給大部分CMS系統(tǒng)和電子商務(wù)系統(tǒng)。

這 種方式并不適合膽小者 - 它通常要求你的后臺(tái)系統(tǒng)做出重大變化，這可能會(huì)需要一個(gè)漫長(zhǎng)的（以及昂貴的）實(shí)現(xiàn)過(guò)程。管理多個(gè)模板的要求增加了日常維護(hù)的成本。最終，這種方式還會(huì)在服 務(wù)器重負(fù)載的情況下，遇到性能問(wèn)題。當(dāng)移動(dòng)用戶代理檢測(cè)工作在服務(wù)器端，像Akamai這樣的CDN部署的共用緩存機(jī)制則需要關(guān)閉。否則它將導(dǎo)致桌面用戶 和移動(dòng)用戶的體驗(yàn)變慢。

當(dāng)然，多數(shù)公司仍舊在與響應(yīng)方式做搏斗，他們還沒(méi)有準(zhǔn)備好面對(duì)更復(fù)雜的口味-適應(yīng)性。然而，越來(lái)越多的競(jìng)爭(zhēng)和移動(dòng)通信，將會(huì)推動(dòng)越來(lái)越多的組織在三種方式中不斷試驗(yàn)，最終找到一個(gè)最為適合他們用戶的方法。

文章來(lái)源：http://www.gbin1.com/tools/design/20130516-responsive-vs-adaptive/

分享：從一場(chǎng)大雨淺談如何進(jìn)行微博O2O營(yíng)銷
微博是把眾多 自媒體聚合在一起的平臺(tái)，當(dāng)我們通過(guò)微博平臺(tái)獲得自媒體人第一時(shí)間發(fā)布的本地相關(guān)信息時(shí)，應(yīng)該思考，如何把這種最接地氣的本地信息變成本地用戶所在乎的熱 點(diǎn)