跳到主要內容

[SEO專欄] 想做好網站優化?先學會Semantic HTML吧。

這幾日過往的「戰友」Friday所發表的Facebook新Graph API推出 – 你打算跟魔鬼做交易了嗎?著實引起不小的迴響,果然扯到資安問題,文章就會引起相當大的反應啊!由此可見在網路的世界裡,FUD(Fear, uncertainty, and doubt,恐懼、不確定、懷疑)策略對於一般的網路使用者還是很有效的。

不過今天要聊的不是資安問題,而是從其中的一個名詞:Semantic Web中的"Semantic"開始講起。

Semantic一詞在中文直譯為「語意」,不過這裡的「語意」非語言中的「語意」,而是讓你所撰寫的電子資訊,可以讓人類能夠清楚理解,同時也適合被機器或程式處理之。其實這一點就跟網站優化的目的相同:
  • 可以讓人類能夠清楚理解SMO
  • 適合被機器或程式處理SEO
然而在SEO的領域裡,撰寫Semantic HTML的觀念是基本中的基本。不論是怎樣的網站,目前最終的共通語言還是HTML,但是近年來Dreamweaver的發展及CMS程式(Content management system,泛指Wordpres、Joolma等套裝架站程式)的興起,「做出」一個網站似乎是越來越簡單的一件事情。但看在我這個當年是一筆一劃,用記事本刻出一個網站的人來說,著實覺得現在的網站對於HTML的結構及語法真的是越來越不重視。

在搜索引擎的眼中,你的網站是長得如右圖一樣,沒有漂亮的底圖、沒有花花綠綠的文字編排,只有一連串的程式語法。在小說「亦恕與珂雪」中有一段這樣對厲害畫家的敘述:『厲害的畫家,畫風時,會讓人感覺一股被風吹過的涼意;畫雨時,會讓人覺得好像淋了雨,全身溼答答的;而畫閃電時,會讓人瞬間全身發麻,好像被電到一樣。

我有時候會笑說,身為一個網站優化的工作者,對於一般的使用者,就像是幫網站做美容一般,讓她到社會上的時候,每個人都想要看她;而對於搜索引擎來說,就是幫她充實她的內涵,並且讓搜索引擎很快的就能知道她不是只有外在而已,內在也是非常清楚的就能夠馬上觀察的到。外在的美容就是要靠SMO的設計,而內涵的基礎就是Semantic HTML,也就是「語意明確的HTML」如果你的網站是要描繪一場雨景,但卻沒辦法讓搜索引擎一看就感覺全身濕答答,那你的搜索引擎排名就會往後掉了。因為對於搜索引擎而言,你不是一個厲害的畫家

Semantic HTML很難編輯嘛?其實不然,最簡單的準則其實就在我們的身邊:現在請拿起你手邊的任何一本書,你會發現裡面的排版都是井然有序的,從大標題、中標題、小標題依序引導著你的閱讀;然後有些書籍(尤其是參考書)在重要的地方,還會幫你加粗加底線或是以斜體 的方式呈現;而且絕大多數的圖都會有圖片說明,如果有需要名詞解釋的地方,還會導引你要翻到哪一頁,去看哪個標題的解釋,這樣的一本書閱讀起來,一定相對的輕鬆,而不會無所適從。

講到這,先想想看,你的網站結構必須要具備哪些條件了?想好了,再繼續看下去吧。

Semantic HTML必備元素


因為搜索引擎不是人,她並不懂你網站中文字的意思是什麼,她會的只是整理跟歸納而已。所以你的HTML結構中,就必須先幫搜索引擎劃重。至於該怎麼劃呢?HTML中有許多標籤性的功能的語法,你真的都要會,以下小黑整理幾個比較重要的語法:
  1. Headings:也就是 h1~  h6,標籤數字越小層級越高,這就有如書本中或是報紙的大中小標題一般。被標示為 h1(大標題)通常是很醒目的目標,一定是具代表性的意義的文字,於是搜索引擎就會特別注意 h1標籤內的字。

    所以在操作SEO的時候,網站或是每篇文章的重要關鍵字,一定是要被包在h1標籤中的。

  2. b v.s strongi v.s em:b 跟strong的最後呈現的效果都是將字體加粗;而i跟em則是產生斜體 的效果。但是其中有什麼差別呢?就W3C的準則而言:

    I: Renders as italic text style.
    B: Renders as bold text style. [w3c.org]
    EM:Indicates emphasis.
    STRONG:Indicates stronger emphasis. [w3c.org]

    所以我們很清楚的看出,em跟strong除了在字體上有所改變之外,還附加了"emphasis(強調)"的意義。所以在內文重要關鍵字上,用em跟strong把它劃上重點吧。

  3. Alt:這是附屬在img標籤裡面的屬性,因為搜索引擎看到的都是程式碼,alt的功用就是幫圖附上註解,讓搜索引擎知道,這張圖是在說什麼。
