meta tag 元標籤

網頁中的meta是什麼?html meta tag介紹|天矽科技客製化網頁設計

網頁中的meta是什麼?html meta tag介紹|天矽科技客製化網頁設計

 

Meta是html中的一個屬性,出現在<head>中,主要提供搜尋引擎能更好的理解網站內容及資訊,meta tag能讓爬蟲更快速訴的了解網站,並檢索及建立索引,可以說是在操作SEO上,相當重要的一個區域。

網頁中的meta是什麼

 

 網頁中的 meta 就是 meta data 元資料,meta tag 就是元標籤,我們可以在網站 html 語法中的<head>處,找到meta tag,如圖。

meta

 

 這裡所標記的 meta tag,除了 title 可以在瀏覽器分頁上看到之外(如下圖),其他都不會直接顯示在網站上,它的主要功能在於提供搜尋引擎能夠透過這些標籤,更好的去理解網站的內容與資訊,並將資料進行檢索及索引,最後推薦給使用者閱讀,可以說是在操作SEO時,相當重要的一個環節

meta
▲Meta title

常見的html meta介紹

 

 想要提升SEO自然搜尋排名,在 meta tag 的部分一定要設定好,尤其是 title、description keyword 的部分,這三個meta tag若設定得宜,則能輕易的讓搜尋引擎爬蟲和使用者了解網站的意圖,進而提升點擊的意願。

 在一開始我們提供的示意圖片中,我們可以發現 meta tag 除了 title、description 和 keyword 以外,還有其他的標籤,以下介紹。

 

Meta title

 Meta title網站標題設定方式主要截取網站內容的摘要,會被顯示在瀏覽器分頁以及搜尋結果標題上,若設定得宜,則可讓使用者快速了解該網站頁面的內容概述。

 Meta title設定建議 : 最多設定在75字元以內  (中文字25~30字)若設定過長,可能會被搜尋引擎截斷而無法完整呈現內容,且中文一個字是兩個字元;並留意,標題設定盡量不要有特殊符號,例如:&%#$☆,如需分隔字的話,可運用連結線 " - " 和下底線 " _ "。

Meta title

▲Meta title於搜尋頁面顯示的位置

 

Meta description

 Meta description 網站描述的精華重點,主要以簡短、特色、有吸引力的文字描述網站內容,Meta description會在搜尋頁面中,顯示在Meta title的下方,若設定得宜,同樣可以提升使用者對網站的了解速度和被搜尋引擎推薦的機會。

 建議Meta description 最多設定在160字元以內(中文字 80 個中文字)與Meta title相同,若設定過長,可能會被搜尋引擎截斷而無法完整呈現內容,因此,設定Meta description時,盡可能保留精華重點、刪除多餘贅詞,並置入與產品或服務有關的關鍵字,會讓搜尋引擎更快理解網站內容。

▲Meta description於搜尋頁面顯示的位置 (在Meta title下方)

 

Meta keyword

 Meta keyword指中文關鍵字,主要是以重點字描述網站內容的功能,當使用者搜尋某種字詞時,可以關聯到企業的網站與服務,若設定得宜,則可在使用者利用搜尋引擎搜尋時,出現我們的網站。

 雖然Google已表示Meta keyword不會納入SEO的排名,但相較於其它搜尋引擎,仍會參考此欄位,因此,建議設定Meta keyword時,最多以5組為限,若超過或是設定過多,會被認為是在灌水。

▲於搜尋引擎Key入關鍵字,出現與關鍵字相符的網站

 

Meta charset

 Meta charset為瀏覽器顯示網站所採用的字元編碼,是每個網站必要的標籤,現在絕大多數網站都是採用utf-8編碼,如果字元編碼使用不正確,可能造成使用者瀏覽網頁時,會出現亂碼情形,使網站變得不易閱讀。

  
▲若沒有加入字元編碼,網站字體會產生亂碼

 
▲加入字元編碼,瀏覽器會以utf-8載入字體

 

Meta viewport

 Meta viewport 是為了解決行動裝置瀏覽器所設計的一個meta tag,也就是說網站若有使用RWD響應式設計,可以讓網站在各種不同的裝置中正常的呈現,就會有這樣的一個Meta viewport設定。

 現今時代,行動裝置已成為絕大多數人瀏覽網站的工具,因此搜尋引擎對於友善行動裝置的網站會更加友善,因此若是網站還沒有使用RWD響應式設計,請務必進行改版,以提升SEO搜尋排名。

 

Meta og

 <meta property=”og:title” content=”天矽科技”>
 這個 meta og(Open Graph)是使用者將網站分享到社群網站時所顯示的標題、描述和縮圖,如下圖。

meta og

▲分享時所顯示的縮圖、標題和描述,都是從meta og進行設定的

 

Meta robots

 Meta robots也可稱Meta標籤,可讓搜尋引擎爬蟲進行檢索及索引,若網站有設定Meta robots,就會接受所有搜尋引擎索引。不過Google曾表明robots僅供參考,不是一定放了就會將網站檢索並索引,但有放仍是有機會的。
 

Meta copyright

 Meta copyright 是版權歸屬,為了聲明網頁文檔的版權,歸屬於某個人或某個組織時,就可以使用這個meta tag,像這樣:<meta name=”copyright” content=”天矽科技”> 表示該網站頁面屬於天矽科技所有。

 當然html 的meta tag 還有很多,像是distribution 網頁發布地區、language 網頁發布語言,或是author 網頁的作者名稱…等,若有需要都可以加入網站語法中,不過與SEO有關的meta tag,最重要的就是 title、description 和 keyword 這三個,詳細介紹可瀏覽下方延伸閱讀之文章。

 天矽科技所建置的網站,皆依照W3C制定的標準結構化語法建置,可有效提升SEO搜尋排名,有興趣可與我們聯繫。

延伸閱讀
網站SEO優化重點:網頁標題、描述與關鍵字設定

 

share FB LINE
看天矽作品集 回上一頁
ID:@323foylw