餐飲網站設計教學：打造讓顧客主動上門的品牌官網

想像一個畫面。晚上七點，一個人站在附近路口滑著手機，想從幾家餐廳裡挑一個今晚走進去。你不知道他會比較多久，但店家資訊若難找，就可能增加放棄的機會。

能不能讓他快速找到做決定需要的資訊，是餐飲網站的重要任務。

很多餐飲業主把網站當成「數位傳單」在做：滿版漂亮的照片、一段感人的品牌故事、一個 PDF 菜單下載連結，然後覺得搞定。老實說，這種網站對營業額的幫助接近零。因為它服務的對象，根本不是「肚子餓、正在決定要吃哪一家」的那個人，而是滿足業主自己「我有一個網站了」的心理。

這篇要把餐飲網站設計這件事，倒過來講。不是從「要選哪個架站平台」開始，而是從「那個站在路口滑手機的人，腦袋裡到底需要什麼」開始倒推。每一個設計決定，都要對應到「會不會讓他把腳步轉進你店裡」這件事。

核心重點：餐飲網站要做好，把握四件事。第一，它的主戰場是手機，不是桌機；第二，菜單要做成 HTML，不是 PDF；第三，Google 商家檔案比官網更重要，兩者要互相餵養；第四，載入速度慢一秒，你就把客人推給隔壁。下面把這四件事，一路拆到可以動手做的細節。

餐飲網站的真正任務，不是好看，是搶下那 3 秒鐘的決策

「我們想要一個很有質感的網站。」這是餐飲業主開口的第一句話。實務上會先把這句話拆開來問：你說的質感，是給誰看的？

如果是給 已經決定要來吃的人 看，他要的是地址、營業時間、好不好停車、能不能訂位。這時候你給他一個滿版影片自動播放的 Hero Section，他僅會覺得「載入好慢，我去問隔壁那家」。如果是給 還沒決定要吃什麼的人 看，他要的是「這家看起來好不好吃、氣氛對不對、價位我能不能接受」。這時候你要在兩秒內讓他看到一張會流口水的菜色照片、一個清楚的價位帶、一句讓他安心走進去的話。

換句話說，餐飲網站跟一般的企業形象網站，骨子裡是兩種生物。企業形象網站的任務是「建立信任、留下印象」，可以慢慢鋪陳；餐飲網站的任務是「在人家最餓、最不耐煩的那一刻，快速給他做決定需要的全部資訊」。這個差別，決定了你所有設計選擇的方向。

餐飲網站的工作，可以濃縮成一句話：讓手機上的訪客快速找到做決定需要的資訊。 Hero 區、菜單、地圖、訂位按鈕、評價與營業時間都應服務這個目標，但不必硬套三秒鐘或「少一項就流失」的通則。

從「肚子餓的人」倒推回來：四種訪客，四種任務

要做對設計，你得先知道誰會來、他們各想要什麼。餐飲網站的訪客可分成四種，每種人的腦袋裡裝著不同的問題，也對應不同的頁面和行動呼籲（CTA）。把這張表記下來，你做每一個頁面時，都問自己一句：「我現在服務的是哪一種人？」

訪客類型	他腦袋裡的問題	他要的頁面	該給的 CTA
探索型（還沒決定吃啥）	「這家看起來好吃嗎？氣氛對嗎？價位呢？」	首頁 Hero、菜單、菜色照片	看完整菜單 / 立即訂位
導航型（已決定要來）	「幾點關？地址？怎麼走？有停車嗎？」	聯絡頁、內嵌地圖、頁尾資訊	導航前往 / 查看營業時間
轉換型（要訂位或外帶）	「怎麼訂？能不能線上點？能不能外送？」	訂位頁、外帶外送頁	立即訂位 / 線上點餐 / 加 LINE
說服型（辦聚會、查評價）	「別人怎麼說？適合帶長輩或小孩嗎？有包廂嗎？」	關於我們、最新消息、Google 評價	看評價 / 預約包廂

