SEO之優化代碼
Meta標簽:如果要做的非常簡單,meta標簽只需要設置一個字符編碼就可以了,咱們在任意地方購買的模版都會寫上字符編碼,另外Title標題、關鍵詞、Description描述這裏也列為meta標簽去優化,這三個地方,一半在模版中會直接調用到後臺,可以直接在後臺設置,所以代碼上需要基本是不需要操作。
CSS/JS引用:在我們購買到網站模版後,大多數的網站均是調用JS或CSS的,這裏需要主意的是最好使用絕對路徑調用JS/CSS,如下所示:
<LINK rel=stylesheet type=text/css href="http://ssffx.com/templets/lusongsong/style/LuSongSong-Index.css?ver=20141015
當然,絕對路徑是全站都需要做到的,像圖片、文章鏈接、CSS/JS調用等。這一點是許多優化人員不知道並且沒有做的一點,那麽絕對路徑和相對路徑是什麽意思呢?下面的代碼就是相對路徑,看完後,我相信你已經明白了,無非就是在代碼中加入自己的網站域名即可。
<LINK rel=stylesheet type=text/css href="/templets/lusongsong/style/LuSongSong-Index.css?ver=20141015
另外相信大家都看到上面這一段CSS的時候會感覺有點不一樣,那就是我接下來要說的CSS設置緩存時間,當你的CSS/JS更新以後,瀏覽器會保持原來的緩存,如果不強行刷新,網站是不會更改過來,所以這裏需要設置緩存時間(?ver=20141015)來幫用戶更新新的界面,這一點對SEO沒有直接作用,但是對用戶體驗有很大的幫助。
JS位置:我們買來的模版,JS絕對都是放在頭部,但在優化的過程中,而JS文件通常是效果文件,我們可以讓網站先加載主題內容,其次加載效果內容,所以有必要把JS文件從頭部移動到底部,這樣用戶看起來你的網站會訪問的更快,當然如果CSS有必要,一樣可以這樣做,常規的CSS是不建議放到底部,會影響加載效果。另外JS及CSS不建議在html模版中寫入,最好是新建一個JS或CSS文件,然後把JS或CSS內容放入,在調用這個CSS或JS文件即可。
LOGO:LOGO部分需要優化的主要有兩個方面,第一個方面在LOGO處加H1標簽,其次是在LOGO的A標簽處添加一個title屬性,title屬性中寫上你優化的主關鍵詞,之所以建議寫主關鍵詞而不寫品牌詞原因有兩個,第一個增加優化主關鍵詞的密度,其次是title屬性用戶很難得看得到。
廣告:如果你網站是自己接的廣告,那可以使用百度廣告管家統計數據,同時還可以把多個廣告位的JS整合到一個JS裏面,這是對廣告聯盟的JS做一個何必,如果你是使用百度廣告聯盟,沒關系,一樣對接到百度管家裏面,然後把廣告聯盟的JS整合到一個JS。其他第三方的廣告聯盟就設置不了,也沒有這個優勢!
導航:導航上的優化,通常就是一個A標簽,這個A標簽不建議設置新窗口打開,另外一個是A標簽中的title屬性,如果條件允許,可以直接設置成行業詞,而A標簽中可顯示的文字可以設置成品牌詞,這樣在不影響體驗的同時一樣達到了優化關鍵詞的效果。
文章鏈接:文章鏈接通常是做兩個,一個在標題上,一個做在描述上,我的博客之所以沒做描述上的鏈接,主要是在百度熱力圖上並沒有看到有多少人點擊描述部位。不過我還是建議在描述位置增加一個A標簽,A標簽中增加title屬性。
這裏需要提醒一點的是,當一篇文章出現兩個一樣的A標簽指向的時候,我們需要用nofollow標簽屏蔽其中一個鏈接,這裏描述和標題都出現了同一個鏈接,這裏建議使用nofollow標簽屏蔽描述上的鏈接,加上去是為了讓用戶方便點擊,屏蔽是為了不讓搜索引擎重復抓取。
搜索:站內搜索頁面本不建議做SEO優化,因為大多站內搜索都是動態頁面,而這些動態頁面均直接用robots了屏蔽百度蜘蛛,艾瑞網曾使用搜索結果頁面做SEO排名被刷排名出現降權,所以我們要吸取教訓,不過最好還是建議使用百度的站內搜索。這樣自己網頁就不會出現太多的垃圾頁面收錄了。
版權:版權是可以留下的,使用別人的程序不留版權是不道德的行為,所以有必要在底部留下對於的版權信息,但是版權、備案、站外鏈接都應該加nofollow標簽,當然這是站外的鏈接,站內也有部分鏈接需要加入nofollow標簽,比如我博客底部的廣告合作、微信二維碼、手機客戶端、聯系QQ等頁面。
體驗:其實在用戶體驗上的優化本問說的並不少很多,但代碼可以決定用戶體驗,比如增加百度統計的返回頂部功能,文章頁面增加快速評論功能、一個網站最多只能顯示3屏、左右可以翻頁等功能,看起來功能非常少,但綜合的細節決定一個網站的成敗!
網站地圖:網站地圖是搜索引擎最容易抓取的一個頁面,這個頁面裏面有所有應該被抓取的內容,所以很多時候,搜索引擎為了偷懶,他自然會抓取網站地圖文件,通常情況下網站地圖的代碼如下所示:
<url>
<loc>http://ssffx.com/SEOjishu/</loc>
<changefreq>daily</changefreq>
<priority>0.8</priority>
</url>
代碼非常簡單LOC為鏈接、changefreq為更新時間,我博客的更新時間為一周、priority為權重,比如首頁為1,欄目為0.8。
Robots:搜索引擎在抓取一個網站的時候,第一時間看robots 文件,這裏可以識別到哪些文件可以抓取,哪些文件不可以,robots文件最主要一點就是把網站地圖寫上去,如下所示:
Sitemap: http://ssffx.com/sitemap.xml
一、head標簽中的部分
1.URL設計
URL盡量含有通用已成趨勢的移動命名,例如“m./wap./3g./mobi./mobile./mob/wml/”,可以在子域名等方面體現
2.頁面頂部的doctype標簽
作為協議的重要部分,doctype中是否移動化也很重要,檢查是否存在與移動相關的聲明,如這些關鍵詞,openmobilealliance, xhtml-mobile, xhtml-basic,wapforum,dtd compact html
例:“<!DOCTYPE html PUBLIC “-//WAPFORUM//DTD XHTML Mobile 1.0//EN””http://www.wapforum.org/DTD/xhtml-mobile10.dtd”>”
3.meta標簽中的viewport屬性和x-ua-compatible 屬性
viewport,移動前端開發中最重要的標簽,響應式設計的根基,如果你的頁面是遵守響應式設計的,那麽說明這些頁面對移動設備有友好的輸出。
典型的的viewport代碼是這樣的,<meta name=“viewport” content=“width=device-width, initial-scale=1.0″>,判斷移動與否的關鍵屬性值為width,如果width=device-width這是典型的移動友好的設計,增加判定為移動頁面的砝碼,如果width有具體值,且值大於典型的移動屏幕(應該小於600),那麽該頁面被判定為PC頁面的幾率大大增加。
但,META中還有一個很獨特的屬性作為SEO人員應該很少接觸到,那就是x-ua-compatible 屬性,該屬性是PC意味非常強烈的功能性代碼。示例代碼如此,<meta http-equiv=”X-UA-Compatible” content=”IE=9; IE=8; IE=7; IE=EDGE” />,從百度工程師處得知,該代碼會有較強暗示當前頁面為PC頁面的功能,需選擇性使用。
4.title中的移動暗示
制作移動頁面時,在title標簽中寫明:“移動版”、“手機版”、“WAP版”、“觸屏版”不僅是照顧用戶體驗的方案,也利於頁面的移動識別,反之PC頁面要謹慎使用這些文案。
5.鏈接link標簽的media和href屬性中需要註意的細節(多為樣式文件)
media屬性值為screen時,表示屏幕中的顯示樣式,link的href所填寫的URL(基本為樣式文件的URL)就比較重要了,一定程度加大不同設備的偏重。此時URL中盡量出現/wap,/mobile/這樣的命名,同URL設計一樣,用於提高頁面識別為移動的效率和概率。
如URL中含有pc字樣則加大識別為PC頁面的幾率。
6.一些通用的PC類識別HTML代碼
embed:經常用於嵌入多媒體
object:用於嵌入對象
marquee:老舊的滾動特效實現代碼
iframe:想必網站優化人員很熟悉了,典型的PC常用標簽
這些典型的用於PC或者老舊的、HTML5已經有更高效替代方案的舊標簽,意味著使用它們將增加頁面的PC屬性,需要有目的地取舍。
7.一些javascript中典型的PC特征
加載swfobject、含有activexobject語句:移動頁面根本不會使用如此重的多媒體引用方案(不信你問問你的前端工程師)
含有netscape(網景)、msie(IE)、firefox(火狐)、browser.msie(IE)這些典型的非移動端瀏覽器兼容代碼的
設置了timer的 ,以及JS代碼含有settimeout,的(此處不知道為什麽設置timer還有識別的問題)
均大幅增加識別為PC頁面的可能性
以上這些<head></head>中出現的內容,
二、正文body中需要註意的部分
鏈接和文本遵照的原則基本與head中一樣——多出現移動相關的字眼;頁面設置的寬度不要超過常規移動設備的大小;那些常識中(除非招錯前端工程師)絕對只用於PC的一些兼容性代碼。
此外div塊的個數也值得註意,沒有哪家移動頁面會過量使用div塊;還有典型的只用於適配PC機器的HTML代碼,例如:accesskey(如果移動頁面用,要不前端招錯人了,要不產品招錯人了,應該引起警覺)head和正文兩大部分,基本涵蓋了一張頁面最主要的部分。
網站優化人員一定要把握這些使用細節,協助前端工程師從正反方向將公司的PC和手機頁面涇渭分明地呈現給搜索引擎。試想如果你每日被抓取頁面達到90%的識別率,而一般水平是70%,這種優化增量是非常顯著的。
最後,分享一個機器學習的思想給網站優化的新人,此文中心思想截取如下:
你從市場上的芒果裏隨機的抽取一定的樣品(訓練數據), 制作一張表格, 上面記著每個芒果的物理屬性, 比如顏色, 大小, 形狀, 產地, 賣家, 等等。(這些稱之為特征)。
還記錄下這個芒果甜不甜, 是否多汁,是否成熟(輸出變量)。你將這些數據提供給一個機器學習算法(分類算法/回歸算法),然後它就會學習出一個關於芒果的物理屬性和它的質量之間關系的模型。
下次你再去市集, 只要測測那些芒果的特性(測試數據),然後將它輸入一個機器學習算法。算法將根據之前計算出的模型來預測芒果是甜的,熟的, 並且/還是多汁的。
來源:SEO自學網
SEO之優化代碼