網頁程式碼－HTML、CSS、JaveScript 是什麼？
網頁程式碼中有許多與 SEO 息息相關的基礎設置，若能學會這些設定方式，對 SEO 行銷的實務操作很有幫助，而學習程式碼的第一步，從瞭解網頁程式碼 3 大要素的基本概念開始。
HTML
HTML（HyperText Markup Language）為建構網頁的語言，是組成網頁的基本元素，向爬蟲程式說明網頁性質，並建立網頁的內容，如文字、表格、圖片、視頻等區塊。HTML 語言能直接影響網站 SEO，設置適當便能發揮加分效果。
|
<head>—說明網頁性質 <body>—網頁內容 <p>—文字區塊 </p> <body>—表格區塊 </body> <img>—圖片區塊 </ing> <video>—影片區塊 </video> </body> </head> |
CSS
CSS（Cascading Style Sheets）是設定網頁區塊的樣式語言，可為 HTML 所定義出的內容區塊進行進行外觀調整，如設定文字大小間距、表格邊框的粗細顏色、圖片及影片的長寬比例等顯示細節。CSS 能帶給使用者更佳的使用體驗，但對於提升 SEO 沒有直接的影響。
|
<head> <body> <p style=”text size:15 ”>—定義文字格式 </p> </body> </head> |
JavaScript
JavaScript 是網頁製作的高階程式碼，能在網站上創建動態內容、控制圖片、影片、聲音的變化，甚至做出下拉式選單、動態式導覽等特效。因 JavaScript 的語言特性不易讓爬蟲程式檢索，在設置時更須謹慎使用。
| <script type=”text/javascript”> |
製作網頁猶如製作提線木偶，首先需挑選木塊組成身體的部位，就像 HTML 語法建立區塊，再針對各部位進行雕琢、上色，如 CCS 對各區塊設定外觀樣式，最後以線繩串接木偶軀體，使木偶可被線繩操控做出動作，正是 JavaScript 對網頁的作用。
如何在 Google 檢索網頁 HTML 時提升 SEO 排名？
設定 HTML 語言猶如書的導讀可以讓讀者更快理解書籍內容，透過技巧性地調整網頁中的 HTML 語言，爬蟲軟體在進行檢索時能更快速掌握網頁內容架構，增加 Google 對網站的分數與權重，進而提升網站 SEO 排名，主要的做法有以下 5 種：
- 設定網頁的 Title Tag
Title Tag 網頁標題是顯示在搜尋結果裡的網頁名稱，對於爬蟲程式及使用者而言，認識網頁的第一步都是從標題開始，因此被視為 SEO 的重要因素，文字盡量在 25～30 個中文字之間。 - 適當安插關鍵字在 Meta Description
顯示在搜尋結果的網頁摘要，向使用者描述該網頁的內容主旨，字數上限沒有確切數字，一般建議字數在 65～80 個中文字之間。 - 於文章中適時設置 Header Tag
為網頁的文字內容標上<h1>～<h6>標籤，<h1>為最高級的標題，對網頁 SEO 有重要影響性，接著依順序設置至<h2>及<h3>，加強網頁關鍵字的強度。 - 設置圖片替代文字（alt）
設置圖片替代文字的用意是向搜尋引擎解釋圖片內容，在 HTML 中以<img alt=”圖片替代文字”>設置。需盡量讓文字描述與圖片內容一致，否則容易被 Google 認定圖文不符，而被降低網站品質的評分。 - 設置粗體字<strong>
為網站中的重點關鍵字設置粗體<strong>，使爬蟲程式更快找到網站重點。
爬蟲程式最注重的項目是 Title Tag、Header Tag 及 Meta Description，設置得宜會讓網站 SEO 大大加分，不過也別忘了，提供高價值的原創內容，讓使用者獲得優良體驗才是提升 SEO 的根本之道。
（設置HTML語言，提升網站SEO的詳細方式，請參考：【SEO HTML概念篇】SEO操作必學！從0到1的HTML基礎知識教學）
Javescript 對網站 SEO 的影響？
過去，爬蟲程式檢索網站時，會忽略 JaveScript 的<script>標籤，因此 SEO 業界普遍不鼓勵在網站中設置太多的 JacaScript，尤其在以下 2 種使用情形：
-
避免在 JavaScript 中放置超連結
超連結在 HTML 語言是使用<a herf=”超連結網址”>，在 JavaScript 中則是以<a onclick “window.location.href = ‘/another_url’”>設置超連結網址，透過 JavaScript 設定的錨點文字與一般文字呈現相同的外觀樣式，讓讀者難以辨別，且爬蟲程式也無法進行檢索，對讀者及 SEO 都有負面效果。
-
避免大量使用 JavaScript
若網頁中設置太多 JavaScript 製作的特效，會為網站帶來龐大負荷，降低網頁載入時間，便於使用者來說就是不佳的網站體驗，反而讓網站評分下降，影響 SEO 排名。
Googlebot 日前已更新，對 JavaScript 程式碼已能進行檢索，經國外 SEO 專家 Adam Audette 實際測試包含 301 Redirects、下拉式選單、動態式導覽、rel=nofollow 等項目，測試結果為多數項目已可被爬蟲程式讀取，但仍有部分功能未能正常發揮，因此仍建議目前先以過去的設置習慣為主。
為網站打造完善 SEO 體質｜Ranking，你的 SEO 救星
SEO 專家 Ranking 推出 SEO 網站健檢工具，能檢測目標網站的安全性、使用體驗、檢索與索引、內容分析、社群預覽等 5 大面向，你可以根據分析結果，為網站設置正確的網頁程式碼，打造完善的 SEO 網站體質！
SEO 排名服務
Ranking 專為中小企業提供 SEO 專案服務，幫助企業客戶完整規劃、執行 SEO 排名的優化策略，改善網站體質，加上達標保證，讓客戶網站半年內前進搜尋結果首頁！
掌握 Google 搜尋引擎的 2 大核心功能－檢索與索引，請參考：認識 Crawl 與 Index－掌握 Google 演算法的秘密，增進網站 SEO 排名！
