上一篇里，我們從網(wǎng)站運(yùn)營的角度說了說SEO的網(wǎng)站內(nèi)部鏈接。

今天，從網(wǎng)站建設(shè)的角度，既設(shè)計(jì)師的角度來說說如何SEO一個(gè)網(wǎng)站的文字和HTML代碼比。

其實(shí)對于搜索引擎來說，最友好的，當(dāng)屬文字了，雖然現(xiàn)在圖片的抓取不斷在改進(jìn)，但是任何一位有經(jīng)驗(yàn)的老手都會(huì)告訴你，SEO，文字最合適。也正因?yàn)榇�，比方說網(wǎng)站建設(shè)博客里，圖雖有，但仍是文字居多。

這里給大家舉個(gè)簡單的例子，說明如何增加網(wǎng)站的文字與HTML代碼比：

如：
很多人喜歡這樣寫H1：<h1 class=”title”>這里是標(biāo)題</h1>
眾所周知，一個(gè)頁面不會(huì)出現(xiàn)兩個(gè)H1，如果有兩個(gè)，那好比一個(gè)人身上長著兩個(gè)腦袋一樣很難看。這不僅是常識(shí)，也是標(biāo)準(zhǔn)。所以給h1加上這些那些class或id是畫蛇添足。
應(yīng)這樣寫：<h1>這里是標(biāo)題</h1>
然后樣式需要在CSS中定義。
這是很簡單，那頁面中有圓倒角如何做？網(wǎng)上有N多辦法，其中最典型的就是HTML+CSS實(shí)現(xiàn)圓角矩形，HTML代碼部分如下：

<div class="panel">
<DIV class="t-o b1"></DIV>
<DIV class="t-o b2"></DIV>
<DIV class="t-o b3"></DIV>
<DIV class="t-o b4"></DIV>
<DIV class="content">
<!-- 這里放內(nèi)容 -->
<DIV class=clear></DIV>
</DIV>
<DIV class="b-o b4"></DIV>
<DIV class="b-o b3"></DIV>
<DIV class="b-o b2"></DIV>
<DIV class="b-o b1"></DIV>
<DIV class="break"></DIV>
</div>

其實(shí)，我們完全不必用這些代碼，可以簡化到：

<div class="panel">
<!-- 這里放內(nèi)容 -->
</div>

毫無疑問，這樣可以很明顯的減少HTML代碼，當(dāng)然，光這樣寫是失去了圓角效果，效果我們可以借助JS加上。
我們完全可以用純粹的JavaScript代碼來寫，為了方便，我們采用jQuery來寫：
jQuery(function($){
$('.panel').prepend('

‘).append(’

‘);
})
需要注意的是，這個(gè)JavaScript代碼要寫到一個(gè)獨(dú)立的js文件中。

如果頁面中，用到多個(gè)圓角，則只管設(shè)置class為panel即可。

這樣，我們可以減少HTML代碼，實(shí)現(xiàn)了增加內(nèi)容和HTML代碼比的目的。
在不犧牲用戶視覺效果的情況下，給爬蟲看一個(gè)干凈的頁面代碼，并且在網(wǎng)速相等的條件下，一定的減少抓取時(shí)間，有利于抓取，毫無疑問，也將有利于搜索引擎的排名。

除了這個(gè)圓角外，滑動(dòng)門等，完全可以用jQuery進(jìn)行代碼優(yōu)化，說點(diǎn)不客氣的話，國內(nèi)常用的那些滑動(dòng)門實(shí)在是惡心，還得加一大堆沒用的id，其實(shí)滑動(dòng)門可以做的更簡單。

這里是HTML代碼:

<dl>
<dt>滑動(dòng)門標(biāo)題1</dt>
<dd>滑動(dòng)門1對應(yīng)的內(nèi)容</dd>
<dt>滑動(dòng)門標(biāo)題2</dt>
<dd>滑動(dòng)門2對應(yīng)的內(nèi)容</dd>
......
</dl>

文章版權(quán)為成捷信息科技所有，轉(zhuǎn)載請注明出處：http://www.inwebsite.com.cn/blog/webdesign/words_html_code


標(biāo)簽： SEO html 文字 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。