以上是基礎中的基礎,要做好SEO事實上並沒有那麼困難,出發點就是讓人及搜尋引擎能夠輕鬆的看懂你的網站,就是好的網站優化。目前我比較滿意符合Semantic HTML結構又是免費的BSP還是痞客邦,部落格名稱用h1標記、文章標題用h2;不用b跟i標籤而是strong跟em;圖片加上註解方式簡單,在在都符合Semantic HTML要求。如果你不是自己刻HTML的話,Pixnet會是你的好朋友。

留言

這個網誌中的熱門文章

2022年了, Google 都建議你不要做 sitemap 了:重新認識 SEO 中的 Sitemap

首先,如果我跟你說你的網站 其實可能「不」需要 Sitemap ,我想這句話會顛覆多數人的認知,但實際上這句話卻是 Google 官方文件白紙黑字寫出來的[1],以下是可能「不」需要 Sitemap 的情況: 網站規模很「小」:所謂的規模很「小」,指的是網站的 網頁數不超過 500 個  (以您認為有需要納入搜尋結果的網頁為準)。 網站內部的連結完善:這表示 Google 可以透過首頁的連結找出網站上所有的重要網頁。 要顯示在搜尋結果中的媒體檔案 (影片、圖片) 或新聞網頁數量不多:Sitemap 可協助 Google 在您的網站上找出影片和圖片檔或新聞報導,並加以解讀。如果您不需要讓這些內容出現在圖片、影片或新聞搜尋結果中,可能就不需要 Sitemap。 其實絕大多數各位手邊的網站,真的有需要納入搜尋結果的網頁,各位請自行捫心自問一下:真的有超過 500 頁嗎?如果是電商,你的商品數真的有那麼多嗎?當然這是極端的說法,因為我相信大家都會覺得說:那有一天我超過 500 個怎麼辦,或是我是新網站怎麼辦?

SEO建議做在QDM內建還是WordPress上比較好?電商內容行銷實務分享

那天有一位社團成員匿名發問:SEO建議做在QDM內建還是WordPress上比較好?他的問題是: 我們家使用QDM系統,有意願做SEO,之前因為QDM內建的部落格版面老闆覺得醜,所以另外用Wordpress自建了一個部落格目前兩邊都是有文章的,想問大家這個情況,SEO建議做在QDM內建的還是Wordpress上比較好呢? 其實他的問題是:如果我想透過內容行銷或產生文章來做好 SEO ,那我應該用電商平台內建的部落格功能,還是另外架設一個外部網站(如用 WordPress)來放內容呢?這個問題嚴格來說是老生常談,但在回答這個問題之前,我們先複習一下先前 台灣電商開店平台 SEO 能力大解析 中,電商平台 有沒有部落格功能這一評分標準 ,其實就會跟我們今天的解答有關係。

用 ChatGPT 來做 SEO 的基礎內容建設是否能被搜尋引擎接受?實驗不到一個月我有了答案

身為一個 SEOer ,看到任何有趣的新東西,自然就是在思考:這個東西對 SEO 是不是有幫助?就像當年寫部落格是為了外鏈自建跟內容生成, Facebook 剛開始的年代,上面的外鏈全部是 DoFollow(具有價值的連結),所以我玩起了 FB 。但這麼多年來, ChatGPT 真的是我花最大量心思去投入的工具,因為他對我的 SEO 策略真的太有幫助了,但這些想法都是假設,於是我自己展開了實驗。我利用 ChatGPT 以及其他延伸的工具來產出「相對可能沒那麼 100% 專業,但應該有 80 分水準以上,適合普羅大眾觀看」的內容,大概步驟如下: