網站內容素材清單：文字、圖片、其他必備項目一次列清楚

設計公司已經把首頁排版、內頁架構圖都排好了，網站看起來只差最後一步，等文案和照片送過去就能把畫面組裝上線。結果這一等，就是兩三個星期甚至一整個月，原訂的上線日期一延再延。

問題往往不在設計公司動作慢，而在你自己以為素材準備是設計公司的工作，直到設計稿都出來才發現文案沒下筆、照片也沒拍齊。這種臨時抱佛腳，幾乎是每個網站專案都會遇到的卡關點。與其等到那一刻才手忙腳亂，不如提早準備一份網站內容素材清單，把整個網站要用到的文字、照片與其他素材，用跨頁面的方式一次盤點清楚，而不是等設計師點名才逐項生產。

先從素材為什麼值得搶在動工前準備好講起，再一路拆進文字、圖片與其他容易被忽略的項目。

素材為什麼要搶在動工前準備好？

設計師開工前最先要確認的，往往不是版型，而是內容的長度。標題有幾個字、段落有多長、照片是直式還是橫式，都會直接影響版面怎麼排。如果設計師先用假文字、圖庫圖做設計，等你的真實素材進來，常常會發現段落擠不下、照片色調跟版面衝突，等於同一個版面要重做一次，時程也跟著往後挪。

網頁設計圈很早就有人提出應該反過來做。A List Apart 的創辦人 Jeffrey Zeldman，在 2008 年就主張應該先確定內容，再決定設計方向，才不會陷入用假文字排版、真實內容進來又要整個回頭修改的循環。這個原則後來被稱為內容先行（content-first），說的就是內容要先決定，版面才照著內容去搭，而不是反過來先決定版面，再逼內容去塞進去。

第一印象形成的速度，比多數人想的還要快。Google 的研究團隊整理相關文獻後指出，使用者對網頁視覺外觀的第一印象，最快在 17 毫秒內就會成形，比眨一次眼還快上好幾倍。這個數字最早可以回溯到 2006 年，Gitte Lindgaard 與研究團隊發表在《Behaviour and Information Technology》期刊上的研究，他們讓受試者只看網頁 50 毫秒，發現這麼短的時間，已經足夠讓人對網頁外觀形成好惡判斷。也就是說，訪客還沒認真讀內文，光憑照片模不模糊、排版整不整齊，就已經先對這個品牌有了初步的觀感。臨時湊合的模糊照片、隨手寫寫的佔位文字，會直接影響訪客對品牌的第一手信任判斷，值得認真準備。

素材沒到位，卡住的不只是文案跟照片這一關。設計師沒辦法定案版面，後續的攝影拍攝、內容校對、上線前測試，都得跟著往後挪一格，最後變成整個專案集體延後，而不是單一項目慢了幾天。

知道素材要早準備是一回事，實際要準備哪些內容又是另一回事。先從文字開始拆，因為多數素材清單漏掉的，往往就是同一類文字重複出現在不同頁面卻沒被算進去。

文字素材，跨頁面要準備哪些內容？

多數素材清單是逐頁列文案，首頁要放什麼、關於我們要放什麼，一項一項對應到頁面。這種列法看起來直覺，卻常常漏掉一個狀況，同一類文字經常會出現在好幾個頁面。客戶見證可能同時放在首頁摘要跟服務頁的完整版，逐頁列很容易漏掉其中一邊，也容易兩邊各寫一次、內容卻對不上。改用跨頁面、依內容性質分類的方式盤點，可以一次把某一類文字全部生產完，再分配到對應頁面，比逐頁生產更有效率，也比較不會漏工。文字素材大致可以分成五種性質，下面逐一拆解。

公司與品牌故事類文字

公司簡介、成立沿革、理念與核心價值、得獎或合作紀錄，這類文字通常會集中出現在關於我們頁面，但首頁摘要區也常會抓一小段來用。寫這類文字最容易掉進的陷阱，是把它寫成一份流水帳年表，哪一年成立、哪一年拿了什麼獎、哪一年搬了新址。讀者真正在意的不是時間軸，而是這家公司能幫他解決什麼問題。同樣的沿革，換成能幫客戶解決什麼問題的角度重寫，讀起來會實用得多，也比較容易被訪客記住。

產品或服務說明類文字

