Skip to content
Anonymous

SEO Review:網站搜尋引擎優化完整指南

深入解析 SEO 審計的各個檢查項目,從 Meta Tags 到 Core Web Vitals,了解如何讓你的網站在搜尋引擎中獲得更好的排名。

#seo #web-development #performance #best-practices

SEO(Search Engine Optimization,搜尋引擎優化)是讓網站在 Google、Bing 等搜尋引擎中獲得更好排名的技術。一個完整的 SEO 審計涵蓋技術面、內容面和使用者體驗等多個層面。

本文將詳細解析 SEO 審計中的各個檢查項目。


什麼是 SEO Review?

SEO Review 是一套系統化的網站審計流程,用於識別可能影響搜尋引擎排名的問題。透過定期審計,可以:

  • 發現技術性問題(如載入速度慢、行動裝置不友善)
  • 優化內容結構(如標題層級、關鍵字配置)
  • 提升使用者體驗(如導覽清晰度、頁面可讀性)

一、技術 SEO(Technical SEO)

技術 SEO 是搜尋引擎能否正確抓取和索引網站的基礎。

1. Meta Tags(中繼標籤)

Meta Tags 是 HTML 中提供給搜尋引擎的資訊,雖然使用者看不到,但對排名至關重要。

Title Tag(標題標籤)

<title>頁面標題 | 網站名稱</title>
項目建議
長度50-60 個字元
內容包含主要關鍵字,最重要的放前面
唯一性每個頁面都應該有獨特的標題

Meta Description(描述標籤)

<meta name="description" content="這是一段關於頁面內容的描述...">
項目建議
長度150-160 個字元
內容吸引點擊的描述,包含關鍵字
唯一性每個頁面都應該有獨特的描述

Canonical URL(標準網址)

當同一內容可透過多個 URL 存取時,canonical 標籤告訴搜尋引擎哪個是「正版」。

<link rel="canonical" href="https://example.com/page">

