什麼是網頁設計?背景
認識網頁設計Q & A

認識網頁設計 - SEO搜尋引擎最佳化

第四章:SEO搜尋引擎最佳化的基礎開發與設計 (上)

因為目前搜尋引擎無法完全解讀網頁內容,所以網頁設計時需要以搜尋蜘蛛容易索引方式製作。對搜尋引擎來說,它們看到的網頁跟我們並不相同。在這章節中,我們將把重點集中在網站的技術層面上,這樣的網站架構,在搜尋引擎與用戶的眼中才會相似。可以把這個章節分享給程式設計師,前端工程師,和網頁設計師,讓所有參與網站製作的人都有相同知識。

要製作能被索引的內容

為了在搜索引擎列表有更好的表現,重要的內容請使用HTML格式。就算搜尋引擎蜘蛛抓取的技術越來越進步,Flash,Java,以及其它非文字的內容通常還是會被蜘蛛忽視或認為不重要。若想讓內容如實呈現給訪客,最簡單的方式就是使用HTML文字給搜尋引擎抓取。但是,更棒的方式是呈現給搜尋引擎的同時又保有視覺設計的網站。

以下為幾種方式:

  • 1.圖片用Alt屬性。指派gif,jpeg或png格式的圖片"alt attributes" in HTM為了便於搜尋引擎解讀,在這些圖片加上一些文字敘述。
  • 2.做網站內導航性質的搜索框與內部連結。
  • 3.為Flash與Jave Plug-ins增加文字敘述版本。
  • 4.提供視頻與音頻的文字複本,以便於這些說明文字被搜尋引擎索引。

「我的網頁無法被收錄。我為了Juggling Pandas做了一個Flash,但卻無法在Google找到它。發生什麼事了?」

用搜尋引擎的方式檢視您的網站

很多網站在「內容索引」有著很大的問題,所以網頁設計製作完成之後重複檢查是必需的。通過檢視工具,例如:Google's cache(頁庫存檔), SEO-browser.com, and the MozBar,您可以檢閱您的網頁內容哪些可以被搜尋引擎讀取與索引。看看您目前開啟的網頁在Google是如何顯示的吧?看看相同的網頁在搜尋引擎與在您眼中有何不同。

以下Moz用Juggling Pandas做例子:​

 

哇!這就是我們的樣子嗎?

使用Google catch的功能,我們可以發現Google所看到的 JugglingPandas.com首頁並沒有我們來的豐富,而這是因為網站的一些構造無法被搜尋引擎解讀。

以下Moz用Axe Battling Monkey Blog做例子:

 

嘿!有趣的小遊戲跑那兒去了?

嗚嗯......透過Google catch,我們可以發現右上方顯示的網站真是空白的可怕。沒有文字說明,也看不到小遊戲。網頁設計時,這個網站全部是用Flash建造,但很可惜的,這也意味著搜尋引擎無法索引到任何文字,更別說Flash小遊戲。沒有使用HTML,這個網站在搜尋引擎上的排名可是會非常難看。

最明智的做法是除了檢查文字內容,同時也使用SEO工具仔細檢查網站在搜尋引擎的顯示內容。不只是圖片,下面即將敘述的「連結」也適用這樣的做法。

要有能被抓取的連結構造

正如搜尋引擎需要抓取關鍵字來分類網站內容,網頁也需要有正確的連結讓搜尋引擎可以第一時間的抓到它們,所以擁有一個能夠被搜尋引擎蜘蛛爬行抓取的正確連結構造非常重要。但也有許多網站會犯這致命性的錯誤,把連結建立在蜘蛛無法進入的地方,而這也使得網頁無法被索引,隱藏在網絡世界中。

以下,我們用圖片來示意發生這問題的原因:

 

 

在上面的圖片,Google蜘蛛已經爬到了頁面A且看到了通往頁面B與E的連結。但是因為不正確的連結構造,就算頁面C與D很可能是這個網站裡最重要的頁面,蜘蛛還是無法爬向頁面C或D(或著是說,蜘蛛有可能根本不知道有頁面C和D的存在)。若Google蜘蛛找不到,這也代表著頁面C與D並不存在,就算有再好的內文,關鍵字選的再精準,網頁設計在美觀,和再聰明的行銷手法,只要蜘蛛無法爬行到,一切都是白搭。

來解剖連結架構吧!

 

​​

 

網頁上所有可供點擊,讓訪客從一個網頁移動到另一個網頁,呈現的形式包含圖片,文字,或是其他物件,就是所謂的連結。而連結是網際網絡中最基本的元素,網頁設計上最常聽到的詞就是「超連結」。在上圖中, “<a” 代表著連結的開始,而這連結會告訴瀏覽器(以及搜尋引擎)這個連結要去哪。在這個例子,這個連結要去http://www.jonwye.com。在這之後,訪客可以看到的文字在SEO搜尋引擎最佳化的世界中稱做錨點文字,用來介紹連結的目的地。以這個網站為例,網站的目的地是Jon Wye的客製化皮帶,所以在錨點文字顯示「Jon Wye's Custom Designed Belts」,最後的“</a>”則是連結的結尾,用來防止頁面上的其他語法與之相連結而產生錯誤。

以上是一個連結的最基本形式,且這是搜尋引擎完全可以理解的方式。搜尋蜘蛛會知道它們須把連結放入資料庫,且用它來計算網頁的搜尋獨立(Query-Independent)的變量(類似Google的PageRank),並根據結果分類索引。

搜尋獨立(Query-Independent)搜尋蜘蛛在索引後進而分類一個新網頁前,會先以網站內的關鍵字與網頁連結預估網站的重要性與價值,與用戶的搜尋習慣是不一樣的。

來看一下網頁無法被讀取的常見原因吧!

● 網頁使用線上提交表格

 

若您的網站最初設計時是需要訪客完成線上表格登入後才能夠進入,那搜尋引擎可能就無法看到那些被保護的內容。表格的形式有可能是密碼保護的登入頁或是問卷調查。不管是那種形式,搜尋蜘蛛一般不會嘗試去提交表格,所以任何經由表格登入才能夠進入的頁面,蜘蛛都不會去抓取。

 

● 使用無法剖析的JaveScrip連結

 

若是您使用JaveScrip形式的連結,您會發現搜尋引擎要嘛不抓取,要嘛就是給崁入的連結很低很少的權重。若您想讓蜘蛛抓取,請用標準的HTML連結替代(或著用HTML搭配)。

 

● 連結指向被Meta Robots tag或是robots. txt封鎖的頁面

 

Meta Robots tag或是robots. txt兩個都是網站管理員設定禁止搜尋蜘蛛進入特定網頁的程式。但是要小心,雖然許多的網站管理員企圖為了防止垃圾蜘蛛進入而使用這兩個指令,但若使用不當可能整個網站都無法讓蜘蛛進入。

 

● 網頁使用Frames或iframes

 

網頁設計技術上來說,Frames與iframes形式的連結是能被搜尋引擎抓取的,但兩者對於搜尋引擎來說都存在著對其組織與追蹤的結構性問題。除非您知道搜尋引擎如何索引與追蹤Frames所連結的網站內容的專業人士,不然還是別用的好。

 

● 蜘蛛不使用搜尋框

 

雖然這跟上述警告的線上表單相關,但這太普遍了必須另外提出來。有一些網站管理員以為在網站內放一個搜索框,搜尋蜘蛛就會找到訪客搜尋的內容。但很可惜的,蜘蛛不會使用搜索框找訪客搜索的關鍵字,只要沒做好網站連結,這樣的頁面就永遠都被隱藏,不被抓取。

 

● 使用Flash,Java,以及其它的plug-in

 

上面的例子中,在Juggling Panda網站內崁的連結就是最好的例子。雖然每隻熊貓都是通往另個網頁的連結,但因為蜘蛛無法利用這類型的連結格式通往其它頁面,使的這些頁面對搜尋引擎來說是隱形的。

 

● 網頁擁有過多連結

 

搜尋引擎在網頁上只會抓取固定數量的連結。這個限制是為了防止垃圾連結與保護排名的正確性。若網頁上有過多的連結,就有「不是所有連結都會被抓取與索引」的風險。

 

只要你避免掉入這些陷阱,您就有個乾淨,能被索引的HTML連結讓蜘蛛能夠簡單進入的網站。

