在這篇文章中我將會分享，從業主的角度來說，你要如何可以盡快進入網站架設和思考的世界，協助你可以更快更好地跟網站設計師合作，做出一個你想要的品牌官網。
【網站結構】
🟠 網站架構
首先，我們要先瞭解自己想要的網站結構，這可以透過XMIND心智圖軟體去建置網站架構圖Sitemap，可以快速跟內部夥伴取得共識，也可以便利地跟網站設計師溝通和調整。（心智圖軟體可以在網路上下載試用版）
那麼透過這樣的網站結構圖，你就可以快速地理清自己心中想要的網站藍圖，然後交由網站設計師一步一步去完成進行。
🟠 主選單 / 下拉式選單 / 次選單
另外，在網站結構中，你也可以去思考希望讓用戶看到的主選單、主選單的下拉式選單，以及主選單上方較小的次選單，讓選單呈現較豐富的層次，也可以較便利地讓消費者尋找到相關訊息。常見的會有：品牌介紹、商品介紹、服務據點、團隊介紹、聯絡我們等。
🟠 版型挑選
現在版型的設計可以很靈活，你可以先透過 Pinterest 去找尋喜歡的版型，然後再讓設計師透過 Elementor Web Builder 去幫你編輯設計喜歡的版型。設計時通常我是會先以桌機版為主建置網站內容，然後再調整手機版的版型內容，所以在網站建置完成之後，記得不同裝置的版型都要去確認一下哦。
🟠 頁尾布局
在網站結構的部分，也要去思考你希望讓用戶看到的頁尾布局，作為消費者滑到網站最下方時，可以提供的補充資訊等，常見的會有：LOGO、介紹、主選單、主要服務、營業據點、聯繫方式、版權聲明等。
【內容版型元素】
🟠 Banner
通常是在頁面最上方呈現品牌形象畫面的全寬圖面，可以輔以一些品牌形象文字呈現在此處。
｜
🟠 ICON特色說明
透過3-4個ICON和簡短的文字，快速地點出品牌的特色和優勢所在之處。
｜
🟠 圖文區塊說明
透過圖面與文字的版型編排，去向消費者進一步敘述希望稍微詳述的內容；建議圖面檔案要使用500KB（1MB以下均可）大小左右的圖像。
｜
🟠 影片區塊
透過影片的崁入，讓消費者能沉浸式地體驗品牌的氛圍和說明。
｜
🟠 相簿
使用大量圖像或輪播的方式，呈現品牌的形象、實景畫面或用料等。
｜
🟠 腰帶
以高度較小的全寬圖像+文字，呈現腰帶的感覺，成為閱讀時視覺區塊的過場和區隔。
｜
🟠 浮動動畫
運用圖文區塊進入的浮動動畫，讓網站瀏覽呈現較為活潑的感覺。
🟠 表格
運用表格呈現較複雜的服務方案、規格或價格說明。
【功能建置】
可以建置的功能像是有：
🟠 側邊浮動按鈕
可以在螢幕的側方安裝浮動按鈕，可以成為線上客服的按鈕，也可以引導客戶到連絡表單報名登記等。
｜
🟠 購物車
安裝商品頁面與購物車功能，串接金流與物流功能，可線上下單購物，完成線上開店的任務。
｜
🟠 社群分享按鈕
可以在部落格頁面中增加FB、LINE等社群分享按鈕，讓使用者可以一鍵分享到社群上。
｜
🟠 聯絡郵件
運用表單建立聯絡我們的溝通列表。
【網路行銷串接】
🟠 SEO / Google Search Console 設定
安裝SEO（搜尋引擎優化）外掛，並到Google Search Console 設定，讓Google知道這裡有一個新網站建成了。
🟠 GA串接
Google Analytics串接，可獲得網站流量的後台數據並可用於商業或電子商務分析。
🟠 FB 像素 追蹤設定
串接FB廣告的追蹤碼，可用於投放廣告之用。
【測試流程】
🟠 網站測試
實際在網站各分頁瀏覽體驗，確認一下是否資訊充足、文字適中、內容瀏覽順暢。
🟠 版型測試
測試桌機和手機，有沒有跑版位的狀況發生。
🟠 下單測試
實際上使用信用卡、ATM、貨到付款，宅配到府、超商取貨的設定下單，看看下單與信件通知是否都正常。
🟠 按鈕連結測試
確認所有網站的內部連結點擊連結都正常。
