網頁模塊化的思考

最近一直在做網頁模塊化相關工作，順便在這篇文章中梳理下我的一點思考吧。

其實網頁模塊化相關的工作這幾年一直有做，但是深度卻遠遠不夠。之前我的做法是通過導入一個通用的網頁模板，然后再在網頁模板上設計一些通用功能，制作成一個標準的案例站點。

等有新網站需求時，便直接將那個案例站點復制一份，簡單的替換圖片文字等基礎信息，外加制作一些特定網站上的個性化需求后便上線。

其實這種方案最大的優點便是節省時間，但缺點也同樣明顯，即搭建出來的網站都是千篇一律的，根本沒什么新意可言。

且還有一個不容忽視的網頁收錄問題，使用這種方案沒辦法解決。詳細點說就是，當你在同一個 GSC 賬號底下掛了大量的這種結構相似站點，有些頁面谷歌是不給收錄了，更別提出詞了。

當然，上面所提的這種情況只是我自己通過工作實踐而總結出來的一點經驗，并沒有什么官方出處。所以后面陸續便放棄了這種整站遷移的方案，而選擇了現在的模塊化方案。

所謂的模塊化，簡單說就是將每個網頁上所必備的模塊元素總結提煉出來，然后整理沉淀。就拿“聯系我們”這個頁面而言，幾乎百分百的網頁上都有 5 個部分，分別是頁首、自然信息、聯系表單、地址地圖，與頁尾。

那我們自然可以將這 5 個模塊分門別類整理出來，且精力允許的話，多整理幾種樣式。那下次再要創建“聯系我們”這個頁面時，從我們的模板庫里拿出相應的模塊，然后像搭積木一樣將網頁搭建好就行。

其實上面提到的這種模塊化邏輯，已經有很多現成的技術方案已經完美實現了，比如 Spectra、Elementor 這種頁面編輯器便內置了大量的網頁模塊，我們在網頁創建時只需要選擇對應的模塊就行。

但是這些技術方案也有比較大的缺陷，就是只提供了模塊的框架，并沒有提供完善的圖文內容。那我們在導入完框架后，還需要自己去寫文案、制作圖片。

所以我這次的模塊化整理，便是在此基礎上，再加上對應模塊的圖文內容填充。至于圖文從哪里來，一是 ChatGPT 等 AI 工具生成，二是自己的實際生產項目，三是那些優秀案例的信息提煉。

且 SEO 工作做久了，就會發現網站展示、模塊信息等等這些“表”的東西，所占的比重并不是那么大。對 SEO 有幫助的，或者說能提升網站排名的，一定是網站內容的深度。即網站有沒有給用戶提供不一樣的價值，網站的內容是不是有深度且有意義。

對于怎么提供價值，如何展示價值等等方面的內容，其實做好也并不難，主要還是用心研究那些優秀的行業案例。通過研究他們的頁面布局、內容方案，以及關鍵詞策略，來不斷完善自己的模塊化信息。至于具體的案例及研究方法，以后單開一篇文章聊聊，這里便不展開了。