網(wǎng)路冷眼@BlogJava

今天看到Cat in dotNET 的一篇好文章，不敢獨(dú)享，現(xiàn)轉(zhuǎn)載到這里。望對(duì)大家有所幫助。

原文地址：http://www.cnblogs.com/cathsfz/archive/2006/12/16/594463.html

是否非常羨慕別人的文章有機(jī)會(huì)沖上Digg頭版，接著帶來(lái)大量的訪(fǎng)客呢？是否也希望自己的文章也能受到鏈接的寵愛(ài)，從而獲得更高的PageRank呢？好，跟我來(lái)，讓我?guī)湍惆盐恼陆尤氲?a target="_blank">Social Software中。

首先，你知道Social Software是什么嗎？從廣義上來(lái)說(shuō)，就是能夠讓人們聯(lián)系或聚集到一起的軟件，老式的郵件列表或者新聞組也算是，然而通常我們用它指現(xiàn)代的blog和 wiki平臺(tái)。我們正在寫(xiě)的博客也算是Social Software，然而它還不夠sociable，例如我們?cè)?a target="_blank">博客園最多也就能把文章發(fā)布到首頁(yè)，所以我們需要一個(gè)更加大范圍的平臺(tái)，例如Digg，而把你的網(wǎng)站接入到Digg僅需一個(gè)按鈕--"Digg This!"按鈕。

Digg This?

想象一下，你的訪(fǎng)客來(lái)了，他覺(jué)得你這篇文章真是非常有價(jià)值，希望分享給其他人看，然后他就想點(diǎn)下那個(gè)寫(xiě)著"Digg This!"的按鈕。慢著，按鈕在哪？這位訪(fǎng)客發(fā)現(xiàn)他當(dāng)前用的這個(gè)瀏覽器沒(méi)有這個(gè)按鈕，你的文章頁(yè)面上也沒(méi)有這個(gè)按鈕。要自己跑去Digg點(diǎn)擊提交文章，然后把地址和標(biāo)題復(fù)制粘貼過(guò)去，這多麻煩啊，所以他直接放棄了這個(gè)想法然后關(guān)掉了當(dāng)前頁(yè)。找不到"Digg This!"按鈕的事情讓訪(fǎng)客感到沮喪(frustrated)，他也就沒(méi)心情看下去了，這樣就跑掉了一個(gè)訪(fǎng)客，多可惜啊。

網(wǎng)站上的文章可以不好，但網(wǎng)站導(dǎo)航不能不好，讓訪(fǎng)客感到沮喪可是一大忌。什么是沮喪？我們來(lái)查一下frustrated，其意思就是你很想做一件事情然而總是有些障礙讓你無(wú)法繞過(guò)去也無(wú)法達(dá)成目標(biāo)。對(duì)于網(wǎng)站導(dǎo)航來(lái)說(shuō)，讓訪(fǎng)客沮喪的情況通常發(fā)生在訪(fǎng)客認(rèn)定他要的信息或者功能就在你的網(wǎng)站上，然而通過(guò)鏈接導(dǎo)航或者搜索導(dǎo)航都無(wú)法到達(dá)目標(biāo)。一個(gè)好的網(wǎng)站應(yīng)該盡量提供用戶(hù)所期望的信息和功能，并且提供清晰的導(dǎo)航，既然訪(fǎng)客可能需要"Digg This!"按鈕，我們就應(yīng)該提供給他們。

TechCrunch上個(gè)星期有條新聞標(biāo)題為New York Times Surrenders To Social News，意思是"紐約時(shí)報(bào)向社會(huì)化新聞投降"，說(shuō)的是New York Times網(wǎng)站上面部分版面的文章已經(jīng)加入了共享功能，包括把文章共享到Digg、Facebook和Newsvine的鏈接。既然連New York Times這樣的傳統(tǒng)媒體巨頭也加入了"Digg This!"按鈕，我們又怎能不加？

一個(gè)按鈕就這么簡(jiǎn)單

要加一個(gè)"Digg This!"按鈕其實(shí)很容易，參考官方的幫助你就知道這僅需如下格式的一個(gè)鏈接：
http://digg.com/submit?phase=2&url=&title=&bodytext=&topic=
其中url參數(shù)用于傳遞地址，title參數(shù)用于傳遞標(biāo)題，這兩個(gè)最好就是文章原本的地址和標(biāo)題。bodytext參數(shù)寫(xiě)你的推薦原因，topic參數(shù)表示推薦到的Digg欄目，這兩個(gè)參數(shù)通常不在鏈接中提供而讓讀者到了Digg的提交頁(yè)面后再填寫(xiě)。這四個(gè)參數(shù)都應(yīng)該經(jīng)過(guò)UrlEncode。

如果使用Blogger之類(lèi)的支持HTML模板的引擎，要放上一個(gè)這樣的鏈接很簡(jiǎn)單，直接寫(xiě)一個(gè)鏈接然后加上模板所支持的參數(shù)替換就能把url和title兩個(gè)參數(shù)搞定，可惜博客園的.Text引擎不支持HTML模板，也不支持參數(shù)替換。這樣就沮喪啦？如果是的話(huà)，你的一群讀者要跟著你一起沮喪了。我們還是一起努力把這個(gè)鏈接搞定吧，就一個(gè)鏈接而已，能夠有多難？

Do It Yourself

