中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

前端SEO技巧,都是干貨

2023-06-09    分類: 網(wǎng)站建設(shè)

前幾天在慕課網(wǎng)上學(xué)習(xí)了“SEO在網(wǎng)頁制作中的應(yīng)用”,覺得挺好、挺有用的,今天,特此做了一個(gè)小小的筆記,也算是對(duì)學(xué)習(xí)過后的一個(gè)總結(jié)。

一、搜索引擎工作原理

當(dāng)我們?cè)谳斎肟蛑休斎腙P(guān)鍵詞,點(diǎn)擊搜索或查詢時(shí),然后得到結(jié)果。深究其背后的故事,搜索引擎做了很多事情。

在搜索引擎網(wǎng)站,比如百度,在其后臺(tái)有一個(gè)非常龐大的數(shù)據(jù)庫,里面存儲(chǔ)了海量的關(guān)鍵詞,而每個(gè)關(guān)鍵詞又對(duì)應(yīng)著很多網(wǎng)址,這些網(wǎng)址是百度程序從茫茫的互聯(lián)網(wǎng)上一點(diǎn)一點(diǎn)下載收集而來的,這些程序稱之為“搜索引擎蜘蛛”或“網(wǎng)絡(luò)爬蟲”。這些勤勞的“蜘蛛”每天在互聯(lián)網(wǎng)上爬行,從一個(gè)鏈接到另一個(gè)鏈接,下載其中的內(nèi)容,進(jìn)行分析提煉,找到其中的關(guān)鍵詞,如果“蜘蛛”認(rèn)為關(guān)鍵詞在數(shù)據(jù)庫中沒有而對(duì)用戶是有用的便存入數(shù)據(jù)庫。反之,如果“蜘蛛”認(rèn)為是垃圾信息或重復(fù)信息,就舍棄不要,繼續(xù)爬行,尋找新的、有用的信息保存起來提供用戶搜索。當(dāng)用戶搜索時(shí),就能檢索出與關(guān)鍵字相關(guān)的網(wǎng)址顯示給訪客。

一個(gè)關(guān)鍵詞對(duì)用多個(gè)網(wǎng)址,因此就出現(xiàn)了排序的問題,相應(yīng)的當(dāng)與關(guān)鍵詞吻合的網(wǎng)址就會(huì)排在前面了。在“蜘蛛”抓取網(wǎng)頁內(nèi)容,提煉關(guān)鍵詞的這個(gè)過程中,就存在一個(gè)問題:“蜘蛛”能否看懂。如果網(wǎng)站內(nèi)容是flash和js,那么它是看不懂的,會(huì)犯迷糊,即使關(guān)鍵字再貼切也沒用。相應(yīng)的,如果網(wǎng)站內(nèi)容是它的語言,那么它便能看懂,它的語言即SEO。


二、SEO簡(jiǎn)介

全稱:Search English Optimization,搜索引擎優(yōu)化。自從有了搜索引擎,SEO便誕生了。

存在的意義:為了提升網(wǎng)頁在搜索引擎自然搜索結(jié)果中的收錄數(shù)量以及排序位置而做的優(yōu)化行為。簡(jiǎn)言之,就是希望百度等搜索引擎能多多我們收錄精心制作后的網(wǎng)站,并且在別人訪問時(shí)網(wǎng)站能排在前面。

分類:白帽SEO和黑帽SEO。白帽SEO,起到了改良和規(guī)范網(wǎng)站設(shè)計(jì)的作用,使網(wǎng)站對(duì)搜索引擎和用戶更加友好,并且網(wǎng)站也能從搜索引擎中獲取合理的流量,這是搜索引擎鼓勵(lì)和支持的。黑帽SEO,利用和放大搜索引擎政策缺陷來獲取更多用戶的訪問量,這類行為大多是欺騙搜索引擎,一般搜索引擎公司是不支持與鼓勵(lì)的。本文針對(duì)白帽SEO,那么白帽SEO能做什么呢?

1. 對(duì)網(wǎng)站的標(biāo)題、關(guān)鍵字、描述精心設(shè)置,反映網(wǎng)站的定位,讓搜索引擎明白網(wǎng)站是做什么的;

2. 網(wǎng)站內(nèi)容優(yōu)化:內(nèi)容與關(guān)鍵字的對(duì)應(yīng),增加關(guān)鍵字的密度;

3. 在網(wǎng)站上合理設(shè)置Robot.txt文件;

4. 生成針對(duì)搜索引擎友好的網(wǎng)站地圖;

5. 增加外部鏈接,到各個(gè)網(wǎng)站上宣傳;

三、前端SEO

通過網(wǎng)站的結(jié)構(gòu)布局設(shè)計(jì)和網(wǎng)頁代碼優(yōu)化,使前端頁面既能讓瀏覽器用戶能夠看懂,也能讓“蜘蛛”看懂。

(1)網(wǎng)站結(jié)構(gòu)布局優(yōu)化:盡量簡(jiǎn)單、開門見山,提倡扁平化結(jié)構(gòu)。

