陳凱

在觀看倫敦奧運(yùn)會(huì)的開幕式時(shí)，很少有觀眾會(huì)預(yù)先想到這樣的場(chǎng)景：萬維網(wǎng)的發(fā)明者蒂姆·伯納斯·李來到現(xiàn)場(chǎng)，他坐在角落里，不聲不響地用鍵盤敲打出“This is for Everyone”一行字，這一幕激起了無數(shù)觀眾的共鳴。萬維網(wǎng)——這是為所有人而造，蒂姆在1989年提出萬維網(wǎng)的設(shè)想并無私地將他的發(fā)明貢獻(xiàn)給世界。這里引用新華社刊發(fā)的奧運(yùn)專電中的話：“正是萬維網(wǎng)，讓原本十分復(fù)雜的因特網(wǎng)變得更為豐富多彩，以及簡(jiǎn)單易用。如果沒有萬維網(wǎng)，就沒有臉書（Facebook）、推特（Twitter）……”今天，每個(gè)上網(wǎng)者在享受沖浪便捷的時(shí)候，可能視所有這些便捷為理所當(dāng)然，而很難有意識(shí)地領(lǐng)會(huì)到當(dāng)年蒂姆所作設(shè)計(jì)的重要意義，筆者打算用兩期的篇幅，借萬維網(wǎng)本身，試著喚回學(xué)習(xí)者對(duì)于萬維網(wǎng)的新鮮感。

內(nèi)涵與外貌

先來拜訪地球上的第一張網(wǎng)頁，該網(wǎng)頁地址在“http：//info.cern.ch”，且慢，先不要用瀏覽器直接打開該網(wǎng)頁，而是借“在線轉(zhuǎn)換網(wǎng)（www.online-convert.com）”強(qiáng)大的轉(zhuǎn)換功能，用不同以往的視角來做一些觀察。

1.假如因特網(wǎng)上的“網(wǎng)頁”只是一個(gè)個(gè)文本文檔，那么，網(wǎng)絡(luò)用戶的體驗(yàn)會(huì)是怎么樣的呢？用瀏覽器進(jìn)入在線轉(zhuǎn)換網(wǎng)（www.online-convert.com），找到“Document converter”標(biāo)簽，選中“Convert to TXT”，在接下來出現(xiàn)的頁面中，找到“Or enter URL of the file you want to convert to TXT”框，填入想要瀏覽的網(wǎng)頁地址“info.cern.ch”，稍等片刻后，就可以下載或直接打開一個(gè)文本文件，只要英語好，肯定能讀明白文檔內(nèi)容，當(dāng)然也很容易把文檔內(nèi)容復(fù)制下來（如圖1）。當(dāng)然，大家肯定會(huì)想，這個(gè)文檔看上去實(shí)在太沒有美感，怎么樣才能讓網(wǎng)絡(luò)上的資源更賞心悅目呢？

2.想要讓因特網(wǎng)上的文檔變得更漂亮些嗎？仍然利用在線轉(zhuǎn)換網(wǎng)的轉(zhuǎn)換功能，只是這次不是將網(wǎng)頁轉(zhuǎn)成文字，而是轉(zhuǎn)成圖片。這么一來，所瀏覽到的內(nèi)容的效果就好多了（如圖2），不過很快就能發(fā)現(xiàn)許多不方便的地方。例如，怎么才能復(fù)制其中的文字？怎么樣才能夠得到那張蒂姆的照片？如果想把照片往上移一些，或者放大一些，有什么方便的方法呢？

3.經(jīng)過兩次轉(zhuǎn)換實(shí)驗(yàn)，大家或許會(huì)生出“魚和熊掌不可兼得”的感覺，怎么樣將網(wǎng)絡(luò)資源的內(nèi)容和內(nèi)容呈現(xiàn)的形式有機(jī)地結(jié)合起來呢？蒂姆考察了當(dāng)時(shí)已有的超文本系統(tǒng)，決定將超文本的概念用到網(wǎng)絡(luò)上，于是開發(fā)出超文本標(biāo)記語言，即HTML（Hyper Text Markup Language），該語言巧妙地將網(wǎng)絡(luò)資源的外貌與內(nèi)涵統(tǒng)一成整體?，F(xiàn)在，請(qǐng)大家再用瀏覽器訪問“info.cern.ch”，相比之下，就能體會(huì)出蒂姆的用心了。

需要附帶說明的是，雖然全世界的第一張網(wǎng)頁確為“http：//info.cern.ch/default.html”，但20多年時(shí)間里，網(wǎng)頁的內(nèi)容已有很大變化，如果想要欣賞最初的頁面原版，可訪問“http：//www.w3.org/History/19921103-hypertext/hypertext/WWW/News/9201.html”。

美麗的網(wǎng)頁樹

每一張網(wǎng)頁，都是由許多個(gè)HTML文檔對(duì)象組合而成的，這些對(duì)象并不是平行鋪砌在一起，而是層層嵌套，雖然可以將這樣的結(jié)構(gòu)類比為俄羅斯套娃，但與套娃不同的是，大娃娃里可以同時(shí)套好幾個(gè)小娃娃），所以更好一些的類比可以是一根樹枝上分岔出更多樹枝。

接下來的實(shí)驗(yàn)，是直觀地欣賞不同網(wǎng)頁中的HTML文檔對(duì)象的組織結(jié)構(gòu)（而不是瀏覽網(wǎng)頁本身），用瀏覽器訪問“www.aharef.info”網(wǎng)站，在“Webpage Address”文本框中填寫想要考察的網(wǎng)頁的地址，如“http：//info.cern.ch”（注意這里必須寫上“http：//”），接著點(diǎn)擊“OK - Now show me the graph！”，等待片刻，萬維網(wǎng)上的美麗網(wǎng)頁樹便層層舒展開枝條。如圖3中，黑色圓圈是最外層的HTML標(biāo)記，或者，也可以想象成是所有分支的主干，而每個(gè)分支下又能展開新的分支，在圖3中，紫色代表圖片、藍(lán)色代表超鏈接……每一種顏色的圓圈都代表不同類型的網(wǎng)頁標(biāo)簽。更詳細(xì)的描述可參考該網(wǎng)站上的說明。