平淡無奇的設(shè)計終將會給淹沒,只有創(chuàng)新能屹立不倒
2021-04-06 分類： 網(wǎng)站建設(shè)
不想讓你的設(shè)計看上去軟塌塌的無骨感?重要的是摸清它的骨骼!網(wǎng)頁設(shè)計也有所謂的支撐其視覺效果的骨架，這個骨架在早期的網(wǎng)頁設(shè)計的視覺上是非常明顯的。盡管隨著網(wǎng)頁設(shè)計的發(fā)展，其骨架慢慢漸隱，但行家自有解剖眼光，看出內(nèi)在的門道，一起來學習。
設(shè)計的骨架：視覺解剖
隨著網(wǎng)頁設(shè)計的發(fā)展，其骨架也慢慢漸隱，但它依然發(fā)揮著支撐起整個視線框架。這里，有人會與柵格系統(tǒng)聯(lián)系起來。網(wǎng)頁的柵格系統(tǒng)更多發(fā)揮的是對齊元素的作用，而骨架的功能會更加籠統(tǒng)。
首頁的視覺骨架尤其重要，因為首頁承擔著網(wǎng)頁的第一印象，還主導(dǎo)著整個網(wǎng)站的風格方向，因此確定好首頁的視覺骨架，是設(shè)計最初最難明確的問題。很多設(shè)計師在設(shè)計最初所耗費最多時間，用于實驗各種頁面版式的類型以期最好的效果展現(xiàn)，而事實上，最好其實是個偽命題，在有限的時間內(nèi)，你需要做得就是找好自己的表達目標，每個頁面設(shè)置好一個視覺焦點，根據(jù)焦點來表達你的重點內(nèi)容。換句話說，你最希望用戶了解什么?這個問題的答案應(yīng)該是要無比清晰的在大腦中伴隨設(shè)計全過程。
十字準星式：瞄準期待
人的視線總是集中在頁面中心，因此將焦點設(shè)置在中心位置最迎合視線的做法。例如將網(wǎng)站的簡介放置于頁面中心，為了讓頁面更豐富，可以增加大圖的背景加強表達的維度。十字線條經(jīng)過的地方即是視線引導(dǎo)的路徑，因此需要在線條的位置放上重要的元素。中心的位置其實也是一個期待點，瞄準視覺期待點，對設(shè)計師來說大的便利就是省力。
無論網(wǎng)頁的導(dǎo)航等其他元素放置于頁面的哪個位置(盡量圍繞線條經(jīng)過的方向)，這兩個頁面都是屬于十字準星型的骨架結(jié)構(gòu)，焦點始終位于正中，導(dǎo)航無論居于哪里，都屬于次要的視覺地位。
正中的地位帶來絕對的穩(wěn)定感，它也是設(shè)計師最容易做到的表達。這種骨架結(jié)構(gòu)，相對比較穩(wěn)定，因此在需要在細節(jié)上營造一些驚喜，來打破這種相對靜止的版式。
垂直雙欄式：雙面一體
將一個網(wǎng)頁分成兩欄并不意味著均分，它們是按照垂直方向形成了兩列的不同布局。常見的的確是平均分配的表現(xiàn)情況，網(wǎng)頁的焦點內(nèi)容可以選擇任一側(cè)，另一側(cè)作為補充。簡稱雙面一體是因為，你不能制造兩個焦點，分兩個部分，它們也應(yīng)該共同營造一個焦點。
雙欄式的頁面設(shè)計表現(xiàn)比較靈活，通常會有一偏倚輕重這，樣就能確立好視覺焦點，形成對比，制造情景沖突。視覺重點在某一側(cè)，利用背景色的不同加強視覺重量的對比。
兩列縮略圖垂直排列，讓版式活躍起來的方法就是增加某一處高度的不同，強調(diào)一點細微的變化。
網(wǎng)格式：有序與無序
這種骨架樣式通常是基于某一個網(wǎng)格而搭建內(nèi)容，網(wǎng)格的表現(xiàn)形式多樣，每個網(wǎng)格都用以展示不同的內(nèi)容，可以是比較規(guī)范的網(wǎng)格，也可以是錯落有致……雖說每個網(wǎng)頁都可以基于網(wǎng)格而設(shè)計，但是網(wǎng)頁的表現(xiàn)未必要嚴格遵循網(wǎng)格本身。
規(guī)范的網(wǎng)格通常比較傾向古典懷舊，它傳遞出一種相對嚴格的秩序之美。
相對有些錯落變換的網(wǎng)格，更具現(xiàn)代風格，規(guī)則與反規(guī)則的交錯。
動感傾斜式：墜落的騙局
傾斜的線條容易形成動感的張力，利用這一點所形成的視覺骨架就能很好表現(xiàn)與“運動”“沖擊力”等動感較強的內(nèi)容頁面。
斜向的頁面所制造的墜落式的沖擊力應(yīng)該和配圖樣式相關(guān)，因此對慎選斜向的配圖非常重要，尤其是當大部分圖片其實都只適合正向方向的展示。
這些所謂的骨架原理在于隱藏于表層下方的最基地的視覺結(jié)構(gòu)，事實上，其他的元素通常并不嚴格局限于某個區(qū)域，這就讓頂層的枝葉更加豐富。
在我們著手進行頁面設(shè)計前，確定好一個視覺骨架的方向至關(guān)重要，這讓我們并不依賴于運氣去“撞”到某個好的表達，并且你也不需要單獨設(shè)定某個固定的骨架，還可以兩兩并用，一個網(wǎng)站有多個頁面，多個頁面都可以擁有不同的布局。同一個頁面，也會因為內(nèi)容的不同采用不同的視覺結(jié)構(gòu)表達。
下面這一個網(wǎng)頁里的多個頁面，每個頁面都根據(jù)不同的焦點表現(xiàn)形態(tài)選擇了不同的布局，骨骼總是為內(nèi)容而服務(wù)的。
后記
始終要承認的是，內(nèi)容應(yīng)該是高于形式的，設(shè)計時的任何視覺骨架都是為內(nèi)容而服務(wù)的，因此內(nèi)容可以以任何外在的形式來表現(xiàn)。說了半天，盡管我們都在講“顏值”，其實還是那句“飽讀詩書氣自華”。
標題名稱：平淡無奇的設(shè)計終將會給淹沒,只有創(chuàng)新能屹立不倒
分享鏈接：http://jinyejixie.com/news/106544.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供企業(yè)建站、自適應(yīng)網(wǎng)站、網(wǎng)站設(shè)計公司、做網(wǎng)站、ChatGPT、品牌網(wǎng)站設(shè)計
聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容
- 網(wǎng)站頁面布局的差異,可能會毀掉你的心血 2021-04-06
- 制作—制作常犯的十個錯誤 2021-04-06
- 讓搜索引擎認為多篇文章相關(guān)性,會提升網(wǎng)站的 2021-04-06
- 摘要將徹底成為新媒體行業(yè)的新歷史 2021-04-06
- 緊跟潮流的五種下拉菜單樣式,讓你的網(wǎng)站就是與眾不同 2021-04-06
- 學會用這些工具,升職加薪不是夢 2021-04-06
- 如何才能做出一個"牛逼哄哄"的網(wǎng)站? 2021-04-06
- 小看文字排版,那對你的網(wǎng)站來說是致命的 2021-04-06
- 網(wǎng)站運行時間久了后該如何 2021-04-06
- 真相:你與運營大師只差十招 2021-04-06
- 商城類網(wǎng)站優(yōu)惠券的靈活設(shè)計,讓你銷量嗖嗖網(wǎng)上漲 2021-04-06
- 微信公眾平臺改錯字次數(shù)已由10個提高至20個 2021-04-06
- 爬蟲的主要路徑都是通過鏈接,內(nèi)外聯(lián)制作極其重要 2021-04-06
- 應(yīng)對注冊界面用戶流失的方法原因解析 2021-04-06
- 網(wǎng)頁制作這些問題你都考慮到了嗎？ 2021-04-06
- 網(wǎng)站搜索引擎制作，可以走這4個發(fā)展方向 2021-04-06
- 聊聊網(wǎng)頁設(shè)計圖片的一些技巧 2021-04-06
- 小程序: 服務(wù)版“微信”鋒芒初現(xiàn) 2021-04-05
- 響應(yīng)式設(shè)計與普通設(shè)計的取舍 2021-04-05