你會發現，這四種人裡面，僅有「說服型」需要品牌故事。其他三種，要的是資訊和動作。所以一個好的餐飲首頁，絕大多數的版面，應該留給菜色照片、菜單入口、訂位按鈕、地圖、營業時間這些「會被立刻用到」的東西，品牌故事給它一個小區塊就好。這個優先順序，跟一般企業網站剛好相反。

換個比喻：你的網站不是一本翻給人慢慢欣賞的雜誌，而是一個站在門口、動作很快的帶位員。客人一進門，他要立刻判斷這位客人要什麼，然後兩秒內把他帶到對的位置。帶位員不會一開口就唸一段品牌理念給客人聽，你的網站也不該這樣。

技術底盤：為什麼實務上會推薦 WordPress 給絕大多數餐飲業主

講到要做網站，餐飲業主常在代管平台與自架網站之間猶豫。如果你打算長期經營內容、需要較高的擴充與 SEO 控制彈性，WordPress 是值得優先比較的選項；若僅需要簡單頁面，也要把維護時間與總成本一起算進去。

這不是信仰問題，是數字問題。依 W3Techs 的統計（2026 年 6 月），WordPress 在全球所有網站的內容管理系統裡，佔有率長年超過四成，是規模最大的那一個。市佔大，代表生態系大、外掛多、教學資源多、找人維護容易。你今天遇到的任何問題，幾乎都有人遇過、有人寫過解法。這對沒有專屬工程師的餐飲業主來說，就是最實際的保險。

更重要的是內容主控權。餐飲業的內容，不僅是菜單，還有季節新菜、節日套餐、媒體報導、得獎紀錄、背後的故事。這些內容，是你長期累積在 Google 眼中的「主題權威」的素材。用 WordPress，這些內容完全長在你自己的網域上；用封閉的訂閱型平台，你等於是把內容租來的，哪天平台漲價或政策改變，你連搬走都很痛。

實際挑選上，佈景主題可以從一個以速度和相容性著稱的輕量主題開始，再用一個主流的視覺化頁面編輯器把版面拉出來，這兩件事稍後再分開展開講。如果你是純新手、連主機要怎麼買都不知道，可以從一套完整的代管架站流程入手。想自己比較的話，佈景主題的完整清單跟頁面編輯器的深度評比，之前專門寫過，自行拉來參考：WordPress 佈景主題推薦、頁面編輯器比較、Bluehost 自架 WordPress 完整教學。

這裡也要先講清楚一個例外：如果你這家餐飲店同時要做電商，例如賣禮盒、冷凍調理包、自製醬料、烘焙預購，那就要把 WooCommerce 一起規劃進來，挑一套適合零售的 WooCommerce 佈景主題，再把金流物流一次接好。餐飲加零售是常見的延伸做法，這條路可參考：WooCommerce 購物網站架設全攻略。

從零到一的資訊架構：僅放會被用的東西

餐飲網站最容易犯的錯，不是少放了什麼，而是放了太多沒人會用的東西。不少餐飲網站常見的狀況是，選單列了七八個項目：首頁、關於我們、品牌故事、最新消息、菜單、線上訂位、聯絡我們、常見問題、徵才訊息。結果真正會被點的，永遠僅有菜單、訂位、聯絡這三個。

一個健康的餐飲網站，核心頁面其實僅需要這幾個：

• 首頁：Hero 區放一張最強的菜色照片 + 一句定位 + 一個主 CTA（看菜單或立即訂位），往下接菜色分類、訂位入口、地圖、營業時間、評價。
• 菜單頁：網站流量最高的頁面，沒有之一。要做成 HTML，後面會專門講。
• 關於我們：品牌故事、主廚或創辦人、得獎與媒體報導。給說服型訪客看。
• 訂位 / 外帶外送頁：一個清楚、步驟少的流程入口。
• 聯絡頁：地址、營業時間、電話、內嵌地圖、停車資訊、社群連結。
• （選配）最新消息：季節套餐、節日活動、臨時公休。這個頁面是給 Google 看你「還活著、還在更新」的訊號。