你確認(rèn)你是一個(gè)很有hack精神并且樂(lè)于DIY各種小玩意兒的人？那就跟我一起制作適用于博客園的"Digg This!"鏈接吧。如果你想先預(yù)覽一下效果，可以看看本文正文下方的那個(gè)"

我這里為大家提供了一個(gè)用于自動(dòng)添加"Digg This!"按鈕的JavaScript，這段代碼是我昨天花了兩個(gè)小時(shí)調(diào)試出來(lái)的，能夠在我當(dāng)前使用的博客園模板上自動(dòng)為文章頁(yè)添加"Digg This!"鏈接。在博客園的設(shè)置中找到"頁(yè)腳Html代碼"這一欄，把代碼貼進(jìn)去就行了，別忘了要用<script type="text/javascript"></script>把代碼包裝起來(lái)。我不能確保這段代碼一定能在你當(dāng)前使用的模板上正常運(yùn)行，所以這需要你有一定的JavaScript基礎(chǔ)和DIY精神，根據(jù)你的實(shí)際情況作一些修改。

在這里我可以解釋一下這段代碼的工作方式：通過(guò)對(duì)比首頁(yè)的HTML和文章頁(yè)的HTML，我發(fā)現(xiàn)了文章頁(yè)的標(biāo)題鏈接有一個(gè)特有的class="singleposttitle"屬性，我就通過(guò)這個(gè)屬性是否存在檢測(cè)當(dāng)前頁(yè)面是首頁(yè)還是文章頁(yè)。代碼執(zhí)行時(shí)會(huì)循環(huán)迭代頁(yè)面上所有的文章節(jié)點(diǎn)，如果它確認(rèn)當(dāng)前的是文章頁(yè)，它就在第一個(gè)文章節(jié)點(diǎn)的尾部追加一個(gè)<div />上去，然后添加"Digg This!"等的鏈接。

之所以要求你有一定的JavaScript基礎(chǔ)和DIY精神，是因?yàn)槲野l(fā)現(xiàn)不同的模板輸出的HTML結(jié)構(gòu)差異非常大，你必須手動(dòng)分析你當(dāng)前所使用的模板輸出的HTML，然后編寫(xiě)正確的JavaScript去識(shí)別頁(yè)面性質(zhì)并執(zhí)行添加鏈接的任務(wù)。而且你對(duì)頁(yè)面的添加功能需求細(xì)節(jié)可能和我不同，我的代碼中有一句anchor.style.fontSize="14pt";是用于將當(dāng)前文章標(biāo)題鏈接放大的，可能你并不喜歡那么大的標(biāo)題文字，也可能你希望在頁(yè)面中別的地方添加"Digg This!"鏈接，這都依賴(lài)于你的JavaScript編寫(xiě)能力了。

還有更有趣的嗎？

如果你不僅僅希望有"Digg This!"按鈕，還希望有"Add to del.icio.us"、"Share on Facebook"、"Google Bookmark This"等按鈕，你都可以自己加。分析第三方服務(wù)的調(diào)用方式不難，分析HTML結(jié)構(gòu)特征也不難，你需要的就是一點(diǎn)點(diǎn)的DIY精神加上了解新鮮事物的激情，然后一切都會(huì)變得十分容易。

前一段時(shí)間我在TechCrunch見(jiàn)到Snap的網(wǎng)頁(yè)截圖預(yù)覽功能，然后就放到自己的博客中用，接著發(fā)覺(jué)越來(lái)越多博客園用戶(hù)開(kāi)始使用這東西，看來(lái)好東西真的是會(huì)一傳十、十傳百的。然而我們不能總是等看到別人有好東西了，自己再拿來(lái)用，我們需要有一點(diǎn)創(chuàng)新精神和動(dòng)手能力，自己想一點(diǎn)新功能出來(lái)然后把它實(shí)現(xiàn)了。現(xiàn)在我為自己在博客園的文章添加了"Digg This!"按鈕，或許遲點(diǎn)我會(huì)添加一些更有趣的功能上去，讓它看上去更AJAX一些，這依賴(lài)于我何時(shí)能找到一臺(tái)穩(wěn)定服務(wù)的ASP.NET服務(wù)器。如果你對(duì)這方面的hacks(技巧)感興趣并且希望長(zhǎng)期關(guān)注的話(huà)，可以考慮訂閱Cat in dotNET。如果你覺(jué)得這篇文章不錯(cuò)的話(huà)，你可以點(diǎn)擊下面的"

P.S.

希望dudu能夠?yàn)槲覀冞@些博客園中真正名副其實(shí)的hackers提供一些幫助。現(xiàn)在博客園是支持"通過(guò)CSS定制頁(yè)面"的，這是通過(guò)引用/{username}/customcss.aspx實(shí)現(xiàn)的，不知道dudu能否以類(lèi)似的方式提供"通過(guò)JavaScript定制頁(yè)面"的支持，這樣我們就可以避免把JavaScript直接寫(xiě)到頁(yè)面上去，從而減少其重復(fù)下載的次數(shù)。另外現(xiàn)在那個(gè)customcss.aspx也是強(qiáng)制瀏覽器每次都重新下載的吧，是否可以考慮將地址形式改為/{username}/{timestamp}/customcss.aspx呢？其中timestamp是用戶(hù)最后更新CSS設(shè)置的時(shí)間，同時(shí)允許瀏覽器對(duì)CSS進(jìn)行緩存，這樣就能有效的減少CSS的重復(fù)下載。