從過去到現在，設計師對方位性問題格外敏感，甚至輕微強迫症。如偏好黃金比例卻忽視用戶視覺感官體驗。其實法則需彈性使用，生搬硬套適得其反。AnyForWeb 搜集 9 個值得借鑒的圖文混排案例，供評論欣賞。

1. 懸停互動讓圖文生動切換

AnyForWeb 為 Nature House 設計的圖文交錯新形式：每個字母/小圖片隨鼠標懸停產生效果，由圖變字。不僅讓圖文搭配更生動，也增加瀏覽趣味性。

2. Metro 風格配透明潑墨色塊引導視線順序

The Tech Beach 背景用 Metro 風格，怕太規整？設計師將高透明度潑墨色塊放頁面中間，文字重點與 Logo 浮在色塊上方。這樣圖文搭配模式讓用戶自然領會瀏覽先後順序。

3. 中央留白激發好奇心 + 幽靈按鈕搶眼

Anyi Lu 巧妙在於留白位置：中間留白看似將文字圖片一分為二，但心理角度更激發用戶連結圖字聯系的好奇心。單色底色襯托下，幽靈按鈕更搶眼，利於點擊。

4. 文字圖片徹底混合 + 星空色字體營造神秘感

Moon Camp 徹底混合文字圖片。成敗不只取決於佈局，色彩搭配關鍵。網頁昏暗色調，設計師選星空色作字體顏色，與風格吻合；文字不規則排列增添神秘感。

5. 紅色框聚焦視線 + 色塊圖形化解圖片不足

Zizzi Ristorante 首眼略凌亂，但視線最終聚集到枚紅色框內容。佈局無過人之處，但發現圖片占比很少，常規做法會單調，設計師用色塊/圖形巧妙化解，無形中完成圖文完美合作。

6. 視線引導形成默契邏輯：人物看向文字流向

LUKE BEARD 網站幾乎無佈局：左文字右圖片。但小設計讓頁面精致。圖片人物視線向文字流去，沿視覺流向排布信息是國外慣用手法。圖片引導用戶看文字，兩者形成默契邏輯關係。

7. 對比佈局法：海天色彩對比烘托中央文字

ZULU & ZEPHYR 用對比佈局：大海天空色彩對比，互相烘托增強效果，使中央文字引起注意。用圖襯托文字，畫面充滿韻律。

8. 雙圖層疊加：若隱若現或是設計重點

Tomas Jasovsky 圖文似置身兩個圖層，若隱若現內容或是設計師想表達重點。

9. 雙向平衡感讓用戶心平氣和閱讀

M-Power Yoga 圖片帶來垂直水平雙向平衡感，讓用戶更心平氣和認真閱讀文字。

10. 對稱神秘感 + 居中文字最佳瀏覽體驗

Segno 網站無論圖片內容或色調都充滿神秘感。對稱設計討巧，文字居中給用戶最佳瀏覽體驗。

網頁設計中文字與圖片佔比大，但相近信息量呈現效果卻大相徑庭。如何將內容元素安置在最合適位置，或許是主要原因。