就這樣。其他像「徵才」「部落格」「私廚服務」這種，能收進子選單就收進去，別占主選單的位子。選單越乾淨，客人在手機上越容易找到他要的東西。規劃網站整體結構的心法，跟 SEO 的關係非常密切，這部分有一篇完整的拆解：網站架構圖規劃全攻略。如果連「一個頁面該具備哪些基本元素」都還沒把握，先把網頁設計必備的關鍵元素看過一遍再回來：網頁設計必備的 8 個關鍵元素。

高質感從「視覺系統」來，不是從砸錢拍照來

「質感」這兩個字，很多人以為等於「照片拍得美」。不完全對。真正讓一個網站看起來有質感的，是一致性，不是單張照片有多厲害。同樣的菜色照片，放在一個配色雜亂、字型混亂、間距忽大忽小的版面裡，再貴的攝影也救不回來。

視覺系統由三件事撐起來：配色、字型、攝影規範。

第一，配色。餐飲業的配色，建議走「一個主色 + 一個輔色 + 大量留白」的路線。主色定調情緒：暖紅橙黃帶食慾、深綠墨黑帶高級感、奶油原木色帶溫度。輔色用來點綴 CTA 按鈕和價格。千萬不要把五種顏色全灑上去，那僅會讓人覺得亂。完整的配色方法，可以照著這篇一步步做：網頁設計配色實戰指南。

第二，字型。這在中文餐飲網站裡，是被嚴重低估的一環。中文字型的選擇，直接決定了「高級」還是「便宜」的觀感。一間走高價路線的日料或鐵板燒，跟一間走平價的早午餐，該用的字型個性完全不同。黑體給人現代俐落、明體給人文質感、圓體給親切感。挑字型不是憑感覺，是有方法的：中文字體選擇指南。

第三，攝影規範。這部分特別要強調一個觀點：菜色照片的質感，跟攝影師多貴沒有絕對關係，所有照片有沒有套用同一套規則才是重點。實務上有一個對預算有限的店家很有效的做法：所有菜色照片，用同一個背景（例如同一塊木桌或同一個石板）、同一個光線方向（盡量靠窗的自然光）、同一個拍攝角度（例如全部正俯拍 90 度，或全部 45 度）、同一個裁切比例。若這四個變數固定，就算你用手機拍、自己修，擺上網站也會立刻有一種「這家店很有系統、很有質感」的感覺。一致性帶來的高級感，比單張精修照片更強。

視覺做出來之後，接著是把它裝進版面。首頁的 Hero 區是門面，滿版輪播或單張定幕的 hero 怎麼拉，會直接影響第一印象：Elementor Pro 滿版輪播 Hero Section 教學。頁首頁尾則是出現在每一頁的導覽骨架，千萬別隨便：Elementor Pro 頁首頁尾設計教學。

講回首頁的 Hero 區，這裡放的那一張照片，是你整個網站報酬率最高的一張圖。它要在第一眼就回答客人腦裡那句「這家店值不值得走進去」。實務上的建議是：別放空景、別放店面外觀、別放一張模糊的團隊合照，放你最有把握、最能代表你店水準的那一道招牌菜的特寫。一張讓人一看就肚子餓的照片，勝過你寫一千字的品牌故事。而這張圖的技術規格也要顧：同時準備一個手機直式比例的版本，因為多數客人會用手機的直式螢幕看到它。

菜單頁是餐飲網站的靈魂，多數人卻把它做成 PDF

這一節會講最細，因為菜單頁是餐飲網站裡流量最高、轉換力最強、卻也最常被做爛的一頁。

台灣大多數餐飲網站的菜單頁，做法是這樣：拍一張實體菜單的照片，或把設計好的菜單存成 PDF，上傳到網站，放一個「下載菜單」按鈕。業者覺得「反正客人會自己下載來看」，看起來也省事。這個做法，有三個致命問題。

第一，手機體驗通常很差。客人在路上、肚子餓，點了「下載菜單」，還要開檔、放大縮小，在小螢幕上滑動找菜名。第二，SEO 與無障礙表現不穩。Google 能索引可讀取的文字型 PDF，但掃描圖片或版面複雜時，菜名與價格未必能被正確理解；HTML 也更容易加入標題、內部連結與替代文字。第三，更新麻煩。你漲了十塊錢，要重做整份 PDF、重傳；如果同時更換網址，舊連結還可能失效。