Rel=”nofollow”

Rel="nofollow"可以用下面的語法:

<a href="http://moz.com" rel="nofollow"> Lousy Punks! </a>

 

連結可以有很多屬性,搜尋引擎幾乎全都忽視了,除了rel="nofollow"屬性。在上面的例子,加上rel="nofollow"在連結內,代表著告訴搜尋引擎這個網站擁有不值得信任的內容,讓搜尋引擎不要繼續往下檢索,避免網頁權重被扣分。

 

Nofollow,按字面上來看,是下達指令讓搜尋引擎不要跟蹤這個連結(雖然有些還是會去跟蹤)。Nofollow屬性一開始是為了幫助停止部落格,留言版的垃圾自動回覆和連結,但演變到了現在,變成了告訴搜尋引擎降低這個連結原本的價值。每個搜尋引擎對Nofollow的連結判別都有些微不同,但很顯然的Nofollow的連結不會比一般的連結擁有更多權重。

難道nofollow的連結不好嗎?

雖然Nofollow的連結與Follow連結相比較下並沒有什麼價值,但它仍是一種可以配置多樣連結的普遍方式。一個擁有很多對內連結的網站通常也有很多的Nofollow連結,而這也並不是一件壞事。實際上,Moz的排名因素分析顯示,與排名較低的網站相比,擁有較多Nofollow對內連結的網站通常往往擁有較高的排名。

Google

Google聲明在大多數的情況下,他們不會跟蹤Nofollow的連結,這些連結也不會被傳遞PageRank或錨點文字的價值。實際上,使用Nofollow連結促使Google把目標連結放在整體網頁範圍外。Nofollow的連結沒有任何權重,只被當作是HTML文字(也就是說連結不存在)。儘管如此,許多網站管理人認為就算是從具有權威性的網站來的Nofollow連結,例如維基百科,仍然也是可提高自身網站信任度的。

Google對nofollow的定義

Bing & Yahoo!

Bing, 提供Yahoo搜尋引擎技術,也曾聲明它們的搜尋引擎蜘蛛會抓取網站內的Nofollow連結,但並不會包含其價值,也相對的對網站排名沒有任何效果。

Bing對nofollow的定義

 

關鍵字的使用和目標鎖定

關鍵字對搜尋的過程十分重要,它是建構搜尋過程的基石與語言。實際上,關鍵字是整個資訊檢索科學(包括網路搜尋引擎,例如:Google)的根基。當搜尋引擎抓取網頁時,搜尋引擎會依據網頁內的文字內容(關鍵字)做分類,而不是把內容全放在同一個含有25億網頁的資料庫。所以搜尋引擎有數億萬個小資料庫,而每個小資料庫都是特定的關鍵字或詞, 可以讓搜尋引擎在最快的速度進行檢索。

 

顯然的,假如您想讓您的網頁能在「狗」這個關鍵字的搜尋結果排名出現,最好確保「狗」這個關鍵字在您的網頁是容易被搜尋引擎抓取的關鍵字。

 

關鍵字的控制權(支配,主宰,控制,優勢)

關鍵字支配著我們怎麼傳達自己的搜尋需求,以及如何與搜尋引擎互動。當我們輸入查詢的文字(詞),搜尋引擎會依據我們輸入的文字進行相關的網頁媒合,而文字的排列順序("pandas juggling" vs. "juggling pandas"),拼音,標點符號,以及大小寫也會提供額外的訊息讓搜尋引擎檢視並排列最符合的結果。

 

搜尋引擎會衡量關鍵字在網頁上呈現的方式來幫助判定這個網頁的內容是否符合用戶的查詢。優化網頁排名的最好方式之一是確保網頁標題內有關鍵字,內文的關鍵字以文字的方式呈現,以及在metadata內包含關鍵字。​

 

 

一般來說,只要您的關鍵字越明確具體,您越可縮小搜尋引擎的排名競爭,更可以提升更高排名的機會。上面的地圖是廣泛的字「書」,以及精準的詞「雙城記」的比較示意圖。您會發現,被查詢的文字越廣泛,得到的結果很多;文字越精準,得到的結果相對的就越精,但同時,也越少網站與您競爭。

關鍵字的濫用

