圖片與媒體素材
概述
圖片能快速讓訪客理解您的品牌、產品、作品與空間,但圖片也最容易讓網站看起來不專業:太大會上傳失敗、太小會模糊、沒有描述會讓搜尋引擎與輔助工具看不懂。
Kanorio 的一般網站圖片會在您編輯模組時上傳和使用,目前沒有獨立的「媒體庫」讓您先集中存放再挑選。換句話說,先決定圖片要放在哪個模組,再從那個欄位上傳或選擇素材。
圖片要在哪裡上傳?
圖片欄位會依模組不同而出現。例如頁面主視覺、圖文並排、圖片畫廊、商品展示、頁首 Logo、網站小圖示與頁面分享圖,都各有自己的圖片選擇器。
1. 開啟要編輯的模組
在編輯器預覽中點選模組,或從「排版」清單選擇它。找到圖片欄位後,點擊上傳、選擇圖片或更換圖片。若還沒有適合的內容區塊,可先從「模組」新增。
2. 選擇圖片來源
圖片選擇器通常提供「上傳」、「圖片網址」與「圖庫」三種來源。您可從電腦選檔、貼上可公開讀取的圖片網址,或從 Pexels、Pixabay 圖庫選圖。選擇後,等候載入完成,再確認預覽是否正確。
若您看到裁切工具,先調整可見範圍,再完成裁切;尚未完成裁切時,不要急著離開設定面板。使用外部圖片網址時,請確認您有使用權,且來源網站允許公開載入;對方移除圖片、改變網址或限制存取時,您的網站也可能無法顯示它。
3. 填寫圖片描述
支援 ALT 文字的欄位,請在圖片旁填寫描述。ALT 文字不是給一般訪客看的長篇文案,而是簡短、具體地說明圖片內容。
支援格式與大小
一般網站圖片可上傳 JPG、JPEG、PNG 與 WebP。單一檔案最大為 10 MB。超過大小、空白檔案或無法辨識的檔案會被拒絕。
| 格式 | 適合情境 |
|---|---|
| JPG / JPEG | 相片、場地照、人物照和顏色層次多的圖片。 |
| PNG | 需要透明背景的 Logo、圖示或設計稿。 |
| WebP | 想使用網頁友善、檔案通常較精簡的圖片格式。 |
| HEIC / HEIF | iPhone 常見格式;選擇後會在瀏覽器先轉成相容圖片再上傳。 |
HEIC 或 HEIF 不是伺服器直接保存的格式。Kanorio 會先在您的瀏覽器中轉換,再以上傳相容圖片的方式處理。若轉換失敗,請在裝置上匯出成 JPG 後重試。
系統也會限制短時間內大量上傳。目前一般圖片上傳的保護限制為每分鐘 20 次;如果被暫時限制,請稍候一分鐘後再試,不要連續重複點擊。
圖片 ALT 文字是什麼?
ALT 文字(圖片的替代文字)是一段描述圖片的文字。當圖片無法載入時,它能提供替代說明;使用螢幕閱讀器的訪客也會透過它理解圖片。Google 等搜尋引擎也會用它來輔助理解圖片內容。
好的 ALT 文字描述「看得到的重點」,而不是重複塞入關鍵字。
| 不佳寫法 | 較佳寫法 |
|---|---|
| 咖啡、台北咖啡、咖啡店 | 台北咖啡工作室吧台上的手沖咖啡與淺焙豆 |
| 圖片 | 皮件工作室展示深棕色手工托特包 |
| 我們最好的服務 | 顧問在會議桌旁向兩位創辦人說明品牌策略 |
裝飾性圖片不一定需要詳細 ALT 文字;但產品、作品、人物、場地、流程和重要資訊圖,都應寫清楚。
圖片 ALT 自動補全
在編輯器的「設定」→「進階」中,您可以開啟圖片 ALT 文字自動補全。當您發布或更新網站時,系統會嘗試替缺少 ALT 的相容圖片補上描述,不會覆蓋您已手動填寫的文字。這能提供基本協助,但重要圖片仍建議您手動確認與改寫,因為系統無法知道您最希望訪客理解哪個細節。
免費圖庫
圖片選擇器提供 Pexels 與 Pixabay 兩個免費圖庫來源。當您尚未準備好自己的圖片時,可用關鍵字搜尋,再選擇適合的照片加入模組。
Pexels 與 Pixabay 的使用授權
依 Pexels License 與 Pixabay Content License 的現行條款,兩個圖庫的內容都可免費用於個人和商業網站,也可以依網站需要裁切或修改。您不需要另外付費,也不必在公開網站上自行標註攝影師或圖庫來源。
Kanorio 會在選圖介面顯示圖片來源與攝影師資訊,方便您認識素材作者;若您願意標註,仍是受到歡迎的做法。
這些授權不是「任何用途都沒有限制」。請勿將未經實質改作的圖庫圖片當成獨立素材販售或重新散布,也不要把圖片本身當作商標、品牌標誌或其他識別標記。
使用圖庫時,請選擇能真實代表內容的圖片。餐廳、店面、產品、團隊或作品若已有真實照片,優先使用真實素材,通常比通用圖庫更能建立信任。
圖庫圖片仍可能包含可辨識的人物、商標、品牌、建築物或藝術作品。當圖片會用於品牌核心視覺、廣告、商品主圖或其他敏感情境時,請先確認是否還需要模特兒、商標、肖像、財產或其他第三方權利的同意。Kanorio 與圖庫條款都不能取代您針對特定用途的授權判斷。
圖片品質與網站效能
Kanorio 使用 Cloudflare Images 儲存和傳遞一般網站圖片,讓公開網站可以依使用情境取得較合適的圖片版本。您仍應從源頭選擇清楚、構圖合適的圖片,因為系統無法把原本模糊的照片變成清晰專業照。
上傳前可用以下原則:
- 橫幅或封面選橫向圖片;直式人物或作品選直向圖片。
- 不要把重要文字做在圖片邊緣,手機裁切時可能看不到。
- 同一組作品集使用接近的比例與光線,畫面會更一致。
- 不要為了檔案小而壓縮到馬賽克;也不要上傳遠超過實際用途的大檔。
分享圖與一般圖片
當有人在 Facebook、LinkedIn、X 等平台分享您的頁面時,會看到社群分享預覽。這張圖稱為 OG 圖(社群分享預覽圖),它不是一般模組圖片。
請從「頁面」中的 SEO 設定管理每頁的分享圖。若沒有手動上傳分享圖且自動分享圖功能開啟,系統會依頁面標題與品牌設定產生預覽圖。想深入了解 SEO,請閱讀「完整 SEO 設置」。
影片與其他媒體
本篇主要說明一般網站圖片。若要在網站上顯示 YouTube、TikTok、Spotify、Apple Music、Podcast、表單或預約工具,請使用相對應的整合模組,而不是把影片檔當成圖片上傳。
小技巧
- 上傳前先替檔名加上用途,例如
coffee-studio-bar.jpg,日後整理本機素材較容易。 - 重要圖片先寫 ALT 文字,再發布;不要等 SEO 檢查時才一次補完。
- 更換圖片後,在手機預覽查看裁切結果,尤其是封面與滿版大圖。
- 圖庫照片只能當起點;有真實案例後,優先替換成自己的照片。
常見問題
單一圖片最大為 10 MB。請先縮小尺寸或用相片工具匯出較適合網頁的 JPG、PNG 或 WebP,再重新上傳。不要反覆上傳同一個超大檔案。
可能是原始圖片解析度太低、圖片被放大超過原本尺寸,或裁切後只剩很小的區域。改用更清楚的原圖,並在預覽中檢查裁切範圍。
可以。選擇器的「圖片網址」分頁可貼上能公開讀取的圖片網址,系統會提醒您外部圖片的風險。請只使用您有權使用的來源;不要把需要登入、會過期或不允許外部載入的網址貼進來。若圖片是網站的重要素材,較建議上傳您自己的檔案,避免來源網站改址、移除或限制圖片。
依序確認檔案沒有超過 10 MB、格式正確、網路連線穩定,且不是短時間內連續大量上傳。若仍失敗,改用 JPG 或 WebP 後重試,並記錄錯誤訊息供客服協助判斷。
重要內容圖片應該填寫。純裝飾圖片可不必寫長描述,但不要讓產品、作品、服務流程或包含重要文字的圖片沒有說明。
可以。依兩個圖庫目前的授權條款,內容可免費用於商業網站,且通常不需要自行標註來源。不過,人物、商標、品牌或建築物等可辨識內容可能仍有額外權利限制;重要商業用途前請自行確認。
Kanorio 會嘗試在瀏覽器轉換 HEIC 或 HEIF。若裝置或圖片無法轉換,請先在手機或電腦匯出成 JPG,再重新上傳。