較容易維護的做法，是把菜單做成 HTML 結構化內容。每道菜一個區塊，包含菜名、價格、簡短描述，以及選配照片或飲食標籤。這樣菜名和價格是可索引文字，手機也較容易閱讀；改價時僅需更新對應欄位。三種做法的差異如下：

呈現方式	手機體驗	SEO 表現	更新便利性	無障礙
PDF 下載	差，要下載開檔縮放	文字型 PDF 可被索引，但控制與語意較弱	改一個價格要重傳整份檔	取決於 PDF 是否正確建立標籤與閱讀順序
圖片菜單	普通，可放大但易模糊	主要仰賴周邊文字與圖片資訊，內容理解有限	改價要重做整張圖	若無完整替代文字，視障使用者讀不到
HTML 結構化菜單	佳，順順滑動即讀	菜名價格描述都能被索引	後台直接改單一欄位	可正確朗讀給視障者

菜單頁還可以補上每道菜的簡短描述。除了菜名與價格，食材、口味與適用飲食資訊能幫助顧客判斷，也可能對應更具體的搜尋需求。不過，出現某個詞不會直接決定頁面是否排名；描述必須真實、好讀，過敏原與飲食標籤也要有可確認的依據。

菜單的排版，還有一個小訣竅能立刻提升質感：分類要清楚（前菜、主餐、甜點、飲品各自一塊），價格對齊（全部靠右對齊，視覺上乾淨），描述不要太長（一行到一行半最好，寫太長反而像在硬賣）。如果你怕用文字排版會不好看，其實用表格工具就能拉出很整齊的菜單，這篇的作法可以套用：WordPress 表格製作終極指南。

菜單頁也是放 CTA 的黃金位置。客人看完菜單，情緒最高點，這時候旁邊一定要有一個「立即訂位」或「加 LINE 訂位」的按鈕接住他。CTA 怎麼設計才會被點，是有心理學根據的：CTA 行動呼籲按鈕設計終極指南。

線上訂位與外帶外送：把「打電話」這個漏斗缺口補起來

餐飲業最大的隱形漏斗缺口，是「打電話訂位」這件事。業者覺得「打個電話就好啊」，但站在客人立場，打電話要挑時段（尖峰時間沒人接、離峰時間怕打擾）、要對著陌生人講話、要拼寫名字跟時間。這幾個小摩擦加起來，就足以讓一波本來要訂位的人，默默轉去別家。

把訂位搬到線上，不是為了看起來很科技，是為了把那些「嫌打電話麻煩就放棄」的客人接回來。實作上，你僅需要一個能在 WordPress 上跑的訂位系統，讓客人自己選日期、時段、人數，系統自動幫你擋掉額滿的時段。選哪套、怎麼接，這裡整理了一份完整的比較和實戰流程：WordPress 預約外掛推薦、Amelia 線上預約系統實戰。

自有網站可以讓餐廳自行設計訂位與外帶流程，並降低對單一平台的依賴；是否能降低成本，仍取決於金流、維護、行銷與客服投入。蒐集顧客資料時也必須取得適當同意，並依隱私政策與個資法規管理。

手機是主戰場，速度是生死線

餐飲網站的訪客，絕大多數來自手機，而且是在戶外、訊號不穩、心情急迫的狀態下打開你的網站。這跟坐在辦公室用光纖桌機瀏覽企業網站，是完全不同的使用情境。

依 Statista 的統計（2026 年 4 月），全球的網站流量裡，來自行動裝置的比例，長期維持在六成上下。餐飲網站的實際比例仍要看自己的分析資料，但「找餐廳」常發生在行動情境。網站如果僅針對桌機設計、在手機上字太小、按鈕太擠、圖片跑不出來，就會漏掉大量潛在客人。響應式設計不是加分題，是基本配備：響應式網頁設計 RWD 完整指南。

