企業(yè)官網(wǎng)后臺怎么設計從產(chǎn)品分類、參數(shù)到資料下載的數(shù)據(jù)結(jié)構(gòu)企業(yè)官網(wǎng)開發(fā)中前臺頁面只是用戶看到的部分。對于制造業(yè)、機械設備、工業(yè)零部件、儀器儀表、新材料等產(chǎn)品比較多的企業(yè)來說網(wǎng)站后期好不好用很大程度上取決于后臺的數(shù)據(jù)結(jié)構(gòu)。如果網(wǎng)站只有十幾個產(chǎn)品用“標題 圖片 正文”的方式管理一般沒有太大問題。但當網(wǎng)站有幾十個產(chǎn)品系列、幾百個型號每個產(chǎn)品還有規(guī)格、材質(zhì)、尺寸、技術(shù)參數(shù)、PDF 資料、應用領域和多語言內(nèi)容時如果后臺仍然只是一個簡單的文章編輯器后期維護就會越來越麻煩。杭州派迪科技在企業(yè)官網(wǎng)項目中遇到產(chǎn)品數(shù)量比較多的網(wǎng)站時通常會先梳理產(chǎn)品之間的數(shù)據(jù)關系再確定后臺怎么開發(fā)。一個比較常見的產(chǎn)品數(shù)據(jù)關系可以理解為產(chǎn)品分類 → 產(chǎn)品 → 型號 → 參數(shù) → 圖片 → PDF資料 → 應用關聯(lián) → SEO字段 → 多語言內(nèi)容一、產(chǎn)品分類不要只做成前臺欄目產(chǎn)品型網(wǎng)站首先要解決的是分類。例如一家工業(yè)制造企業(yè)可能有多個一級產(chǎn)品分類每個一級分類下面又有二級、三級分類。如果這些分類直接寫死在前端頁面里以后企業(yè)增加分類、調(diào)整順序或者改變產(chǎn)品歸屬都可能需要技術(shù)人員修改程序。因此產(chǎn)品分類應該作為獨立的數(shù)據(jù)進行管理。比較基礎的分類結(jié)構(gòu)可以包含product_category id parent_id name slug image description sort_order status其中parent_id用來處理上下級關系sort_order控制排序slug可以用于生成前臺 URL。這樣企業(yè)以后可以直接在后臺增加、刪除和調(diào)整產(chǎn)品分類而不需要重新修改前端頁面。二、產(chǎn)品和產(chǎn)品分類要分開管理分類確定以后再建立產(chǎn)品數(shù)據(jù)。例如product id category_id name model slug summary content cover_image status sort_order created_at updated_at這里保存產(chǎn)品本身的基礎信息。如果一個產(chǎn)品只屬于一個分類可以直接通過category_id關聯(lián)。如果一個產(chǎn)品可能同時出現(xiàn)在多個分類中則可以建立單獨的關聯(lián)表product_category_relation product_id category_id這樣一個產(chǎn)品可以關聯(lián)多個分類一個分類也可以包含多個產(chǎn)品。對于產(chǎn)品體系比較復雜的網(wǎng)站這種方式比直接把分類寫在產(chǎn)品內(nèi)容中更方便后期調(diào)整。三、一個產(chǎn)品有多個型號時型號最好單獨管理制造業(yè)網(wǎng)站經(jīng)常出現(xiàn)一個產(chǎn)品系列下面有很多型號的情況。例如A100 A150 A200 A250 A300這些型號可能外觀接近但尺寸、材質(zhì)、壓力、性能等參數(shù)不同。如果把幾十個型號全部寫進產(chǎn)品正文前臺雖然能夠顯示但后臺無法真正識別這些型號后期也很難做篩選和查詢?？梢栽黾营毩⒌男吞柋韕roduct_model id product_id model_no sku specification sort_order status數(shù)據(jù)關系就變成產(chǎn)品分類 ↓ 產(chǎn)品 ↓ 產(chǎn)品型號以后增加 Product Finder、型號查詢或者產(chǎn)品對比功能時也更容易在這個結(jié)構(gòu)上繼續(xù)開發(fā)。四、技術(shù)參數(shù)不要全部寫進富文本這是產(chǎn)品型企業(yè)官網(wǎng)后臺比較重要的一部分。例如一個產(chǎn)品有這些參數(shù)型號A200 材質(zhì)Stainless Steel 尺寸DN50 壓力PN16 連接方式Flange如果這些內(nèi)容全部寫進正文或者做成一張參數(shù)圖片系統(tǒng)實際上并不知道哪個字段代表材質(zhì)哪個字段代表壓力。前臺只能把它展示出來卻無法真正利用這些數(shù)據(jù)。如果以后企業(yè)提出“按照材質(zhì)篩選產(chǎn)品?！薄鞍凑諌毫Φ燃壊檎倚吞枴！薄斑x擇尺寸以后顯示符合條件的產(chǎn)品?！本秃茈y直接實現(xiàn)。因此參數(shù)可以單獨結(jié)構(gòu)化管理。例如參數(shù)定義parameter id name code unit type sort_order再建立產(chǎn)品參數(shù)值product_parameter_value id product_id model_id parameter_id value這樣 Material、Size、Pressure、Connection 等參數(shù)就不再是一段普通文字而是真正可以被程序讀取的數(shù)據(jù)。前臺既可以把這些數(shù)據(jù)生成技術(shù)參數(shù)表也可以用于 Product Finder、產(chǎn)品篩選和產(chǎn)品對比。五、產(chǎn)品圖片也可以獨立管理制造業(yè)產(chǎn)品通常不只有一張圖片。一個產(chǎn)品可能同時包含產(chǎn)品主圖、細節(jié)圖、尺寸圖、結(jié)構(gòu)圖、應用圖片和包裝圖片。因此可以建立產(chǎn)品圖片表product_image id product_id model_id image_url image_type alt sort_order這樣后臺可以完成圖片上傳、刪除、排序以及圖片類型管理。其中alt字段也可以單獨保留方便網(wǎng)站做基礎 SEO 設置。如果某些型號擁有獨立圖片還可以通過model_id繼續(xù)關聯(lián)到具體型號。六、PDF和技術(shù)資料最好獨立管理很多工業(yè)企業(yè)網(wǎng)站需要提供資料下載例如產(chǎn)品目錄、Technical Datasheet、說明書、安裝手冊、CAD 文件、認證資料等。如果只是通過富文本編輯器手工插入下載鏈接產(chǎn)品數(shù)量少的時候沒有問題。但當網(wǎng)站有幾百個產(chǎn)品以后資料管理會越來越麻煩。可以建立獨立的資料表product_document id product_id model_id title file_type file_url language version sort_order status這樣后臺可以知道一個文件屬于哪個產(chǎn)品、哪個型號、什么資料類型、什么語言以及當前版本。前臺產(chǎn)品詳情頁則可以自動調(diào)用Downloads Product Catalogue Technical Datasheet Installation Manual CAD Drawing Certificate以后企業(yè)更新某個產(chǎn)品的技術(shù)資料也可以直接在后臺替換不需要重新修改頁面。七、產(chǎn)品和應用領域可以建立關聯(lián)很多制造業(yè)網(wǎng)站除了 Products還會設置 Applications。例如某些產(chǎn)品可以應用于Water Treatment Chemical Industry Oil Gas Power Generation HVAC這時候可以把應用領域也作為獨立內(nèi)容管理application id name slug image summary content然后建立產(chǎn)品和應用的關聯(lián)product_application product_id application_id這樣一個產(chǎn)品可以關聯(lián)多個應用一個應用也可以關聯(lián)多個產(chǎn)品。前臺就可以實現(xiàn)雙向調(diào)用。產(chǎn)品詳情頁自動顯示Related Applications應用詳情頁自動顯示Related Products這樣產(chǎn)品和應用不再是兩個完全獨立的欄目而是通過后臺數(shù)據(jù)關聯(lián)起來。八、SEO字段建議做到每個頁面都可以單獨管理企業(yè)官網(wǎng)后臺還應該考慮基礎 SEO。例如產(chǎn)品、產(chǎn)品分類、應用和新聞頁面都可以設置自己的 SEO 信息seo_title seo_description seo_keywords canonical_url robotsURL 也建議在開發(fā)階段提前規(guī)劃。例如/products/產(chǎn)品分類/products/ball-valves/產(chǎn)品詳情/products/ball-valves/model-a200/應用頁面/applications/water-treatment/相比完全依賴數(shù)據(jù)庫 ID 的/product?id138這種 URL 更直觀也方便企業(yè)后期管理。如果是準備長期運營的英文官網(wǎng)還需要考慮 Sitemap、Robots.txt、Canonical、圖片 ALT、頁面 Title 和 Description 等基礎設置。九、多語言內(nèi)容也要考慮數(shù)據(jù)結(jié)構(gòu)企業(yè)準備做中文、英文以及其他小語種網(wǎng)站時多語言不能只考慮前臺增加一個語言切換按鈕。如果網(wǎng)站只有中英文而且內(nèi)容非常簡單可以直接增加name_cn name_en content_cn content_en但如果以后繼續(xù)增加西班牙語、法語、德語等語言這種結(jié)構(gòu)就會越來越復雜。一種常見方式是把語言內(nèi)容單獨拆出來product_translation id product_id language_code name slug summary content seo_title seo_description產(chǎn)品的公共數(shù)據(jù)保留在產(chǎn)品表不同語言的文字內(nèi)容放在語言表中。不過多語言網(wǎng)站也不一定必須共用一個后臺。如果中文站和英文站面對的市場不同產(chǎn)品內(nèi)容、SEO、服務器部署和后期運營方式也不同可以直接把中文站和英文站獨立規(guī)劃各自使用獨立后臺和部署環(huán)境。具體采用哪種結(jié)構(gòu)要根據(jù)企業(yè)后期怎么運營來確定。十、一個產(chǎn)品詳情頁后臺可能對應多組數(shù)據(jù)把前面的內(nèi)容整理起來一個比較完整的產(chǎn)品數(shù)據(jù)結(jié)構(gòu)可以理解為產(chǎn)品分類 ↓ 產(chǎn)品 ↓ 產(chǎn)品型號 ↓ 產(chǎn)品參數(shù) 產(chǎn)品 ├── 產(chǎn)品圖片 ├── PDF / 技術(shù)資料 ├── 應用領域 ├── SEO字段 └── 多語言內(nèi)容用戶在前臺看到的可能只是一個產(chǎn)品詳情頁。但是后臺實際上已經(jīng)涉及產(chǎn)品分類、產(chǎn)品、型號、參數(shù)、圖片、文件、應用、SEO和語言等多組數(shù)據(jù)。這也是為什么制造業(yè)企業(yè)做官網(wǎng)時不能只看首頁設計得怎么樣。十一、后臺數(shù)據(jù)結(jié)構(gòu)會直接影響網(wǎng)站后期能不能擴展企業(yè)網(wǎng)站剛上線時可能只需要展示產(chǎn)品。運行一兩年以后需求很可能會繼續(xù)增加按照材質(zhì)篩選產(chǎn)品按照尺寸和壓力查找型號增加 Product Finder增加產(chǎn)品對比增加 PDF 技術(shù)資料產(chǎn)品關聯(lián)應用領域增加英文或者其他語言給不同產(chǎn)品設置獨立 SEO 信息。如果網(wǎng)站最開始所有內(nèi)容都塞進一個富文本編輯器這些功能后期再增加就可能需要重新整理大量產(chǎn)品數(shù)據(jù)。如果一開始已經(jīng)把產(chǎn)品、型號、參數(shù)、資料和關聯(lián)關系結(jié)構(gòu)化很多功能就可以直接建立在原有數(shù)據(jù)上。所以企業(yè)官網(wǎng)后臺設計不只是解決“能不能發(fā)布產(chǎn)品”還需要考慮這些產(chǎn)品數(shù)據(jù)以后準備怎么使用。最后對于只有少量產(chǎn)品的企業(yè)官網(wǎng)沒有必要把后臺設計得過于復雜。但對于制造業(yè)、機械設備、工業(yè)零部件、儀器儀表、新材料以及外貿(mào)企業(yè)如果產(chǎn)品數(shù)量多、型號多、參數(shù)多前期就有必要把數(shù)據(jù)結(jié)構(gòu)梳理清楚。從產(chǎn)品分類到產(chǎn)品、型號、參數(shù)、圖片、PDF 資料、應用關聯(lián)、SEO 字段和多語言內(nèi)容本質(zhì)上是在建立一套適合企業(yè)長期維護的產(chǎn)品數(shù)據(jù)體系。杭州派迪科技從 2013 年開始從事企業(yè)網(wǎng)站建設和系統(tǒng)開發(fā)。在產(chǎn)品型企業(yè)官網(wǎng)項目中除了前臺頁面設計也會根據(jù)企業(yè)實際的產(chǎn)品分類、型號和參數(shù)規(guī)劃后臺數(shù)據(jù)結(jié)構(gòu)、內(nèi)容管理以及后續(xù)擴展方式。對于這類網(wǎng)站來說前臺決定客戶怎么看產(chǎn)品后臺決定企業(yè)以后怎么管理產(chǎn)品兩部分需要在項目開始階段一起考慮。