精選作品
B2B
倍疆科技提供流體控制和真空技術專業服務，我們擁有各種先進的產品和解決方案，我們的產品範圍包括質量流量計、真空幫浦、真空計、真空元件、真空系統等。
這是一個專為 B2B 設計的 詢價 多國語系 企業網站。我們提供直覺式的用戶體驗，讓客戶輕鬆瀏覽並 詢價 各種產品。 多國語系 讓全球客戶能夠以他們習慣的語言使用網站，擴大了企業的國際市場影響力。透過網站，客戶能夠方便快速的管理 詢價 清單，填寫簡單的表單提交詢價需求，實現高效率、全球化的商業合作。
一、倍疆科技 網站建置 專案需求
1. 專案背景：
建置具有產品 詢價 功能和 多國語系 支持的 B2B 企業網站，滿足市場需求，提高客戶滿意度，以及拓展國際市場，
並將原有 joomla3.x 的資料移轉至 joomla4.0 上。
提供專業的公司簡介、產品資訊 、服務介紹、 最新消息和聯絡方式等功能，
並營造簡潔、專業的設計風格，以紅 色為主，藍色和白色為主要配色。
透過清晰易讀的內容呈現，確保客戶能夠全面了解公司的產品和服務。
2. 專案目標：
2.1 產品 詢價 功能：
客戶在線上直接 詢價 的功能，包括快速選擇產品型號、數量和其他相關規格。 提供用戶可追蹤詢價進度和歷史 詢價 紀錄的功能。
2.2 多國語系：
包括但不限於英語、中文等主要語言，日後也可繼續擴充。
2.3 多國語系 關聯：
提供用戶在不同語言之間輕鬆切換頁面的選項，保持用戶在切換語言後的連貫體驗。
保持產品 詢價 功能在各語言版本中的一致性，使用戶無論使用何種語言都能順暢使用 詢價 功能。
2.4 跨平臺兼容性：
網站能夠在不同設備和瀏覽器上正常運行，包括桌面、平板和手機等。
二、網站建置 網頁設計 客戶好評
為了保護帳號資訊的隱私，以下圖片已進行了修改。
三、倍疆科技 網站google檢測
1. Accessibility 無障礙：
我們希望讓倍疆科技的網站容易使用，不論是對視覺障礙者、聽障者還是其他特殊需求的使用者。
2. Best Practices 最佳實踐：
我們追求 企業網站 的效能、安全性和使用者體驗達到最佳水準。
Line、Facebook 或其他社交媒體平台的api及外部連結會影響網站的效能和使用者體驗，可能導致網站載入速度變慢，或者在某些情況下阻止內容的正確載入。
這些因素可能會導致網站不符合「Google 的最佳實踐」，但是連結社群平台卻能增加網站可信度的權重及提高SEO的排名。
3. SEO（基本搜尋引擎優化建議）：
我們致力於 企業網站 的網頁容易被搜尋引擎找到。
為達到這一目標，需不斷更新網頁內容，讓網站符合基本搜尋引擎優化建議，這樣更多人可以找到相關資訊，提高網站的曝光度。
四、倍疆科技 網站建置 規格
1. 網站前端
(1) 響應式網頁設計：
- 提升行動友善性：
多方位螢幕瀏覽的完美適配跨平臺友善環境搭建：
採用RWD（響應式網頁設計）技術，特別針對主流行動裝置進行優化，包括Chrome、FireFox、Safari等主要瀏覽器的最新版本，同時考慮市場上主流的Android和iOS手機介面。 - 融合最新技術的響應式設計：
專為主流行動瀏覽器進行最佳化，在各種裝置上都能提供最佳的用戶體驗。透過響應式網頁的設計，自動適應不同螢幕解析度，讓網站內容無論在何種尺寸的螢幕上都呈現得宜。 - 自動調整版面配置：
根據設備螢幕大小智能調整版面配置，讓網頁內容始終保持易讀性和視覺吸引力。這使得用戶無論使用桌面還是手機，都能輕鬆瀏覽並享受一致的用戶體驗。 - 多螢幕解析度相容：
我們嚴格遵循響應式設計原則，讓網站在各種解析度下皆能正確呈現。
(2) 客製化網頁版型設計：
設計理念：科技專業與創新的融合
呈現倍疆科技的專業和創新能力，吸引潛在客戶和合作夥伴。
透過設計元素表現先進技術感，反映倍疆科技在行業中的領先地位。
資訊豐富與有用：
提供豐富有用的資訊，讓訪客深入了解公司的產品、服務、案例、新聞等。
以增加信任感和認同感為目的，使訪客能夠迅速理解倍疆科技的實力和價值。
易讀性及導覽性：
使用清晰版面、粗體字型、分割畫面和適度留白，提升內容易於閱讀和導覽。
運用設計原則使網站呈現直覺式的導覽，提升使用者體驗。
視覺元素的運用：
利用動畫效果、影片、圖示等視覺元素，增加網站的活潑感和吸引力。
展現倍疆科技創意和活力，吸引用戶的注意力，使網站充滿生機。
(3) 網站切版：
所有設計頁面製作含基本SEO設置
響應式切圖，動態效果實現
使用最新語法，依CSS+DIV+HTML網頁格式版面切版
符合HTML標準：通過國際組織 W3C 提供的HTML 檢測工具檢測
符合CSS標準：通過國際組織 W3C 提供的CSS 檢測工具檢測
依google搜尋引擎SEO指南優化網站編寫
首頁：
產品分類頁：
產品頁：
產品詳情頁：
詢價清單：
2. 企業網站 建置 模組外掛設定
(1) 廣告輪播/圖片輪播/首頁輪播圖：
- 首頁輪播banner功能強大，可以自訂輪播數量，更便捷的推廣相關活動訊息。包括頂級分類頁、內頁清單頁等多個頁面加入圖片輪播，推廣效果更好。
- 可由後台自行上傳輪播圖片，可以設定超連結、輪播秒數、各種特效參數。
- 輪播不限張數，建議4-5張左右
- 益盛科技設計首頁形象大圖Banner２張
- 首頁輪播圖滾動，點擊輪播圖可跳轉對應的文章連接
- 可拖拉排序輪播照片
- 管理者由後台可新增/刪除/修改圖片
- 可開啟新頁面連結新網站
- 可由後台決定是否啟用照片
- 網頁動畫或互動式內容採用開放標準，確保使用者可跨瀏覽器瀏覽
(2) 最新消息：
- 以日期、主旨逐一條列，以表格方式展現，可分類，種類項目需可於後端增刪；
- 前端點入頁面後可以觀看靜態文字圖面展示。
- 列表顯示
- 無限分類及內容頁
(3) 智慧搜尋：
整合文章和產品搜尋，提供簡單的用戶體驗，無需切換搜尋框即可找到所需內容。
提供搜尋建議字詞讓搜尋結果更迅速有效呈現。
統計搜尋和索引數據功能助於了解用戶行為和內容熱門程度，支援更佳優化決策。
(4) 底部導覽列
- 網頁選單、版權宣告、聯絡資訊
- 導入資訊式頁尾（Informative Fat Footer）、巨型導覽選單（Mega Menu），以提升網站操作便利性及增加視覺美感。
(5) 影片展示：
- youtube嵌入
- 提供更豐富的內容體驗，提高網站吸引力和可信度，並提供更好的搜尋引擎可見性。
(6) 網站地圖 網站導覽：
- 安裝 Site map 功能，再將頁面提交給 google。
(7) 系統流量分析
- 流量統計
- 網站導入流量統計工具 GOOGLE Analytics
- 依日週月、來源、關鍵字、國家別、瀏覽內容…等詳細報表分析。
- 重要網頁內容流量分析報表。
- 內容流量來源分析報表（直接流量/推薦流量/搜索引擎流量）。
- 網站內容流量來源國家城市別/網路位置等分析報表。
- 網站被哪些關鍵字流量從哪些搜索引擎而來之分析報表。
- 上述報表需依「每日/週/月/季/年」提供。
(8) 教育訓練
- 網站資料維護 (一般使用者) 1場次2小時教育訓練，輔導使用者進行上線操作。包括後台管理及維護，簡易圖文網站頁面排版等。
- 以實作教學輔導網站管理人員熟悉改版後網站之前、後台管理作業及新增之系統使用操作。
- 線上教材：針對管理平台各項功能，且製作系統操作手冊電子檔。
(9)服務諮詢1年
- 網站上線，如有操作或技術問題，免費提供客服諮詢服務。
(10)網頁保固1年
- 於正常操作之狀態下所發生前端版面瀏覽之異常或錯誤情況，負責免費之相關維護工作（自行提供主機者，如因主機無法相容而導致錯誤者不在此限）。
(11)資安稽核
- 後臺位址加密
- 後臺登錄設置，安全加密
- 隱藏CMS標籤
- 網站防火牆安裝
(12) 網站備份
- 全站備份功能
- 立即備份
- 備份管理
(13) SEO優化
- SEO(設計中植入SEO概念)
- 網站關鍵字（Metadata）設定：在一般情況下使用者是看不到的，它的作用在於讓各大搜尋引擎能夠更容易地依照使用者輸入的關鍵字來找到本網站。
- 頁面header W3C標準
- 頁面header meta標籤（頁面keywords，description管理/ 定義）
- 後台Title、Keywords、Description管理
- 自訂網站名稱
- 優化網站速度：壓縮 & 合併 JS 8. 優化網站速度：壓縮 & 合併 CSS 9. 優化網站速度：開啟GZIP
- 網址靜態化
- 建立「階層連結清單」導覽（麵包屑）
- 頁面title管理/定義
- 郵件自動回覆
- 圖片alt, title 屬性 h1,h2 標籤使用
- 404頁面
(14) 一頁式網頁編輯系統：
拖曳+預設版型+所見及所得
可做廣告A/B測試，頁面無上限
(15) 舊站資料移轉：
Joomla3.x網站資料移轉至joomla4.0
(16) 聯絡表單
表單設計填寫
網站後台可記錄
Google Map嵌入
確認送出至指定信箱
五. 產品目錄 詢價 清單
(1) 產品目錄頁面：
主分類頁面 -> 產品 -> 產品介紹頁：
產品標題與照片：
精美的產品標題搭配高品質照片，呈現產品外觀。
產品說明：
提供清晰而有深度的產品說明，讓客戶深入了解產品的特色與應用場景。
產品規格：
明確列出產品的技術規格，協助客戶確定是否符合其需求。
產品功能介紹：
生動展示產品的關鍵功能，使客戶迅速了解產品的價值。
產品配件或瀏覽其他產品：
提供相關配件資訊，或引導客戶繼續探索其他相似產品，滿足更多需求。
(2) 詢價 清單（Inquiry Cart）：
這是一個主要用於 B2B 企業網站的功能，旨在簡化客戶與公司之間的 詢價 流程。
增加產品：
客戶輕鬆點擊產品的詢價按鈕，快速將感興趣的產品加入「詢價清單」。
管理產品：
客戶輕鬆查看及管理「詢價清單」，包括修改數量、刪除不需要的產品或更新相關訊息。
送出 詢價 ：
在瀏覽完畢後，客戶透過填寫簡單表單，將詢價需求直接送達公司的業務團隊。
(2.1) 詢價 清單的核心功能：
即時管理：
客戶可隨時追蹤和管理詢價清單，確保資訊的準確性。
便捷修改：
提供客戶便捷的修改選項，包括數量、產品規格等，以滿足個性化需求。
簡易諮詢：
客戶填寫表單，迅速且簡單地送出詢價需求，節省時間成本。
功能優勢：
「詢價清單」不僅有助於客戶有效管理其需求，還提供了一個直接與潛在客戶互動的機會，促進業務機會的產生，同時強調了我們對客戶需求的敏感性和反應速度。
六. 網站後端 管理系統
(1) 自主管理功能：
如會員增刪管理、照片影片文字檔案管理
(2) 文章管理系統：
- 後臺可增加、刪除、修改文章，文章分類，文章列表
- 後臺支援文章自動發佈
- 所見即所得編輯器：與Word相容編輯文章區
- 支援圖片及Html語法
- 檔案內嵌
- 支援分類瀏覽
- 支援被搜尋及生成RSS
- 每篇文章可建立顯示關鍵字/隱性關鍵字/建立文章交叉關連性
- 支援影片嵌入（如youtube..等）
- 可自行編寫說明文案，文案與影片對應
(3) 關鍵字頁籤管理：
- 關鍵字資料庫建立
- 於後台自建關鍵字資料庫
- 站內項目可選擇相關關鍵字
- 前台輸入相關關鍵字即可符合搜尋內容
相關文章：
【B2B 網站管理 完整教學】多國語系 、 產品展示 、 詢價清單
B2B 企業網站 建置教學 ：全方位 產品目錄 、 詢價清單 與 網頁設計 說明
【教學】網頁設計 頁面編輯器 Page Builder ：無需寫程式碼：輕鬆上手
網頁設計 教學：打造完美的 JOOMLA 和 WORDPRESS 網站
【 JOOMLA4 教學】無痛建立 多國語言網站 ！全球化 網站建置 ！
網頁設計 問與答：
網站建置 報價相關 https://des13.com/faq/quote.html
網站建置 技術相關 https://des13.com/faq/webtech.html
購物網站 網路開店 https://des13.com/faq/e-commerce.html
B2B形象官網建置 https://des13.com/faq/b2b.html
網站升級維護 https://des13.com/faq/upgrade.html
推薦閱讀：全後台模組化形象官網
簡易電子書下載：一頁式網頁設計電子書
如果您喜歡我們的文章，歡迎分享！也歡迎查看我們的其他文章。如果有任何疑問也歡迎加line和我們聯絡
全後台模組化形象官網，符合各式商業模式與需求，請參考：https://des13.com/service/rwd.html
Written by Ring
作者：益盛科技 專案經理
通過Google Ads-Measurement Assessment
15年 網站專案管理及人員管理實務經驗。
具網站美編企劃繪製能力
具多媒體網頁設計與 RWD設計之實務經驗
