主題

巴哈小屋設計佈景新手入門＆自己製作上的心得（新版）

法蘭克 Wei | 2023-08-08 17:19:24 | 巴幣 1004 | 人氣 324

其實個人有想要弄巴哈小屋佈景許久了
但至最近才比較認真得弄了一個大概
前後查了些資料了解過後才著手開工

真的有點回到以前弄網誌那種感覺 XD

雖然巴哈已有些教學，看過後自己也能用的七七八八

不過個人製作完成後還是想要來分享一下一些心得
以下皆以個人自身小屋／巴哈為範例

起始改動位置要從個人小屋的位置找（點入巴哈右上角的自己大頭）

點入個人小屋後會在首頁，在最右邊的 ⋮ 點下去

接下來點入第三個選項：更換佈景

點入後會先到佈景大廳，左邊會出現各種巴友製作好的佈景，右邊被裁掉的部分是套用後的小屋預覽畫面

如果沒有想要特別想要將自己小屋置換成特別的圖，那其實到這階段
選出一個自己喜歡、巴友設計好的主題佈景，最後點右下角的套用就可以了

但如果是要比較深入、想把小屋放些佈景大廳所沒有的圖那可以考慮繼續看此文

想自行設計的話，則是在佈景大廳右邊一格的「設計佈景」

到設計佈景後，並且個人點開主題圖片時的畫面

當中的初始模式滿重要的，可視為快取自個人小屋的預設（白底）／闇黑模式（黑底）

跟使用者看巴哈的概念差不多，選擇上看個人習慣哪種模式，可以減少一些設定

設計／製作巴哈小屋佈景上，實際能放三個圖的區塊：
其實巴哈有很貼心的設計，當游標指到該圖一旁的？時
就會將該區域上一層紅來標示位置，但為了個人說明方便還是都在此文列出

1.上方的小屋主圖

主圖是必放、也最自由切換的部分

2.個人小屋的底圖

篇幅最大、佔滿整個頁面，但是一定顯示在最底層

3.發文&主題區塊的底圖（位於區塊框線內）

在首頁時中間各區塊會有一小格空白切開圖

以下是個人製作上的一些心得分享：

小屋主圖雖然點入小屋時置於最上方、也必定看的到

但左下方會被勇者造型遮掉一部份
且大概率就是看幾秒鐘的事情就往下拉了，因為使用者主要還是看小屋的內容
有點浪費了它在三者中能以最高畫質輸出的特性（雖有 1250*375 pixel 的限制）

巴哈也有方便使用者的設定，圖丟上去會讓設計者自行選擇該圖要展示的範圍

不過如果巴友懂一點平面設計軟體的話，個人還是建議將圖放上時就用成剛好的大小
直接眼見即所得，不用經過巴哈的裁切與縮放，不然可能會有大小沒算好
導致裁出來的圖被經過縮放而糊掉或被擠壓成粗糙的畫質

其中有個特色是，此為最好置換的一張圖

就算套用了其他版面，只要在個人小屋時將滑鼠指到主圖上方，右下角就會出現編輯圖片的按鈕

小屋底圖的話應該是最好發揮的，篇幅大又會重複出現

但有檔案必須小於 300 KB 的限制（若檔案超過將會被自動壓縮）

以我自己嘗試過程中發現，我自繪的 1920*1080 的圖為例
輸出成 JPG 大概要降到 8 的品質才能低於 300 KB，如此多少會影響一點畫質
建議能自己在外頭用軟體／線上壓縮就將圖的大小至 300 KB 以下比較好

以我製作過程的輸出為例：

當然圖的檔案大小成因有很多，這是我能給出的約略值

假如對底圖非常滿意，可以將區分用色塊的透明度拉高拉滿、不放主區塊的圖
如此一來可以造成近似簍空的效果、好呈現出整個底圖
但是此種方式建議底圖顏色不要太花，或是要做些壓暗或打淡，不然會影響到閱讀

將主區塊底色的透明度拉滿，會有簍空的效果、僅留下一點格子的陰影

當然怕底圖影響閱讀的話，也是可以不要將透明度拉到底

另一種方式可以走裁切好、銜接後可重複、小張的圖，透過重複的方式
堆疊出整個背景圖，如此一來篇幅較小但至少可以保持畫質
（筆者個人就採用此種方式）
此方式也是建議要比較輕鬆簡易、不要太花、不然看起來比較容易…煩躁？

簡單的底圖或花紋都行

再透過重複的方式覆蓋滿整個頁面

而最後發文主題的底圖就普普，雖與底圖同樣有檔案必須小於 300 KB 的限制
如果檔案大於 300 KB 一樣也會受到壓縮
但本身佔的位置就小、可以用成不錯畫質的圖
主要問題是會與文字互相干擾的這點，造成實質能發揮的空間不多

大概只有右下的空間方便放圖（紅色是我個人畫出比較不會蓋到字的部分，並且往下延伸）

這部分就很看巴友斟酌了，也跟個人的撰文習慣也有關係，開頭字少的話干擾就少

其實如我個人所示，我的圖已經讓一部份的文字不好閱讀了

也有在考慮要改的話該如何調整，理想還是讓美觀與閱讀上達到一個平衡

個人實際測量一篇文章佔的高度（詳細檢視模式下）

理想是一張圖剛好可以對應到一個文章，但礙於上面的搜尋空間並不實用

這部分有個小撇步，就是不需要將圖做滿整個寬度，圖之下再搭好底色就好
兩者作用起來的效果與實際範圍：

右邊是實際的圖，左邊是底色範圍

實際的圖是這樣，如此一來可以省掉不少的檔案大小

當然此方式就受限於巴哈所能用的顏色當底色

色碼表左邊點下去就可以自選顏色了，而更多顏色點下去就會看到此圖右下列出的更多顏色

其他選項就是如文字顏色、篇幅小小格的按鈕顏色、透明度細部設定…等

這部分個人就不特別展開講了
如果圖有搭好預設／闇黑模式的顏色配置其實不改也沒什麼問題
主要概念還是字蓋圖、圖不壓字好避免不好閱讀的問題

以上通通都設定好後接著從預覽畫面的下方

可以看電腦、平板、手機三者上的顯示畫面確認一下呈現的效果

確認都OK後，最後再點右下角的套用就完成設計佈景了
出來看就能看到自己的小屋被更換成自己設計好的佈景囉

而如果對於自己設計的佈景有自信、想要更加公開、供其他巴友使用

則可以進一步用「投稿」至佈景大廳
不過多半要更繁複、完善的設定，貌似不能跟初始模式的相同
（預設模式與闇黑模式，包含文字顏色…等，通通要另外設定一遍）

PC最後的顯示上當然還是與每個使用者設定的螢幕解析度有關

但這部分就不是從巴哈能夠控制的，就不細講

不過隨著科技日新月異，大家的解析度普遍都會往上提升
而然巴哈對小屋圖的限制相對上就更顯卓
以我個人而言，平常輸出一張高畫質的 1920*1080 的 JPG
隨隨便便也有幾 MB，有個 300 KB 的限制真的是拳腳難伸……
也難怪據個人經驗，時不時就會看到一些…畫質不太好的小屋版面圖

其中是知道機房的儲存空間是有限、圖檔大小也與網頁的讀取速度有關
可能是巴哈想要兼顧每個使用者閱覽上的品質所做的決策
這點也難說什麼，但願此篇能夠幫助到想要美化、經營小屋的各位巴友了