每項產品或服務的特色、適合對象、服務流程、常見問題，是產品頁或服務頁的骨幹內容。這裡最容易犯的毛病，是把說明寫成規格條列，例如尺寸多大、材質是什麼、流程有幾個步驟。條列規格沒有錯，但只有規格，讀者看不出這個服務跟自己有什麼關係。站在客戶角度回答「這個服務能幫我解決什麼問題」，會比你只條列功能規格更容易說服猶豫中的訪客。

信任佐證類文字

客戶見證、案例故事、合作紀錄，是幫訪客建立信任最直接的內容。這類文字最常見的問題，是寫得太空泛，只留下「服務很好」、「體驗很棒」這種評語，讀者看完完全沒有畫面。見證內容應該具體描述合作的過程與成果，讓讀者能想像實際發生了什麼事。另外要提醒一點，沒有真實可查證的數字，就不要硬掰一個成長百分比出來充場面，用文字具體描述成果就好，不必為了看起來更亮眼而編造數字。

行動呼籲與聯絡資訊

每個頁面看完之後，該引導訪客做什麼下一步，也是容易被忽略的一塊。與其寫「了解更多」這種抽象指令，不如換成「立即諮詢」、「馬上預約」這種明確的下一步。除了行動呼籲文字，你的公司電話、地址、營業時間、表單要收集哪些欄位，也都要一併準備好。這些內容看起來瑣碎，卻直接決定訪客會不會真的採取行動，不能等到快上線才臨時補。

給搜尋引擎與 AI 看的文字

每個頁面的標題（title）、描述（meta description）方向，加上自然融入內文的關鍵字，是給搜尋引擎看的內容。Google 的 SEO 入門指南也指出，網頁標題與描述文字的重點，是清楚說明這個頁面在講誰、講什麼服務，而不是把關鍵字硬塞進去。近幾年除了搜尋引擎，AI 摘要工具能不能讀懂頁面內容也變得同樣重要，同一段文字只要寫得夠具體，通常兩邊都吃得下，不必為了討好演算法另外堆砌關鍵字。

文字盤點做完，下一步換成同樣容易被忽略的圖片，而且比文字更直接影響訪客的第一眼印象。

圖片素材的規格與數量，怎麼抓才夠用？

模糊或風格不一致的照片，最容易讓整體質感一次掉下來，比文案寫得普通更容易被訪客一眼看穿。這一節同樣依用途跨頁面分類，而不是逐頁列圖，讓你可以一次盤點同性質的照片，例如所有頁面的形象大圖一起準備，再附上解析度、格式、色彩模式這些基本規格重點。

版面與形象用圖

首頁主視覺、各頁的 Banner、情境示意圖，這類圖片影響整體質感最直接。建議你提供原始高解析度檔案，設計端會依版面需求去裁切壓縮；不要直接用從社群平台下載的圖，這類圖檔已經被平台壓縮過一輪，解析度通常不夠用。

產品或服務實拍照

產品的正面、側面、使用情境照，或是服務過程中的實際照片，也建議提供原始檔，而不是從社群平台下載的壓縮圖。色彩模式也要留意，印刷用的圖檔常是 CMYK，網頁則要用 RGB，兩種色彩模式呈現出來的色調不完全一樣，轉換時可能需要微調，不然放上網頁後顏色會跟印刷品有落差。

團隊與環境照

團隊合照、工作場景、辦公室或店面環境照，用來建立信任感與真實感。這類照片常常被排在準備順序的最後面，甚至乾脆略過，但它比精緻卻明顯是擺拍的圖庫照更有說服力，值得排進優先順序。

品牌識別檔案

Logo（含向量檔）、品牌主色與輔色的色碼、指定字體，是品牌識別最核心的檔案。你的 Logo 務必提供向量格式，才能任意縮放不失真；色彩也最好提供明確的色碼，而不是憑印象描述「大概這個顏色」，不然設計端很難精準還原。

沒有商業攝影預算時的替代方案