速度也要實測。Google 的 web.dev 在Why does speed matter?中說明載入效能與使用者體驗及商業成效有關，但不同網站的影響幅度並不相同。餐飲網站可優先量測首頁、菜單與訂位路徑，找出真正拖慢操作的資源，不必用五秒或一秒半當成勝負線。

餐飲網站常見的速度瓶頸，是沒有優化的圖片。一張直接從相機匯出的幾 MB 菜色照片，擺了十幾張在菜單頁，載入自然會變慢。解法不複雜：壓縮、轉成新格式（像 WebP）、延遲載入非首屏圖片。這幾件事可參考：WordPress 圖片優化指南。速度優化的首要價值是改善使用體驗與轉換；Core Web Vitals 也是 Google 使用的小幅排名訊號之一，但不能保證單靠速度就提升名次：速度優化的完整做法。

要判斷你的網站到底夠不夠快，有一個最老實、也最準的測試方法：走出你的店，站在門口，用手機的 4G 訊號（不是店裡的 Wi-Fi），打開你自己的網站，從首頁一路點到菜單頁、再點到訂位。如果這趟走完你自己都會覺得煩，那客人一定也會覺得煩。這個測試不需要任何工具，但它模擬的，就是真實客人最常拜訪你的那個情境。工具式的速度檢測當然也要做，但工具給你的是分數，站在店門口實測給你的是體感，兩者都不能少。

在地搜尋：Google 商家檔案，可能比你的官網更重要

餐飲業常見一個迷思：若把官網做好，Google 就會把客人帶來。實際上，官網與在地搜尋資料要一起經營。

真正的情況是：當一個人在 Google 搜「火鍋 台中 西區」或「早午餐 我家附近」，排在最前面、佔最大版面的，是 Google 地圖跟 Google 商家檔案（以前叫「Google 我的商家」）的那一整塊在地搜尋結果，不是你的官網。也就是說，對一個第一次聽過你、還在搜尋階段的潛在客人來說，他第一眼看到的，是你的商家檔案，不是你的網站。你的官網，常常是他在商家檔案裡點了那顆「網站」按鈕之後，才會被帶進去的。

所以正確的策略，不是「把官網做好等客人」，而是「把商家檔案當成你的第一個門面，把官網當成第二個門面，兩者互相餵養」。商家檔案要做的功課包括：把營業時間、電話、地址、菜單連結、照片、最新優惠全部填滿、定期更新；積極收 Google 評價並回覆；在檔案裡的「網站」按鈕，連到你的官網首頁或菜單頁。這一整套，有一份從申請到經營的完整攻略：Google 我的商家完整攻略。

在商家檔案上，還有一個比填資料更用力要做的功課：評價。餐飲業的評價，是消費者決策的最大變數，很多人在走進一家店之前，會把評論區往下滑好幾頁。你能做的兩件事都很樸素：第一，主動邀請每一位用完餐、表情滿意的客人留一則評價，一句話也好；第二，每一則評價，不論好壞，都認真回。回覆不是制式的公關話術，目的是讓下一個看評論的人看到「這家店的老闆真的在看、真的在回」，這份參與感本身就是信任。負評尤其要回，冷靜、具體、不辯護地說明，往往比一面倒的五星好評更能說服那些還在猶豫的客人。

而在官網這一側，你要做的對應動作，是把地圖內嵌進聯絡頁和首頁，讓導航型的客人快速找到店家並開啟導航。內嵌地圖的做法很簡單，不用寫程式：WordPress 嵌入 Google 地圖教學。商家檔案跟官網兩邊的店名、地址、電話（NAP）應保持正確一致，避免使用者困惑，也有助於 Google 理解商家資料；在地排名仍取決於關聯性、距離與知名度等多項因素。

結構化資料：協助 Google 理解餐廳資訊

一般人聽到「結構化資料」就覺得很技術。白話講，它就是用機器可讀的格式，把店名、地址、營業時間與菜系等頁面上看得到的資訊標示給搜尋引擎。正確標記能協助 Google 理解內容，並讓頁面具備部分搜尋功能的資格；實際是否顯示、顯示哪些欄位，仍由 Google 決定，不能把結構化資料當成保證版位或排名的方法。

