← → 翻页 · ESC 索引
NTUB · SEO × GA4 · 30HR
01 / 22 講義 · module5
Module Five · 第 5 週

On-Page 下半
與 Technical 地基

內容深度、URL 結構、Alt、內部連結,
加上 Core Web Vitals 與 Canonical/301/HTTPS/Schema —— 把扣分點全部關上

3 小時授課 · 3 單元· NTUB Spring 2026· 弄一下工作室
Lecturer Deck · M5
On-Page (下) + Technical SEO
Vol.05
Opening · 開場
02 / 22 講義 · module5
This Week's Premise

技術 SEO 不會讓你加分
但做錯就讓你歸零

這週 50% 在內容細節,50% 在技術底層 ——
兩者同樣重要,但錯的代價不同。

NTUB SEO × GA4
開場主張
Page 02
Act I · Unit 5-1
03 / 22 講義 · m5-1-onpage-bottom
Act I · 60 min

Content / URL / Alt /
內部連結

上半週做了 Title、Meta、H1–H3 三項。下半週把內容、網址、圖片、連結四項補完 —— On-Page 才算有完整骨架。

Unit 5-1·4 項要素·1 課堂任務
NTUB SEO × GA4
On-Page 下半 · 四件未完成的事
Page 03
Act I · Concept
04 / 22 講義 · m5-1-onpage-bottom
Why · 為什麼下半重要

Title 寫對只是入門
剩下四項決定停留

01 · Content

深度/獨特/符合意圖。長度沒有固定標準,「讓使用者滿意離開」才是衡量點。

02 · URL & Alt

URL 是第一層語意暗示,Alt 同時服務Google 與無障礙—— 兩個讀者一起寫對。

03 · Internal Links

把 PageRank 從首頁這類權威頁,傳遞給流量少但要主推的頁面。

NTUB SEO × GA4
概念:On-Page 下篇全貌
Page 04
Act I · Spec
05 / 22 講義 · m5-1-onpage-bottom
How · 四項操作規格

下半四件事,各自一條規則

Content
深度 + 獨特觀點 + 符合搜尋意圖。產品頁 500–800 字精準描述就夠,不要為字數填廢話
Quality
URL
小寫英文 + 連字號(-)+ 含關鍵字 + 越短越好。避免底線、避免日期戳記、避免參數海。
Structure
Alt
每張圖都要寫 alt:描述圖片內容 + 自然帶入關鍵字。Google 與螢幕閱讀器同時依靠它。
Image SEO
Internal Links
每篇至少 2–3 個內部連結,anchor text 描述目標頁關鍵字,禁用「點擊這裡」「更多資訊」。
PageRank Flow
NTUB SEO × GA4
操作規格 · 四列 SOP
Page 05
Act I · Case
06 / 22 講義 · m5-1-onpage-bottom
Case · URL 對照

同一篇文章,兩種 URL

Bad ✕

/?p=1287&cat=12
/2026/05/09/post_id_8721.html
/seo教學初學者完整指南.html

參數海、日期戳、中文 encoding —— Google 抓不到語意,使用者也記不住。改版馬上死。

Good ✓

/seo-guide-beginner
/products/wireless-headphone
/blog/cwv-fix-tips

小寫 + 連字號 + 含關鍵字 + 短。讀得懂 / 改得動 / 分享出去也好看

NTUB SEO × GA4
案例:好 URL vs 壞 URL
Page 06
Act I · Pitfall
07 / 22 講義 · m5-1-onpage-bottom
Pitfall · Anchor Text 寫法

內部連結 最常見的錯
把語意全部丟掉

「想了解更多 SEO 技巧,請點擊這裡。」 Anti-pattern · 0 SEO 訊號
「延伸閱讀:Core Web Vitals 改善 5 個快招。」 Pattern · 關鍵字 + 上下文齊全

anchor text(連結文字)會被 Google 當成對目標頁的描述。「點擊這裡」等於把整段語意送進垃圾桶 —— 改寫成關鍵字短句,是免費的排名提升

NTUB SEO × GA4
Anchor Text 反例對照
Page 07
Act I · Practice
08 / 22 講義 · m5-1-onpage-bottom
Practice · 課堂任務 · 20 min

把上週那篇 LocalWP 文章
七項全打勾

逐項確認,然後截圖 Yoast SEO 面板(綠燈狀態)作為作業繳交的驗證證據

01–03 · 上半

Title ✓
Meta Description ✓
H1 ✓ / H2–H3 結構 ✓

04–06 · 下半

內容深度與意圖符合 ✓
URL 含關鍵字 ✓
圖片 Alt ✓

07 · 連結

