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

近幾日多用了點(diǎn)心在工作室小站——悠然天空工作室(L-SKY.STUDIO)上面，以前一直不重視它主要是因?yàn)榭蛻魩缀醵际莵碜跃€下，弄個(gè)小站的目的僅僅是給自己一個(gè)空間，“為所欲為”罷了!回到家20多天了，前期一直在弄團(tuán)隊(duì)博客——青裝營(yíng)銷策劃?rùn)C(jī)構(gòu)，百度已經(jīng)開始收錄了，希望過年這段時(shí)間大家也別放松，多多給力才好!

這幾天給工作室的后臺(tái)添加了在線生成Robots.txt文件和在線訪客這兩個(gè)功能，測(cè)試了一段時(shí)間發(fā)現(xiàn)各家蜘蛛大神來我這里還是比較勤快的，尤其是雅虎中國(guó)和百度，不過基本上都是首頁，內(nèi)鏈的比較少。前幾天在寫蜘蛛爬行記錄功能的時(shí)候，一不小心把百度和谷歌兩家的蜘蛛關(guān)在門外了，搞的平日2天一更新的快照到現(xiàn)在都5天了還不更新!為了吸引蜘蛛大大們的照顧，重新把前臺(tái)的代碼翻了出來，結(jié)合《搜索引擎優(yōu)化的一些規(guī)則》一文里面的要點(diǎn)對(duì)代碼整體進(jìn)行了優(yōu)化。請(qǐng)注意：我下面要說的其實(shí)并不是SEO優(yōu)化，如果你想學(xué)習(xí)SEO優(yōu)化、營(yíng)銷策劃等知識(shí)，請(qǐng)移步我們的團(tuán)隊(duì)博客——青裝營(yíng)銷策劃?rùn)C(jī)構(gòu)，那里絕對(duì)有你想要的一切!

這次我做的站內(nèi)優(yōu)化重中之重其實(shí)就是下面一點(diǎn)：

代碼語義化

代碼語義化，絕對(duì)算得上一個(gè)老生常談的問題了。百度一下，你會(huì)發(fā)現(xiàn)大把的關(guān)于代碼語義化的文章。那么，為什么要語義化代碼?其實(shí)我們知道html里面的每一個(gè)標(biāo)簽都有它自己的特定意義，而語義化這些標(biāo)簽的意思，就是要我們?cè)谶m當(dāng)?shù)奈恢檬褂煤线m的標(biāo)簽，以此達(dá)到更好的讓人和機(jī)器(這里說的機(jī)器可以理解為搜索引擎的蜘蛛大神們)都一目了然。更多信息請(qǐng)前往我們的團(tuán)隊(duì)博客了解……

如何在適當(dāng)?shù)奈恢檬褂煤线m的標(biāo)簽?

這是一個(gè)簡(jiǎn)單的理解邏輯。比如，h1~h6標(biāo)簽是用于標(biāo)題類的;ul是用于無序列表的;ol是用于有充列表的;dl是用于定義列表的;em，strong標(biāo)簽是用來強(qiáng)調(diào)的…說白了，HTML標(biāo)簽的每個(gè)英文釋義決定了它的語義(本文后面，我會(huì)放一份常用HTML標(biāo)簽的英文釋義對(duì)照表供參考)。

什么樣的代碼才可以讓人和機(jī)器都能一目了然?

檢查HTML頁面是否語義化最好的方法，便是去掉頁面的CSS鏈接，看網(wǎng)頁結(jié)構(gòu)是否井然有序，頁面是否仍然有很好的可讀性。為什么可以這么說?大家都知道瀏覽器都有默認(rèn)的樣式(推薦使用Chrome的Web Developer Tools for Chrome 插件，或者Firefox的Web Developer 插件)，比如h1~h6，會(huì)有加粗/字號(hào)依次減小、上下邊距的默認(rèn)樣式，ul、ol、dl都有默認(rèn)的項(xiàng)目符號(hào)，strong默認(rèn)有加粗的樣式…所以，同樣的頁面，語義化良好的HTML可以在頁面CSS去掉的情況下依然有良好的表現(xiàn)。

還有一點(diǎn)，好的語義化編碼，對(duì)搜索引擎有更好的友好性。搜索蜘蛛是不認(rèn)識(shí)你的CSS的，但它能識(shí)別HTML標(biāo)簽。

下面是一個(gè)簡(jiǎn)單的例子：

通過上面的簡(jiǎn)單的示例和沒有任何CSS定義情況下的效果圖，該明白了兩者的區(qū)別了吧。如果你在學(xué)習(xí)HTML5，它的header、footer、sidebar、article等元素都是新增的語義化標(biāo)簽.

HTML編碼語義化是邁向高質(zhì)量前端開發(fā)的一步。即更好的遵循Web標(biāo)準(zhǔn)，也能讓你頁面在去掉樣式后依然井然有序。關(guān)于語義化更多更詳細(xì)的介紹，可以自行Google或閱讀阿當(dāng)?shù)摹禬eb前端開發(fā)修煉之道》 第三章。

附: 標(biāo)簽語義中英文對(duì)照表(刪除線為html5不支持的標(biāo)簽)

如果無視標(biāo)簽語義和默認(rèn)樣式，所有標(biāo)簽都用div，其實(shí)也是可以寫出來視覺效果很好的頁面，只要你靈活運(yùn)用CSS。但是那樣的話雖然視覺上達(dá)到了要求，但是整個(gè)頁面一點(diǎn)語義都沒有，搜索引擎還是看不懂。所以，要記?。?/p>

結(jié)構(gòu)(html)才是重點(diǎn)，樣式(css)是用來修飾結(jié)構(gòu)的。所以，要先確定html，確定標(biāo)簽，再來選用合適的css。

一般來說，所有的標(biāo)簽都會(huì)有一個(gè)默認(rèn)的樣式，所以一個(gè)簡(jiǎn)單的判斷網(wǎng)頁標(biāo)簽語義是否良好的方法就是：去掉樣式，看網(wǎng)頁結(jié)構(gòu)是否組織良好有序，是否仍然有很好的可讀性。

另外，值得重點(diǎn)提及的是h標(biāo)簽，h標(biāo)簽的語意是標(biāo)題，搜索引擎對(duì)這個(gè)標(biāo)簽比較敏感，特別是h1和h2。一個(gè)語義良好的頁面，h標(biāo)簽應(yīng)該是完整有序沒有斷層的。也就是說，要h1，h2，h3，h4這樣推下來，不要h1，h3，h4，漏掉h2。一個(gè)結(jié)構(gòu)良好的網(wǎng)頁，h標(biāo)簽可以組織起一個(gè)網(wǎng)頁的大綱。

本文由悠然白鹿原創(chuàng) 轉(zhuǎn)載請(qǐng)保留原文地址：，歡迎加入，青裝營(yíng)銷策劃交流群共同交流學(xué)習(xí)：36936294

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