搜尋結果位置與查詢意圖都會影響點擊率。一份Backlinko 分析四百萬筆 Google 搜尋結果的研究（2025 年 4 月）也觀察到不同排名位置的平均點擊率差距。不過，一般搜尋結果與地圖區是不同介面，不能把該研究直接推算成地圖前三名的點擊分配。結構化資料的工作是提供可理解的資料，不是取得在地版位的捷徑。

餐飲業可從 Restaurant（餐廳基本資訊）及其 OpeningHoursSpecification（營業時間）開始，其他屬性僅在頁面確實呈現、且符合 schema.org 與 Google 文件時加入。Review 與 AggregateRating 必須反映網站上可見、可驗證的內容；商家自行蒐集關於自己的評價，不符合 Google 在地商家的自利評論複合式搜尋結果資格。實作前可參考：Rank Math SEO 外掛完整教學與結構化資料 Schema 標記完整教學。

信任工程：那個讓人願意走進去的理由

餐飲業的轉換，骨子裡是信任。客人要把自己一個晚上、一筆錢、跟朋友家人的聚餐體驗，交給一家他可能從沒踏進去的店。他憑什麼走進去？憑的是他在你的網站和商家檔案上，點點滴滴累積出來的那份「這家店看起來可靠」的感覺。

這份感覺，可稱為信任工程，它由三個訊號疊起來。

第一個訊號是真實的照片。不是那種去庫圖網抓的、假假的擺拍，而是你店裡真實的菜、真實的空間、真實的人。客人很敏銳，他分得出哪張是宣傳圖、哪張是真的。真實但用心的照片，比精美但虛假的圖，更能讓人放心走進去。

第二個訊號是真實的評價。把 Google 評價、媒體報導、得獎紀錄，整理在關於我們或首頁的一個小區塊。不用怕有負評，負評加上你認真的回覆，反而比一面倒的好評更可信。重點是這些評價要能被看見，而且要是真的、可以查證的來源。

第三個訊號是人的故事。誰開的這家店？為什麼開？開多久了？有什麼堅持？這些東西講起來像老套，但對「說服型」訪客（要辦聚會、要帶長輩那種）非常有效。一個有溫度的品牌故事，會讓人覺得「這是一家有人用心在顧的店」，這份溫度是冷冰冰的連鎖店給不出來的。這些故事內容，經營得好就是長期的 SEO 資產，內容寫作的方法可以照這篇來：SEO 文章寫作完整指南。

還有一個容易被低估的信任細節：線上跟線下要一致。客人在網路上看到的照片、讀到的故事、感受到的氣氛，走進店裡要能對得上。如果網站拍得像高級餐廳，現場卻是另一回事，那這份信任會在客人坐下來的那一刻崩塌，而且他不會再來，也不會推薦朋友。網站該做的，不是把你的店放大、美化到認不出來，而是把你最好的那一面，誠實地放大。

上線前的 12 項檢查表

網站做好，不等於可以上線。在對外宣告「我的餐飲官網上線了」之前，這 12 件事要一條一條確認過。很多看起來是小事，但少了任何一條，都可能在你最需要客人的那一刻，悄悄把客人漏掉。

1. 網址與永久連結：網址買了、設好，文章頁的網址結構（SEO 友善的固定網址）設對。參考：網域申請購買全攻略、WordPress 永久連結設定教學。
2. SSL 憑證：整站走 https，瀏覽器不能跳出「不安全」。這會影響信任和排名。參考：SSL 憑證完整教學。
3. Sitemap 產生並提交：讓 Google 知道你有哪些頁面要收錄。參考：Sitemap 產生與提交實作教學。
4. 提交 Google Search Console：驗證網站、看索引狀態、收錯誤訊息。參考：WordPress 提交 GSC 完整攻略。
5. 手機版實測：用自己的手機，在 4G 訊號下，從首頁一路走到訂位完成，看哪裡卡。
6. 菜單頁載入測試：在一般手機與行動網路下實測，確認主要內容能快速顯示並順暢滑動。
7. 營業時間、地址、電話一致性：官網、商家檔案、社群，三邊完全一樣。
8. 聯絡表單測試：自己送一筆，確認進得了你的信箱。參考：Contact Form 7 完整教學。
9. 訂位流程測試：走完一輪，確認時段阻擋、通知信都正常。
10. 結構化資料檢查：用官方的 Rich Results Test 跑一遍，看有沒有錯誤。
11. 備份機制：裝好備份外掛、設好排程，確保哪天出事能還原。參考：WordPress 備份外掛推薦。
12. SEO 基礎設定：標題、描述、麵包屑、索引設定全部看過。完整的地圖在這篇：WordPress SEO 終極優化指南。

