視覺引導番外篇——如何搭建視覺骨架？

關于網站規劃中的視覺引導真的很重要，想要做一個能招引用戶眼球的網站，你真得在這上面花功夫，否則你的網站規劃出來也軟塌塌沒“骨感”。
網頁規劃也有所謂的支撐其視覺效果的骨架，這個骨架在前期的網頁規劃的視覺上是非常明顯的。

跟著網頁規劃的發展，其骨架也慢慢漸隱，但它仍然發揮著支撐起整個視野結構。這兒，有人會與柵格體系聯系起來。網頁的柵格體系更多發揮的是對齊元素的效果，而骨架的功用會更加籠統。
頁面規劃的骨架，針對的是每一頁面的骨架。每一個網站都會有不同的頁面，咱們會把頁面分級為主頁——二級頁面——三級頁面。一般來說，主頁運用一個骨架，二級頁面、三級頁面也分別有一個骨架。主頁的骨架有時還會依據分屏展現的不同展現不同的骨架款式。但不管有多少改變，一個網站的諸多頁面的骨架之間，都會存在一種內涵的視覺一致。
主頁的視覺骨架尤其重要，由于主頁承擔著網頁的第一印象，還主導著整個網站的風格方向，因而確認好主頁的視覺骨架，是規劃開始最難清晰的問題。很多網頁規劃師在規劃開始所消耗最多時間，用于實驗各種頁面版式的類型以期最完美的效果展現，而事實上，最完美其實是個偽出題，在有限的時間內，你需求做得便是找好自己的表達目標，每個頁面設置好一個視覺焦點，依據焦點來表達你的重點內容。換句話說，你最希望用戶了解什么？這個問題的答案應該是要無比清晰的在大腦中隨同規劃全過程。
十字準星式：瞄準等待
人的視野總是集中在頁面中心，因而將焦點設置在中心方位最迎合視野的做法。例如將網站的簡介放置于頁面中心，為了讓頁面更豐厚，能夠添加大圖的背景加強表達的維度。十字線條通過的地方便是視野引導的途徑，因而需求在線條的方位放上重要的元素。中心的方位其實也是一個等待點，瞄準視覺等待點，對規劃師來說最大的便利便是省力。

不管網頁的導航等其他元素放置于頁面的哪個方位（盡量環繞線條通過的方向），這兩個頁面都是歸于十字準星型的骨架結構，焦點一直位于正中，導航不管居于哪里，都歸于次要的視覺地位。

正中的地位帶來絕對的穩定感，它也是規劃師最容易做到的表達。這種骨架結構，相比照較穩定，因而在需求在細節上營建一些驚喜，來打破這種相對靜止的版式。

筆直雙欄式：雙面一體
將一個網頁分紅兩欄并不意味著均分，它們是依照筆直方向構成了兩列的不同布局。常見的的確是平均分配的體現情況，網頁的焦點內容能夠挑選任一側，另一側作為彌補。簡稱雙面一體是由于，你不能制作兩個焦點，分兩個部分，它們也應該一起營建一個焦點。

雙欄式的頁面規劃體現比較靈活，一般會有一偏倚輕重這，樣就能確立好視覺焦點，構成比照，制作情形抵觸。視覺重點在某一側，使用背景色的不同加強視覺分量的比照。

兩列縮略圖筆直排列，讓版式活躍起來的方法便是添加某一處高度的不同，強調一點細微的改變。

網格式：有序與無序
這種骨架款式一般是依據某一個網格而搭建內容，網格的體現方式多樣，每個網格都用以展現不同的內容，能夠是比較標準的網格，也能夠是參差有致……雖然每個網頁都能夠依據網格而規劃，可是網頁的體現未必要嚴格遵循網格自身。
標準的網格一般比較傾向古典懷舊，它傳遞出一種相對嚴格的次序之美。

相對有些參差變換的網格，更具現代風格，規則與反規則的交錯。

動感歪斜式：墜落的騙局
歪斜的線條容易構成動感的張力，使用這一點所構成的視覺骨架就能很好體現與“運動”“沖擊力”等動感較強的內容頁面。

斜向的頁面所制作的墜落式的沖擊力應該和配圖款式相關，因而對慎選斜向的配圖非常重要，尤其是當大部分圖片其實都只適合正向方向的展現。
這些所謂的骨架原理在于躲藏于表層下方的最基地的視覺結構，事實上，其他的元素一般并不嚴格局限于某個區域，這就讓頂層的枝葉更加豐厚。
在咱們著手進行頁面規劃前，確認好一個視覺骨架的方向至關重要，這讓咱們并不依賴于命運去“撞”到某個好的表達，并且你也不需求單獨設定某個固定的骨架，還能夠兩兩并用，一個網站有多個頁面，多個頁面都能夠擁有不同的布局。同一個頁面，也會由于內容的不同選用不同的視覺結構表達。
下面這一個網頁里的多個頁面，每個頁面都依據不同的焦點體現形狀挑選了不同的布局，骨骼總是為內容而服務的。

跋文
一直要供認的是，內容應該是高于方式的，規劃時的任何視覺骨架都是為內容而服務的，因而內容能夠以任何外在的方式來體現。說了半天，盡管咱們都在講“顏值”，其實仍是那句“飽讀詩書氣自華”。