小站開張之后，我就一直在關(guān)注小站的站名“CSS魔法”在搜索引擎里的表現(xiàn)。小站在這個關(guān)鍵詞的排名上很快就勇拔頭籌——當(dāng)然這是意料之中的。但接下來發(fā)現(xiàn)，小站在其它一些關(guān)鍵詞上的表現(xiàn)也非常突出，譬如“CSS習(xí)題”、“CSS練習(xí)題”、“Web標(biāo)準(zhǔn)面試題”等等，居然也是非常靠前的。在發(fā)布了 某篇 CSS 教程 之后，“二級導(dǎo)航制作”、“折疊二級導(dǎo)航”等關(guān)鍵詞也給小站帶來了少許流量。這些情況倒是令我有些意外，畢竟小站未做刻意推廣或 SEO。

如果要找原因的話，我覺得還是應(yīng)該歸功于良好的 HTML 結(jié)構(gòu)和語義化標(biāo)簽的運用。在建博之前，小站的頁面均為手寫，力求語義化標(biāo)簽的合理運用；同時，對頁面頭部的
title
和
meta
信息也做了合理的安排。這其中的要點在于：

正如每篇文章都有其標(biāo)題一樣，每個頁面都必須擁有
h1
元素，其內(nèi)容應(yīng)該是頁面內(nèi)容的大標(biāo)題。而且通常頁面
title
也應(yīng)該包含此信息。這樣一來，
h1
元素和頁面
title
很自然地就包含了站點或該頁面的核心關(guān)鍵詞，并不需要刻意地進行所謂的“優(yōu)化”。
合理地運用
h2
、
h3
等標(biāo)題元素。對于內(nèi)容頁來說，它們自然就是文章的不同級別的標(biāo)題；而對于首頁或功能頁來說，我一般還將它們用作功能區(qū)塊的標(biāo)志元素。
頁面描述的
meta
信息的重要性不可忽視，應(yīng)包含或概括頁面的核心內(nèi)容。（不過由于精力有限，本站早期頁面的描述信息采用的是公用的模板。）
Web 標(biāo)準(zhǔn)的優(yōu)越性已經(jīng)深入人心了，結(jié)構(gòu)與表現(xiàn)的分離至關(guān)重要。在制作頁面時，盡量保證頁面代碼純凈無雜質(zhì)，避免表格的嵌套和
font
、
center
等純表現(xiàn)的標(biāo)簽。這樣整個頁面的體積非常輕巧，便于搜索引擎抓取。
還可以在頁面中使用
strong
、
em
、
dfn
等元素進一步強化關(guān)鍵詞。似乎這個步驟的重要性遠不及前面幾條，適量使用就好。
做完了這些，搜索引擎自然會對頁面的品質(zhì)和價值有一個積極的判斷。我甚至在猜測，像 Google 這樣聰明的搜索引擎，會不會對采用豐富的語義化標(biāo)簽進行編寫的頁面更有好感，從而加大權(quán)重？

P.S. 竊喜了一段時間之后，我也很快冷靜下來，小站的優(yōu)勢關(guān)鍵詞還是比較冷門。如果哪天在“CSS”這樣的關(guān)鍵詞排名中也名列前茅的話，那才叫牛×！