一般而言,建立的網(wǎng)站結(jié)構(gòu)層次越少,越容易被“蜘蛛”抓取,也就容易被收錄。一般中小型網(wǎng)站目錄結(jié)構(gòu)超過三級(jí),“蜘蛛”便不愿意往下爬,“萬一天黑迷路了怎么辦”。并且根據(jù)相關(guān)調(diào)查:訪客如果經(jīng)過跳轉(zhuǎn)3次還沒找到需要的信息,很可能離開。因此,三層目錄結(jié)構(gòu)也是體驗(yàn)的需要。為此我們需要做到:

1. 控制首頁鏈接數(shù)量

網(wǎng)站首頁是權(quán)重高的地方,如果首頁鏈接太少,沒有“橋”,“蜘蛛”不能繼續(xù)往下爬到內(nèi)頁,直接影響網(wǎng)站收錄數(shù)量。但是首頁鏈接也不能太多,一旦太多,沒有實(shí)質(zhì)性的鏈接,很容易影響用戶體驗(yàn),也會(huì)降低網(wǎng)站首頁的權(quán)重,收錄效果也不好。

因此對(duì)于中小型企業(yè)網(wǎng)站,建議首頁鏈接在100個(gè)以內(nèi),鏈接的性質(zhì)可以包含頁面導(dǎo)航、底部導(dǎo)航、錨文字鏈接等等,注意鏈接要建立在用戶的良好體驗(yàn)和引導(dǎo)用戶獲取信息的基礎(chǔ)之上。

2.扁平化的目錄層次,盡量讓“蜘蛛”只要跳轉(zhuǎn)3次,就能到達(dá)網(wǎng)站內(nèi)的任何一個(gè)內(nèi)頁。扁平化的目錄結(jié)構(gòu),比如:“植物”--> "水果" --> "蘋果"、“桔子”、“香蕉”,通過3級(jí)就能找到香蕉了。

3.導(dǎo)航優(yōu)化

導(dǎo)航應(yīng)該盡量采用文字方式,也可以搭配圖片導(dǎo)航,但是圖片代碼一定要進(jìn)行優(yōu)化,<img>標(biāo)簽必須添加“alt”和“title”屬性,告訴搜索引擎導(dǎo)航的定位,做到即使圖片未能正常顯示時(shí),用戶也能看到提示文字。

其次,在每一個(gè)網(wǎng)頁上應(yīng)該加上面包屑導(dǎo)航,好處:從用戶體驗(yàn)方面來說,可以讓用戶了解當(dāng)前所處的位置以及當(dāng)前頁面在整個(gè)網(wǎng)站中的位置,幫助用戶很快了解網(wǎng)站組織形式,從而形成更好的位置感,同時(shí)提供了返回各個(gè)頁面的接口,方便用戶操作;對(duì)“蜘蛛”而言,能夠清楚的了解網(wǎng)站結(jié)構(gòu),同時(shí)還增加了大量的內(nèi)部鏈接,方便抓取,降低跳出率。

4. 網(wǎng)站的結(jié)構(gòu)布局--不可忽略的細(xì)節(jié)

頁面頭部:logo及主導(dǎo)航,以及用戶的信息。

頁面主體:左邊正文,包括面包屑導(dǎo)航及正文;右邊放熱門文章及相關(guān)文章,好處:留住訪客,讓訪客多停留,對(duì)“蜘蛛”而言,這些文章屬于相關(guān)鏈接,增強(qiáng)了頁面相關(guān)性,也能增強(qiáng)頁面的權(quán)重。

頁面底部:版權(quán)信息和友情鏈接。

特別注意:分頁導(dǎo)航寫法,推薦寫法:“首頁 1 2 3 4 5 6 7 8 9 下拉框”,這樣“蜘蛛”能夠根據(jù)相應(yīng)頁碼直接跳轉(zhuǎn),下拉框直接選擇頁面跳轉(zhuǎn)。而下面的寫法是不推薦的,“首頁 下一頁 尾頁”,特別是當(dāng)分頁數(shù)量特別多時(shí),“蜘蛛”需要經(jīng)過很多次往下爬,才能抓取,會(huì)很累、會(huì)容易放棄。

5.控制頁面的大小,減少http請(qǐng)求,提高網(wǎng)站的加載速度。

一個(gè)頁面好不要超過100k,太大,頁面加載速度慢。當(dāng)速度很慢時(shí),用戶體驗(yàn)不好,留不住訪客,并且一旦超時(shí),“蜘蛛”也會(huì)離開。

(2)網(wǎng)頁代碼優(yōu)化

1.<title>標(biāo)題:只強(qiáng)調(diào)重點(diǎn)即可,盡量把重要的關(guān)鍵詞放在前面,關(guān)鍵詞不要重復(fù)出現(xiàn),盡量做到每個(gè)頁面的<title>標(biāo)題中不要設(shè)置相同的內(nèi)容。