至少 1 個內部連結 ✓
anchor text 含目標關鍵字 ✓

NTUB SEO × GA4
課堂任務 · On-Page 七項驗收
Page 08
Act II · Unit 5-2
09 / 22 講義 · m5-2-cwv
Act II · 50 min

Core Web Vitals
& PageSpeed Insights

Google 用三個指標衡量「頁面體驗品質」:載入快、互動順、版面穩。每一項都有「綠燈門檻」。

Unit 5-2·LCP / INP / CLS·PSI 實測
NTUB SEO × GA4
Core Web Vitals · 三指標
Page 09
Act II · Why
10 / 22 講義 · m5-2-cwv
Why · 為何看 CWV

排名只是表面
真正衡量的是 使用者體感

Google 從 2021 年起把 CWV 納入排名訊號。同分內容的兩篇文章,CWV 差的會被往後排 —— 因為使用者離開得更快。

CWV 不是 SEO 的「加分項」,而是同票時的決勝局 Google Search Central · Page Experience Update
NTUB SEO × GA4
概念:CWV 在排名鏈中的位置
Page 10
Act II · Spec
11 / 22 講義 · m5-2-cwv
Spec · 三指標標準

三盞綠燈,各有門檻

LCP · Largest Contentful Paint 2.5秒以下 載入:頁面最大元素(通常是首圖)出現的時間。
常見殺手:未壓縮大圖、伺服器慢、字型阻塞。
INP · Interaction to Next Paint 200ms 以下 互動:使用者點/敲後到下一次畫面更新的延遲(取代 FID)。
常見殺手:肥大 JS、第三方追蹤碼。
CLS · Cumulative Layout Shift 0.1以下 穩定:版面跳動的累積分數。
常見殺手:圖片沒設寬高、廣告塞入後推擠內容。
NTUB SEO × GA4
CWV 三指標 · 標準值與測量
Page 11
Act II · How
12 / 22 講義 · m5-2-cwv
How · PSI 診斷五步

數字動作
五步走完一輪

按 Space/→ 逐步揭示

01 開 PSI 前往 pagespeed.web.dev,貼上網址。
02 看分數 行動版/桌機版分開讀,行動版更嚴格。
03 讀 CWV 區 確認 LCP/INP/CLS 三盞燈是綠是紅。
04 挑高 CP 值 「建議」按潛在節省排序,先做圖片壓縮。
05 回 GSC 驗 28 天後在「體驗」報表看真實使用者數據。
NTUB SEO × GA4
PSI 診斷流程 · 5 步
Page 12
Act II · Fix
13 / 22 講義 · m5-2-cwv
Fix · 三指標的高 CP 值改法

不用全部修,挑紅燈下手

LCP 慢
圖片轉 WebP + 設 width/height + 用 lazy loading;首屏 hero 圖加 fetchpriority="high"。
Image First
INP 高
移除不必要的第三方 JS(Pixel、Heatmap);自訂 JS defer / async;考慮輕量替代品。
JS Diet
CLS 大
所有圖片/iframe/廣告位固定寬高;字型用 font-display:optional 避免 swap 跳動。
Reserve Space
通用
裝快取外掛(WP Rocket/LiteSpeed Cache)八成問題一鍵解;不要過度堆四五個外掛。
One Plugin
NTUB SEO × GA4
改善方向 · 對症下藥
Page 13
Act II · Practice
14 / 22 講義 · m5-2-cwv
Practice · 課堂任務 · 15 min

Lighthouse 測你的
LocalWP 站首頁

LocalWP 是本地站,PSI 爬不到。改用 Chrome 內建 Lighthouse:右鍵 → 檢查 → Lighthouse → 跑一次 Performance 報告。

Step A

截圖 LCP/INP/CLS 三項數值,標註紅綠燈狀態

Step B

挑「潛在節省」最大的一條建議,寫下打算怎麼改。

Step C

下週上線後在真實網域用 PSI 重測,比較前後差。

NTUB SEO × GA4
課堂任務 · CWV 三指標實測
Page 14
Act III · Unit 5-3
15 / 22 講義 · m5-3-technical
Act III · 60 min

Technical SEO ·
四項避免扣分

Canonical、301、HTTPS、結構化資料 —— 做對了不會明顯加分,做錯了索引全毀。技術 SEO 的本質是地基檢查

Unit 5-3·4 個技術點·JSON-LD 實作
NTUB SEO × GA4
Technical SEO · 四項地基
Page 15
Act III · Why
16 / 22 講義 · m5-3-technical
Why · 為何技術 SEO 是地雷區

內容做得再好,
地基沒鎖緊就全空。