預算與委外：錢花在哪裡最划算

錢，是很多餐飲業主最焦慮的一題，卻也最常被擺到一邊。這一題最常被問到的版本是：「自己架好，還是找設計公司做好？」實務上的答案是：看你打算投入多少時間、和你對這家店的長期期待。

如果你自己或店裡有人對電腦不害怕、願意花一兩個月摸熟一套頁面編輯器，自己架絕對是長期最划算的。一來成本最低，二來你會因此擁有「自己改菜單、自己上活動、自己發故事」的能力，這個能力對餐飲業的長期行銷，價值遠超過省下來的錢。完整的費用拆解可以參考這幾篇：網站架設費用完整解析、WordPress 架站費用全面拆解。

如果你完全沒時間、也不想碰技術，那就委外。但委外有委外的地雷：報價從幾萬到幾十萬都有，交付的東西品質差異極大，很多業者付了錢拿到的還是一個不能自己更新、沒做 SEO、沒做手機版的半成品。委外的重點，不是找最便宜的，是找一個願意把流程講清楚、把原始檔案交給你、把 SEO 基礎一次做好的對象。怎麼跟設計公司合作才不會踩雷，流程可拆成五個階段，每個階段的把關閘口都已寫下來：網頁設計外包流程拆解。報價行情跟議價空間，則可以對照這篇：網頁設計費用全公開。

不管哪條路，有一個觀念要記得：網站不是一次性的支出，是長期的資產。把它當裝潢費，一次性砸下去就放著不管，它會隨著時間貶值；把它當店租，每個月撥一點時間和預算去維護、去更新內容，它才會像滾雪球一樣，持續幫你把客人帶進門。

現在輪到你動手了

餐飲網站設計，說到底就是一件事：用「那個站在路口滑手機、肚子正餓的人」的眼睛，重新看你的每一個頁面。他需要的不是絢麗的動畫，而是兩秒鐘看到一張會流口水的菜、一個清楚的價位、一顆能立刻訂位的按鈕、一個能帶他走到的地址。你給得起這些，他就走得進來。

給你一個六步走的行動方案，從今天就能開始：

1. 盤點你現在的網站：用手機打開，計時從首頁到看完菜單、找到地址，要幾秒、卡在哪。
2. 殺掉 PDF 菜單：把它重做成 HTML 結構化菜單，菜名價格描述都是文字。
3. 確認你的 Google 商家檔案：營業時間、照片、菜單連結、評價，全部填滿並定期更新。
4. 把菜色照片統一規格：同一個背景、同一個光線、同一個角度、同一個裁切比例。
5. 把速度壓下來：圖片壓縮、轉新格式、開延遲載入，把菜單頁載入時間壓到兩秒內。
6. 加一顆清楚的訂位 CTA：菜單頁旁邊、首頁 Hero、聯絡頁，三個地方都放，讓客人隨時點得到。

這六步，沒有任何一步需要砸大錢。它們需要的，是你願意用客人的眼睛，把網站當成你店門口那個帶位員來認真訓練。把它訓練好，它會一天 24 小時、不喊累、不休假地，幫你把經過的每一個路人，變成走進來的客人。

如果你想要的不僅是自己動手，而是有人幫你把整個餐飲品牌從網站、在地搜尋、到內容資產一次想清楚、做到位，Whoops 可以陪你一起把這幾塊做起來。先把上面那六步做完，真的卡住了再來找我們談也不遲。