最近這段時(shí)間，一直在密集更新我的詢盤站點(diǎn)。得益于內(nèi)容小伙伴的工作加持，進(jìn)展一切順利并且速度也遠(yuǎn)超預(yù)期。初版更新便有近 40 多個(gè)頁面，算得上是我做過的一個(gè)非常專業(yè)的垂直性網(wǎng)站。

那今天這篇文章就來分享一下，我在搭建網(wǎng)站時(shí)，對于模塊化、標(biāo)準(zhǔn)化與速度優(yōu)化的一點(diǎn)經(jīng)驗(yàn)。

先說第一點(diǎn)，網(wǎng)站搭建的模塊化。

之前的文章，我會(huì)時(shí)不時(shí)提及素材庫與案例庫的收集與整理，其主要的目的還是為了擴(kuò)寬自己的素材面。比如看到好看的頁面設(shè)計(jì)或者優(yōu)秀的功能設(shè)計(jì)，便將其分門別類的收藏起來。

當(dāng)這些信息達(dá)到一定的量之后，便會(huì)發(fā)現(xiàn)絕大多數(shù)網(wǎng)站都是大同小異的，無非都是一些基礎(chǔ)功能塊的排列組合。如果非要說有差異的話，可能也就是主題配色或者 UI 圖標(biāo)，存在一點(diǎn)小的區(qū)別。

那從這個(gè)角度出發(fā)，在搭建一個(gè)新站點(diǎn)之前，我們需要準(zhǔn)備的無非就是幾個(gè)功能型模塊，然后在不同的頁面之間排列組合即可。比如下面這個(gè)圖文模塊便是我經(jīng)常使用的一個(gè)，進(jìn)可攻退可守，真的非常好用。

除了頁面的模塊化外，標(biāo)準(zhǔn)化也是我們需要考慮的事情。

這里的標(biāo)準(zhǔn)，主要指的是頁面的一些設(shè)計(jì)細(xì)節(jié)。比如每個(gè)模塊的內(nèi)外邊距是多少、圖片的具體尺寸是多少、文字的字體呢、字體大小呢，等等等。

除此之外，還需要考慮的一個(gè)標(biāo)準(zhǔn)便是多端的自適應(yīng)。雖然現(xiàn)在很多主題與頁面編輯器都已經(jīng)支持，各個(gè)客戶端的展示自適應(yīng)。但是如果想將頁面效果做的好一點(diǎn)的話，最好還是在建站之初，就將這些標(biāo)準(zhǔn)明確下來，后續(xù)在搭建網(wǎng)站時(shí)，按照標(biāo)準(zhǔn)執(zhí)行就好了。

功夫體現(xiàn)在細(xì)處，這句話并非沒有道理。

其實(shí)將上面兩個(gè)點(diǎn)做好，網(wǎng)站的速度優(yōu)化就是水到渠成的事情了。

首先要說明的一點(diǎn)就是，為了最大限度的降低網(wǎng)站資源的請求數(shù)量，我現(xiàn)在搭建網(wǎng)站時(shí)，都已經(jīng)不使用重型的頁面編輯器了（比如 Elementor）。轉(zhuǎn)而選擇了 WordPress 自帶的古騰堡編輯器，然后再搭配一款編輯器的增加插件。

可能偶爾有些功能，使用古騰堡做不出來。但是沒關(guān)系，我的一般做法是使用 ChatGPT 寫出前端代碼，然后置入進(jìn)去。這種方法，有興趣的朋友可以試試，其實(shí)我也不懂前端，但不妨礙 ChatGPT 懂。

其次，從布局設(shè)計(jì)層面做好圖片的處理，能不用全寬輪博圖就盡可能不用。這個(gè)點(diǎn)在前幾天的文章里，有分享過我的一些做法，當(dāng)時(shí)也是為了解決新網(wǎng)站搭建過程中碰到的一點(diǎn)問題。

如果說對于速度優(yōu)化，還有加上一點(diǎn)的話，那就是盡量少用插件。

我現(xiàn)在對自己的要求是，任何網(wǎng)站安裝的插件數(shù)量，都不能超過 10 個(gè)，盡可能保持在 8 個(gè)及以下。至于為什么這么做的原因，無非是盡可能給網(wǎng)站提速做一點(diǎn)點(diǎn)優(yōu)化而已。其實(shí)對于插件這塊內(nèi)容，可以寫的東西就太多了，但今天就不深入去聊了。

總結(jié)下，網(wǎng)站搭建其實(shí)沒什么難的，主要還是得多動(dòng)手多犯錯(cuò)。