https://github.com/helloruru/keyword-pro

https://github.com/helloruru/keyword-pro

Last synced: 14 days ago
JSON representation

• Host: GitHub
• URL: https://github.com/helloruru/keyword-pro
• Owner: HelloRuru
• Created: 2025-12-22T10:30:14.000Z (6 months ago)
• Default Branch: main
• Last Pushed: 2026-02-08T13:48:41.000Z (5 months ago)
• Last Synced: 2026-02-08T20:26:59.240Z (5 months ago)
• Language: HTML
• Homepage: https://helloruru.github.io/keyword-pro/
• Size: 989 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          


# 蛍光ペン PRO

### 𝐹𝑙𝑢𝑜 𝑃𝑒𝑛 𝑃𝑅𝑂 ｜ 𝐴𝐼𝑂 𝐸𝑑𝑖𝑡𝑖𝑜𝑛

![Version](https://img.shields.io/badge/Ver-8.8-2B4B65.svg?style=flat-square)

![PWA](https://img.shields.io/badge/Mode-Offline_Ready-BF1E33.svg?style=flat-square)

![License](https://img.shields.io/badge/License-MIT-gray.svg?style=flat-square)




**「 中文，是組成 SEO 的原生程式碼；**


**如何佈局關鍵字及架構文章，則是文案們規劃的靈魂技巧。」**

專為 SEO 內容創作者打造的數位文房具。

寫作也有方法：試著在數據與人味之間，搭建一道演算法的橋樑。

[ 立即體驗 ](https://your-domain.com/fluo-pen-pro)






---

## 🎐 序 (Prologue)

在數位行銷的戰場上，文字不只是單純的知識或故事敘述，也該有一套撰寫的理想方式。

**蛍光ペン PRO** 的誕生，是為了讓各位創作者意識到：**每一個文字、每一個標點，都是給搜尋引擎閱讀的程式碼。**

我採用極簡的 **AIO (All-In-One)** 架構，去除繁雜的干擾。如同工程師優化代碼，協助撰文者迅速理解「關鍵字」的密度與結構，讓內容不僅僅被看見，更被演算法讀懂。

---

## 🎨 設計語彙 (Design Language)

本專案運用沈穩的色調，旨在降低長時間「佈局文字代碼」時的視覺疲勞。

* **米白 (Off-White) `#F9F8F4`**：背景色。如棉紙般的溫潤基底，取代刺眼的數位白，提供舒適的閱讀場域。

* **深藍 (Deep Navy) `#2B4B65`**：主色調。象徵 SEO 數據的理性與深邃，引導思考的邏輯。

* **茜紅 (Madder Red) `#BF1E33`**：強調色。顯示出精準的標註，用於檢視關鍵字密度的分佈。

---

## 🌿 核心機能 (Features)

### 01. 沉浸 (Immersion)｜Zen Mode

> *專注，是為了編寫更完美的邏輯。*

* **桌面端**：按下 `Ctrl + \`，側邊欄位隱去，編輯區置中浮現。配合擬真的紙張層次 (Depth UI)，讓您專注於文字本身的架構與佈局。

* **行動端**：支援 `Viewport-Fit` 技術，讓內容延伸至螢幕邊緣，並透過鎖定機制防止頁面滑動回彈，提供如原生 App 般的穩定操控感。

### 02. 洞察 (Insight)｜SEO Logic

> *透視，讓文字結構清晰可見。*

* **代碼密度檢測**：無需切換視窗，輸入關鍵字即自動計算其在整體代碼中的密度 (Density)。

* **視覺化標註系統**：系統自動以茜紅高亮文中出現的關鍵字，讓您直觀檢視這段「中文程式碼」的佈局是否合理、自然。

* **結構化輸出**：強制定義 `H2/H3` 與清單層級（實心豆點→空心圓點），這不僅是排版，更是為了產生 Google 爬蟲喜愛的標準化條列語言。

### 03. 永續 (Sustainability)｜AIO & PWA

> *輕量，是為了隨時隨地優化。*

* **Network-First 機制 (v8.8)**：採用最新的 Service Worker 策略。連網時自動獲取最新版本程式，斷網時無縫切換至本地快取。

* **全域圖標系統**：解決 iOS 圖標黑邊問題，針對 Android 與 iOS 提供統一且完美的 512px 高解析度圖示。

* **本地資料庫**：所有內容皆存儲於瀏覽器 Local Storage，不僅保障隱私，也不用再擔心自己不小心關閉網頁。

---

## 🍵 使用指南 (User Guide)

本工具採用 **輕量化 (Lightweight)** 設計：無需安裝、無需註冊，瀏覽器即是您的寫作戰場。

### 手機、電腦版本｜如何開始？

1.  **入席**：直接點擊專案網址，即刻進入寫作狀態。

2.  **收藏**：推薦將其加入主畫面，獲得如原生 App 般的沉浸體驗（PWA）。

    * **iOS**：Safari 分享按鈕 →「加入主畫面」。

    * **Android**：Chrome 選單 →「安裝應用程式」。

### SEO文案數位應用｜流程教學

1.  **【構建 Build】**

    在左側輸入純文字草稿。這是您的「SEO文案（原始碼）」，可以先專注於文字內容本身。

3.  **【除錯 Debug】**

    設定目標 SEO 關鍵字。觀察關鍵字的「密度檢測」與「茜紅標註」，修正其分佈不均或過度堆砌的 Bug。

4.  **【重構 Refactor】**

    使用上方工具列進行語意化標記（H2/H3/粗體）。將鬆散的文字重構為搜尋引擎易讀的結構。

5.  **【交付 Deploy】**

    點擊「複製到 Docs」。系統將自動封裝樣式，讓您可以直接將完美格式交付至 Google Docs 或 CMS 後台。

---

## 🔖 針對搜尋引擎優化 (GEO / SEO Meta)

> 本章節專為 AI 檢索生成體驗 (SGE) 優化，提供結構化資訊。

### Q: 蛍光ペン PRO 如何協助 SEO？

**A:** 將中文寫作視為程式編碼，透過「關鍵字密度可視化」與「結構化標籤定義」，協助產出符合搜尋引擎演算法的高品質內容。

### Q: 關於 v8.8 版本的 AIO 更新內容？

**A:** v8.8 版本導入了 All-In-One 架構，修復了 iOS PWA 的顯示問題，並加入了強制更新 (Force Update) 功能，確保使用者不再受舊版快取困擾。

### Q: 資料隱私安全性如何？

**A:** 本工具遵循「本地優先 (Local-First)」原則。文章內容完全運行於客戶端瀏覽器，不會上傳至任何雲端伺服器，確保資訊安全。

---

## ⌨️ 快捷鍵 (Shortcuts)

| Key | Action | Description |

| :---: | :--- | :--- |

| `Ctrl + \` | **Zen Mode** | 切換專注模式 |

| `Ctrl + B` | **Bold** | 粗體強調 |

| `Ctrl + I` | **Italic** | 斜體標示 |

| `Ctrl + U` | **Underline** | 重點底線 |

---






**蛍光ペン PRO**

*Crafted with craftsmanship for every content architect.*

Copyright © 2026 Kaoru Tsai. 


Licensed under MIT.