今日為 Blog 進行咗多項升級，以下係詳細記錄：

🔍 站內搜尋

已開啟 Hugo 內置搜尋功能，右上角既搜尋 bar 可以即時搜索文章標題同內容。

📱 Open Graph 與 Twitter Card 優化

為文章頁面新增完整既 Open Graph 同 Twitter Card meta tags，分享到社交平台時會顯示靚圖同描述：

  • twitter:card 升級為 summary_large_image
  • 加入 og:image:width 同 og:image:height 優化顯示
  • 文章頁面自動加入 article:published_time 同 article:author tags

🖼️ OG Image WebP 化

將 Open Graph 圖片由 PNG (99KB) 轉換為 WebP (12KB)，大小減少 88%！

同時保留 PNG 版本作後備，確保所有平台都能正常顯示。

⚡ Lighthouse 效能優化

新增以下效能優化：

  • Google Fonts preconnect 同 dns-prefetch
  • 為外部資源預先解析 DNS
  • 主題自帶既 loading="lazy" 圖片優化繼續保留

☁️ Cloudflare Pages 部署流程

確認左 Preview 部署流程：

  1. Push 去 feature branch → Cloudflare 自動 deploy
  2. 獲得 Preview URL 測試
  3. 確認後 merge master → 自動部署到 Production

Build command 已調整為動態使用 $CLOUDFLARE_PAGES_URL 環境變量。

🔒 Security Headers

確認 Security Headers 已完整配置：

  • X-Frame-Options: DENY
  • Content-Security-Policy (完整配置)
  • Strict-Transport-Security
  • Permissions-Policy

💬 留言功能

本文已開啟留言功能，試下喺下面留言！你可以用 GitHub 帳號登入 Disqus 留言。

待續…

接下來既優化方向：

  • GA4 人氣文章排行（需要 Google Cloud service account）
  • SEO Structure Data
  • Lighthouse 分數繼續提升

有問題或建議？歡迎留言 😊