從開始有了網絡搜尋,為了操縱搜索引擎的排名,有些人不斷用錯誤的方式濫用關鍵字,而這包含把關鍵字「堆積」在內文,網址,Meta 標籤,和連結。不幸的是,這些方式都不會讓您的網站更好,只會更糟。

 

在早期,搜尋引擎評斷網站與關鍵字的相關性時,看的是網頁內關鍵字的出現頻率,而不是關鍵字的使用的合理性。直到今天,雖然搜尋引擎仍然無法像人類一樣的理解文字內容,但是智能學習已經讓他們逐漸完美化。

 

最好的方式是自然並有組織(計畫)的使用關鍵字。若您的網頁關鍵字是「艾菲爾鐵塔」,想當然的,內文就是關於艾菲爾鐵塔,包含艾菲爾鐵塔的歷史,推薦的巴黎酒店。換句話說,假如您只是把「艾菲爾鐵塔」放在文不對題的內文中,例如狗狗的養育,那您再怎麼把努力想靠著「艾菲爾鐵塔」拉高網頁排名也是很有限的。我們的目的不是把文章內的所有關鍵字都提高排名,而是必須集中在某些用戶會使用的關鍵字。

關鍵字密度的迷失

根據Edel Garcia博士在The Keyword Density of Non-Sense所述,關鍵字密度並不是現代排名演算法的一部分。

 

若有兩個網頁,D1與D2,D1包含1000文字(l=1000),其中關鍵字20次(tf=20),關鍵字密度軟體分析出文件的關鍵字密度(KD)為20/1000 = 0.020 (or 2%)。同樣的,D2包含500文字(l=500),其中關鍵字10次(tf=10),也會出現同樣的密度結果。所以很顯然的,關鍵字密度分析沒辦法解釋哪個網頁更具關聯性,也無法跟我們說這些:

  • 1. 關鍵字之間的相對距離。(接近度)
  • 2. 語詞的分布位置(分布度)
  • 3. 語詞之間的共被引(這是專有名詞: 意思是同時被引用)頻率(同時被提及)
  • 4. 關鍵字與題材,主題,和副主題(主題內文一致)
 

總結來說,關鍵字密度與內容,質量,語意和關聯性都沒有關係。

網頁優化

關鍵字的使用方式與目標鎖定仍然是搜尋引擎排名演算的一部分。我們可以利用一些有效的關鍵字使用技術來幫助網頁優化。在Moz,我們做了很多測試並獲得許多關於搜尋結果與關鍵字使用策略的手段。在網站優化中,我們建議您這樣使用關鍵字:

 

請不要在同個網站使用關鍵字做網頁內部連結,也就是所謂的關鍵字競食。

 

注:「關鍵字競食」網站上的多個網頁上有著定位一樣的關鍵字,會導致搜索引擎難以判斷哪個網頁才是最相關的搜索查詢重點,因而 SERP(搜尋引擎結果頁面) 不一定會以戶想看到的網頁與內容搜尋首位。

 

一個網頁的關鍵字優化是怎樣的呢?這裡以「運動鞋」做例子:

 
  • 至少在title 標籤使用一次關鍵字。盡量讓關鍵字越在title 標籤的前面越好。關於title標籤在本章節的後面會討論。
  • 關鍵字放在最明顯的網頁最上方。
  • 在網頁內文至少放上二或三次的關鍵字,包含文字變化型。若文章內容很長,可再放多一些。頻繁的使用關鍵字您也許認為會有額外的收穫,但其實根據我們的經驗,對網頁排名基本沒有益處。
  • 在網頁的圖片上的alt屬性至少使用一次關鍵字。這不僅僅是幫助網頁搜尋,也幫助圖片搜尋,偶爾也會帶來流量。
  • 在URL使用一次關鍵字。關於URL與關鍵字的使用規則在本章節的後面會討論。
  • 在meta description標籤至少使用一次關鍵字。請注意meta description標籤並不會幫助搜尋引擎的排名,但因為搜尋引擎會抓取其內容並揭露在搜尋結果頁面,所以它可以吸引點擊率。​
 

 

更多關於網頁優化的內容請參考這篇文章

 

來源:MOZ


歡迎推廣本文,請務必連結(LINK)本文出處