2.<meta keywords>標(biāo)簽:關(guān)鍵詞,列舉出幾個(gè)頁面的重要關(guān)鍵字即可,切記過分堆砌。

3.<meta description>標(biāo)簽:網(wǎng)頁描述,需要高度概括網(wǎng)頁內(nèi)容,切記不能太長(zhǎng),過分堆砌關(guān)鍵詞,每個(gè)頁面也要有所不同。

4.<body>中的標(biāo)簽:盡量讓代碼語義化,在適當(dāng)?shù)奈恢檬褂眠m當(dāng)?shù)臉?biāo)簽,用正確的標(biāo)簽做正確的事。讓閱讀源碼者和“蜘蛛”都一目了然。比如:h1-h6 是用于標(biāo)題類的,<nav>標(biāo)簽是用來設(shè)置頁面主導(dǎo)航的等。

5.<a>標(biāo)簽:頁內(nèi)鏈接,要加 “title” 屬性加以說明,讓訪客和 “蜘蛛” 知道。而外部鏈接,鏈接到其他網(wǎng)站的,則需要加上 el="nofollow" 屬性, 告訴 “蜘蛛” 不要爬,因?yàn)橐坏爸┲搿迸懒送獠挎溄又?,就不?huì)再回來了。

6.正文標(biāo)題要用<h1>標(biāo)簽:“蜘蛛” 認(rèn)為它重要,若不喜歡<h1>的默認(rèn)樣式可以通過CSS設(shè)置。盡量做到正文標(biāo)題用<h1>標(biāo)簽,副標(biāo)題用<h2>標(biāo)簽, 而其它地方不應(yīng)該隨便亂用 h 標(biāo)題標(biāo)簽。

7.<br>標(biāo)簽:只用于文本內(nèi)容的換行,比如:

首要行文字內(nèi)容<br/> 第二行文字內(nèi)容<br/> 第三行文字內(nèi)容</p>

8.表格應(yīng)該使用<caption>表格標(biāo)題標(biāo)簽

9.<img>應(yīng)使用 "alt" 屬性加以說明

10.<strong>、<em>標(biāo)簽 : 需要強(qiáng)調(diào)時(shí)使用。<strong>標(biāo)簽在搜索引擎中能夠得到高度的重視,它能突出關(guān)鍵詞,表現(xiàn)重要的內(nèi)容,<em>標(biāo)簽強(qiáng)調(diào)效果僅次于<strong>標(biāo)簽。

<b>、<i>標(biāo)簽: 只是用于顯示效果時(shí)使用,在SEO中不會(huì)起任何效果。

10、文本縮進(jìn)不要使用特殊符號(hào) 應(yīng)當(dāng)使用CSS進(jìn)行設(shè)置。版權(quán)符號(hào)不要使用特殊符號(hào) &#169; 可以直接使用輸入法,拼“banquan”,選擇序號(hào)5就能打出版權(quán)符號(hào)&#169;。

12、巧妙利用CSS布局,將重要內(nèi)容的HTML代碼放在前面,前面的內(nèi)容被認(rèn)為是重要的,優(yōu)先讓“蜘蛛”讀取,進(jìn)行內(nèi)容關(guān)鍵詞抓取。

13.重要內(nèi)容不要用JS輸出,因?yàn)椤爸┲搿辈徽J(rèn)識(shí)

14.盡量少使用iframe框架,因?yàn)椤爸┲搿币话悴粫?huì)讀取其中的內(nèi)容

15.謹(jǐn)慎使用 display:none :對(duì)于不想顯示的文字內(nèi)容,應(yīng)當(dāng)設(shè)置z-index或設(shè)置到瀏覽器顯示器之外。因?yàn)樗阉饕鏁?huì)過濾掉display:none其中的內(nèi)容。

16. 不斷精簡(jiǎn)代碼

17.js代碼如果是操作DOM操作,應(yīng)盡量放在body結(jié)束標(biāo)簽之前,html代碼之后。

文章標(biāo)題:前端SEO技巧,都是干貨
標(biāo)題來源:http://m.rwnh.cn/news3/264003.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供虛擬主機(jī)、網(wǎng)站設(shè)計(jì)、做網(wǎng)站、品牌網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站建設(shè)用戶體驗(yàn)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

微信小程序開發(fā)
黑河市| 定南县| 吉木萨尔县| 朝阳区| 宜兰县| 凯里市| 武鸣县| 凤山市| 密山市| 定日县| 林西县| 衡南县| 滁州市| 双柏县| 富川| 厦门市| 桐城市| 盘山县| 赣榆县| 双流县| 叙永县| 三门县| 新巴尔虎右旗| 临武县| 佳木斯市| 咸丰县| 莱芜市| 曲水县| 开封县| 乐清市| 青神县| 枣庄市| 赞皇县| 彰武县| 开阳县| 丁青县| 鄂伦春自治旗| 拜城县| 台山市| 禹城市| 漠河县|