Canonical 用錯、301 設錯、結構化資料格式錯 ——
都可能讓索引全毀
Module 5-3 課堂金句

接下來四項,每一項都不會帶來明顯排名提升,但任何一項出錯,前面所有 On-Page 努力都會化為烏有。所以這節的判讀順序是:先排雷,再求好

NTUB SEO × GA4
概念:避免扣分 > 拿加分
Page 16
Act III · Spec
17 / 22 講義 · m5-3-technical
Spec · 四項一頁地圖

四個技術點,各管一件事

Canonical
同一份內容出現在多個 URL(含參數、分頁)時,告訴 Google 哪個是正本,避免重複內容懲罰。
Source of Truth
301 轉址
換 URL 時用 301 把PageRank 永久搬家。WordPress 用 Redirection 外掛視覺管理;禁用 302除非真的暫時。
Permanent Move
HTTPS
2014 年起列為排名訊號。LocalWP 預設就是 HTTPS;正式上線必須用 SSL(Let's Encrypt 免費)。
Trust Signal
結構化資料
用 JSON-LD 告訴 Google「這是文章/商品/FAQ」,可獲得 Rich Snippet(星評、發布日、FAQ 展開),提升 CTR。
Schema.org
NTUB SEO × GA4
技術四項 · 一頁地圖
Page 17
Act III · Case
18 / 22 講義 · m5-3-technical
Case · 301 vs 302 致命差異

同樣是轉址
選錯就是全毀

301 · Permanent

HTTP 301
Moved Permanently

告訴 Google「這頁永久搬家了」—— PageRank、外部連結權重、索引狀態全部繼承到新 URL。換網域、整併內容用這個。

302 · Temporary

HTTP 302
Found / Temporary

告訴 Google「暫時看這個」—— PageRank 不轉移。只用在限時促銷、A/B 測試。誤用在正式搬遷 = 排名歸零。

NTUB SEO × GA4
案例:301 vs 302
Page 18
Act III · Example
19 / 22 講義 · m5-3-technical
Example · JSON-LD 最小可用範本

Article Schema · 抄這段就能跑

{ "@context": "https://schema.org", "@type": "Article", "headline": "CWV 改善 5 招", "author": { "@type": "Person", "name": "弄一下工作室" }, "datePublished": "2026-05-09", "image": "https://example.com/og.png" }
Yoast SEO 已自動生成 基本 Article Schema
不用手寫,但要驗證

產出後丟到 Google Rich Results Test(search.google.com/test/rich-results),確認顯示「適合的 Rich Results」、沒有錯誤才算過關。警告可暫忽略。

NTUB SEO × GA4
JSON-LD 範例 + Rich Results 驗證
Page 19
Act III · Practice
20 / 22 講義 · m5-3-technical
Practice · 課堂任務 · 25 min

任選一篇文章 +
Article JSON-LD驗證通過

這是本週第二項繳交物。配合上一節 PageSpeed 截圖一起交。

Step A · 5 min

確認 Yoast SEO 已開啟,檢查文章原始碼有 ld+json 區塊。

Step B · 10 min

補上缺欄位(image、datePublished、author),必填項全綠

Step C · 10 min

丟進 Rich Results Test,截圖「適合 Rich Results」綠色畫面繳交。

NTUB SEO × GA4
課堂任務 · Schema 實作驗證
Page 20
Bridge · M5 → M6
21 / 22 講義 · module5
Outro · 三節回收

內容地基
On-Page 全程結束

5-1 完成
Content 深度寫對 + URL 短而含關鍵字 + Alt 補齊 + 內部連結 anchor 改寫
On-Page 下半
5-2 完成
LCP 2.5s / INP 200ms / CLS 0.1 三盞燈門檻 + PSI 五步診斷看建議排序。
CWV 三指標
5-3 完成
Canonical/301/HTTPS/JSON-LD 四項地基檢查,避開技術 SEO 的扣分點。
Technical SEO
→ Next M6
Off-Page(反向連結 / E-E-A-T)+ GA4 基礎(建立帳戶 / LocalWP 埋碼)—— 從「站內」走到「站外 + 數據」。
下週起跑
NTUB SEO × GA4
M5 三節地圖 → M6 銜接
Page 21
End of Module 5
22 / 22
To Be Continued

下週 · M6
Off-PageGA4 起跑

站內地基鎖緊了 —— 該往站外信號數據追蹤移動。
反向連結、E-E-A-T、GA4 第一個資料串流,下週見。

Module 6 · Off-Page + GA4· NTUB SEO × GA4 · 30hr· 弄一下工作室
Lecturer Deck · M5 End
Thanks for the focus.
Vol.05 · Fin.