如果你的預算有限，可以用現代手機拍攝核心頁面（首頁、關於我們、主力商品）需要的真實素材，搭配自然採光與整潔的背景；其餘配圖可以用授權圖庫，或用 AI 生成式工具輔助，例如幫產品實拍照換上情境背景、或用 AI 去背重組畫面。不過這只是過渡做法，長期還是建議安排一次真正的商業攝影，把最核心的形象照換成原創素材。另外，圖片準備好之後，別忘了每一張都要能寫出有意義的替代文字（alt text）。國際的網頁無障礙標準制定組織 W3C，針對替代文字撰寫也有專門的指引，核心原則是讓看不到圖片的使用者，也能透過文字知道這張圖片要傳達的重點，而不是隨便描述畫面表面。如果一張圖片只是模糊帶過的圖庫照，通常也寫不出真正有意義的替代文字，這也是檢查照片夠不夠具體的一個簡單方法。

文案和照片以外，還有哪些素材容易被漏掉？

文字和照片準備好，只完成了一半。還有一批非內容型的素材，同樣會卡住進度，而且往往是設計公司開工前就得跟你要的東西，只是很少人會想到要提早準備。

網域、主機與後台權限

你是否已經有網域、網域註冊平台的帳號、既有網站的後台帳密、Google Analytics 或 Search Console 的帳號，如果沒有提前確認清楚，常常會拖到正式上線那一刻才發現卡關，臨時要帳密卻聯絡不上舊廠商的情況並不少見。

隱私權政策與表單告知文字

只要你的網站上有表單會收集姓名、電話、Email 等個人資料，依個人資料保護法規定，直接向當事人蒐集個資時就要明確告知蒐集的目的、個資的類別、利用的期間與範圍，還有當事人可以行使的權利。這段文字也是準備素材時容易漏掉的一塊，不必等到網站快做完才臨時補上。

功能與串接需求清單

你是否需要會員系統、線上金流、預約系統、多語系等功能，會直接影響後台架構的複雜度與開發時間。這類需求決定得越晚，開發時間往往被壓縮得越緊，整個專案期程也容易跟著往後拖。

社群與外部連結

Google 商家檔案、Google 地圖連結、LINE 官方帳號、社群平台連結，這些通常會出現在網站上線後的頁尾或聯絡頁。建議你跟聯絡資訊放在同一份清單裡先整理好，免得上線前才發現漏了一個連結。

素材要怎麼整理，才不會分散在各處？

同一份客戶見證，可能一份存在信箱附件，一份存在手機相簿，另一份還躺在舊網站的原始檔案裡。素材散落各處是準備過程中最常見的狀況，這節提供一套跨頁面、依素材類型分類的整理方法，呼應前面幾節的分類邏輯，而不是又回頭用逐頁的方式整理。

建立共享資料夾與追蹤表

依前面的分類，也就是文字、圖片、品牌、其他，建立你自己的子資料夾，用數字前綴固定排列順序，設計公司拿到資料夾一看就知道從哪裡找起。再搭配一份簡單的表格，欄位可以是項目名稱、素材類型、負責人、狀態，追蹤每一項素材是待準備、已完成，還是待確認，讓你自己和設計公司都能一眼看出進度卡在哪裡。

用 AI 加速文案草稿與應急圖片，但別取代真實素材

卡在文案不知道怎麼下筆時，你可以先把想講的重點條列給 AI 助理，請它整理成一版初稿架構，自己再校對、補上真實的數字與細節。AI 適合幫忙先有個開頭，不適合直接照搬當定稿。圖片也是同樣的道理，暫時沒有真實照片時，可以用 AI 生成式工具做過渡用的情境背景或示意圖，但核心頁面，像首頁、關於我們、主力商品，還是建議儘早換成真實拍攝的素材，避免整個網站看起來都是同一種生成感的畫面。

前面幾節分別拆解了文字、圖片與其他容易被忽略的素材，接下來把它們收進同一張表，方便對照確認。

跨頁面素材總檢查表

這份表同樣依跨頁面的邏輯整理，同一類素材，例如所有見證文字、所有形象照，一次盤點完，而不是逐頁檢查一次。你可以在設計公司開工前，自己先跑過一輪，確認有沒有遺漏。

素材準備好的那一刻，網站其實已經完成一大半了。手上有這份網站內容素材清單，你已經能具體列出還缺哪一項、該由誰去準備，而不是等設計稿出來才手忙腳亂地補文案、找照片。與其到時候才臨時抱佛腳，不如現在就照這份清單，先把能準備的部分動手列出來，分工去準備，網站上線的速度，往往就取決於這一步做得多早。