使用情境

  • 同一頁面的 HTTP 和 HTTPS 版本
  • 有無 www 的版本
  • 有追蹤參數的 URL(如 ?utm_source=...

2. Open Graph 與 Twitter Cards

這些標籤控制網站在社群媒體分享時的呈現方式。

<!-- Open Graph(Facebook、LinkedIn 等) -->
<meta property="og:title" content="頁面標題">
<meta property="og:description" content="頁面描述">
<meta property="og:image" content="https://example.com/og-image.png">
<meta property="og:url" content="https://example.com/page">
<meta property="og:type" content="website">

<!-- Twitter Cards -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="頁面標題">
<meta name="twitter:description" content="頁面描述">
項目建議
og:image建議尺寸 1200×630 像素
twitter:card使用 summary_large_image 獲得更大預覽

3. HTML 結構

標題層級(Heading Hierarchy)

<h1>主標題(每頁只能有一個)</h1>
  <h2>次級標題</h2>
    <h3>三級標題</h3>
  <h2>另一個次級標題</h2>
規則說明
單一 H1每頁只能有一個 <h1>,且應反映頁面主題
層級順序不要跳過層級(如 H1 直接到 H3)
語意化標題應描述內容結構,不只是為了樣式

語意化 HTML

使用正確的 HTML5 元素幫助搜尋引擎理解頁面結構。

<header>網站頭部</header>
<nav>導覽列</nav>
<main>
  <article>
    <section>內容區塊</section>
  </article>
  <aside>側邊欄</aside>
</main>
<footer>網站底部</footer>

Language 屬性

<html lang="zh-TW">  <!-- 繁體中文 -->
<html lang="en">     <!-- 英文 -->

這幫助搜尋引擎了解頁面的語言,進而在相應語言的搜尋結果中顯示。


二、索引與可抓取性(Indexing & Crawlability)

1. Robots.txt

robots.txt 是放在網站根目錄的文字檔,告訴搜尋引擎爬蟲哪些頁面可以抓取、哪些不行。

User-agent: *
Allow: /
Disallow: /admin/
Disallow: /api/
Disallow: /private/

Sitemap: https://example.com/sitemap.xml
指令說明
User-agent: *適用於所有爬蟲
Allow: /允許抓取所有頁面
Disallow: /admin/禁止抓取 /admin/ 目錄
Sitemap:指定 Sitemap 位置

2. XML Sitemap

Sitemap 是一個 XML 檔案,列出網站中所有你希望被搜尋引擎索引的頁面。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://example.com/</loc>
    <lastmod>2026-01-18</lastmod>
    <changefreq>weekly</changefreq>
    <priority>1.0</priority>
  </url>
  <url>
    <loc>https://example.com/about</loc>
    <lastmod>2026-01-15</lastmod>
    <priority>0.8</priority>
  </url>
</urlset>

最佳實踐

  • 放置於 /sitemap.xml
  • robots.txt 中聲明位置
  • 提交至 Google Search Console
  • 內容更新時自動重新產生

3. 頁面級索引控制

<!-- 允許索引(預設) -->
<meta name="robots" content="index, follow">

<!-- 禁止索引 -->
<meta name="robots" content="noindex, nofollow">

<!-- 索引但不追蹤連結 -->
<meta name="robots" content="index, nofollow">
使用情境設定
一般頁面index, follow
後台管理noindex, nofollow
登入頁面noindex, follow
測試/預覽頁面noindex, nofollow

三、網頁效能(Performance)

1. Core Web Vitals

Core Web Vitals 是 Google 用來衡量使用者體驗的三個核心指標。

指標全名測量內容良好標準
LCPLargest Contentful Paint最大內容繪製時間< 2.5 秒
FIDFirst Input Delay首次輸入延遲< 100 毫秒
CLSCumulative Layout Shift累積版面位移< 0.1

LCP 優化方法

  • 優化圖片(使用 WebP、適當尺寸)
  • 使用 CDN
  • 預載關鍵資源
  • 移除阻擋渲染的 CSS/JS

CLS 優化方法

  • 為圖片和影片指定尺寸
  • 避免在現有內容上方插入新內容
  • 使用 transform 動畫而非改變位置屬性

2. 圖片優化

項目建議
格式優先使用 WebP 或 AVIF
尺寸提供響應式圖片(srcset
壓縮使用工具壓縮,注意品質平衡
Lazy Loading非首屏圖片使用延遲載入
<img 
  src="image.webp" 
  alt="描述性替代文字"
  width="800"
  height="600"
  loading="lazy"
>

3. 資源優化

  • CSS/JS 壓縮:移除空白、註解、縮短變數名
  • 程式碼分割:只載入當前頁面需要的程式碼
  • 快取策略:設定適當的 Cache-Control 標頭

四、頁面內容優化(On-Page SEO)

1. 標題與關鍵字

元素最佳實踐
Title關鍵字放在開頭,品牌放最後
H1與 Title 相關但不完全相同
URL簡短、描述性、使用連字號分隔

URL 結構

✅ example.com/blog/seo-guide
❌ example.com/blog/post?id=12345
❌ example.com/blog/2026/01/18/complete-seo-guide-for-beginners-2026

2. 圖片 Alt 文字

每張圖片都應該有描述性的 alt 屬性。

<!-- ❌ 不好的 alt -->
<img src="photo.jpg" alt="image">
<img src="photo.jpg" alt="">

<!-- ✅ 好的 alt -->
<img src="photo.jpg" alt="開發者在電腦前撰寫程式碼">

用途

  • 協助視障使用者理解圖片內容
  • 圖片載入失敗時顯示替代文字
  • 幫助搜尋引擎理解圖片內容

3. 內部連結

良好的內部連結結構幫助:

  • 搜尋引擎發現和理解頁面關係
  • 分散頁面權重(PageRank)
  • 提升使用者導覽體驗
<!-- ❌ 不好的錨點文字 -->
<a href="/guide">點擊這裡</a>

<!-- ✅ 好的錨點文字 -->
<a href="/guide">SEO 完整指南</a>

4. 內容品質

項目建議
長度重要頁面至少 300 字
原創性避免複製貼上其他網站內容
更新頻率定期更新重要頁面
可讀性短段落、清單、標題分隔

五、行動裝置與可訪問性

1. 響應式設計

<meta name="viewport" content="width=device-width, initial-scale=1.0">

檢查項目:

  • 在各種螢幕尺寸下正常顯示
  • 文字可閱讀,不需水平捲動
  • 可點擊元素大小適當(至少 44×44 像素)

2. 可訪問性(Accessibility)

可訪問性不只是法規要求,也是 SEO 因素之一。

項目檢查重點
色彩對比文字與背景對比度 ≥ 4.5:1
字體大小內文至少 16px
鍵盤導覽所有功能可透過鍵盤操作
ARIA 標籤互動元素有適當的無障礙標籤
<!-- 為圖示按鈕添加 aria-label -->
<button aria-label="關閉選單">
  <svg>...</svg>
</button>

六、結構化資料(Structured Data)

結構化資料幫助搜尋引擎更好地理解頁面內容,並可能獲得豐富搜尋結果(Rich Results)。

JSON-LD 格式

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "SEO Review 完整指南",
  "author": {
    "@type": "Person",
    "name": "作者名稱"
  },
  "datePublished": "2026-01-18",
  "image": "https://example.com/article-image.jpg"
}
</script>

常見類型

類型用途
Article部落格文章、新聞
Product電商產品頁面
LocalBusiness本地商家資訊
FAQ常見問題頁面
BreadcrumbList麵包屑導覽

七、SEO 審計工具

免費工具

工具用途
Google Search Console索引狀態、搜尋成效
Google PageSpeed Insights效能分析
Lighthouse綜合審計
Rich Results Test結構化資料驗證

付費工具

工具特色
Ahrefs反向連結分析、關鍵字研究
SEMrush競爭對手分析、排名追蹤
Screaming Frog網站爬蟲、技術 SEO 審計

總結

一個完整的 SEO 審計應該涵蓋:

類別重點項目
技術 SEOMeta Tags、HTML 結構、語意化標籤
索引控制robots.txt、Sitemap、頁面級設定
效能Core Web Vitals、圖片優化、資源壓縮
內容標題、關鍵字、Alt 文字、內部連結
行動裝置響應式設計、可訪問性
結構化資料JSON-LD、Schema.org

SEO 是一個持續的過程,定期審計和優化是提升搜尋排名的關鍵。


延伸閱讀