安靜的結構 控制頁面的視覺 分貝 1

2021-07-26 11:51:06 字數 1238 閱讀 4863

cnn新聞**前段時間改版了。非著名設計顧問 andy 通過對比 cnn.com 和 usatoday.com ,談了些自己的想法,其中不乏一些好的見解。根據本人的理解,將其中一些有用的資訊做了翻譯並記錄如下:

安靜的結構

外框、線條、顏色等都是結構的基本元素,將這些元素舒服的排列會給頁面帶來節奏感和連貫性。並大大地加強和突出內容,將內容清晰的呈現給使用者。

cnn的改版設計就是如此,它的資訊架構乾淨、清晰,我將它稱之為安靜的結構。當**的內容為王,而你又想鼓勵使用者花時間將內容讀入大腦而不只是盯著它的時候。安靜的結構在這個時候可以幫助你。

建立乙個安靜的結構成本其實很低,並且有很多方法。這篇文章會涉及到其中一部分。我將展示如何將它們進行有效的結合,增強設計效果。

兩個頁面的設計

粗略看一看cnn.com的主頁,再看看usa today的主頁。你會發現usa today設計得也不是太差。通過比較,你就會發現usa today在內容表達上其實存在著一些混亂。

為何會產生這種情況? 我們通過比較一些細節來分析。

首先,我們比較下兩個站點的頂部設計。 cnn非常簡單,並且只有乙個目標: 導航/搜尋。相反, usa today的頂部稍顯忙碌,它想要使用者完成至少3種不相關的任務。通過頂部的設計,就初顯兩個站點截然不同的設計風格。

焦點明確:導航/搜尋。

焦點分散,效率變低。

但是頁面是否乾淨和清楚,區別體現在整個版面上,頂部並不會破壞網頁的完整性。因此要建立安靜的結構,還需要從具體的版面上入手。

例如:usa today不太注意圖/文結合時的配對排列方式,一些是水平配對,一些是垂直配對。雖然這不能稱之為乙個問題,但是每一種排列方式都有適合它出現的位置。不搞清楚這個狀況,會惡化版面,造成內容展示的損傷。具體到下面的:

通過比較可以得出,cnn在展示圖/文配對上具有較高的一致性。這種一致性,在其內容和結構元素的展現方面也可看出。因為這種一致性的結合,cnn的表達較usa today來說更為清楚。

分支語句 c 程式的控制結構1

程式 由若干條語句組成,各語句按照順序一條一條地執行,這種順序結構是簡潔的。但在現實世界中,在解決問題的過程中,不可避免地遇到需要進行選擇戊需要迴圈i作的情況。這時,程式執行的順序需要發生變化,而非從前向後逐一執行。因此程式中除了順序結構以外,通常還有選擇結構迴圈結構以及轉移機制。if選擇結構 格式...

C 學習筆記1 C 語言的控制結構

二 break continue和goto語句 三 小結 控制結構有順序儲存結構 選擇結構和迴圈結構。1 if語言用法如下 注意 在沒有通過 明確表明if和else的配對關係時,else是和離它最近的if相配對。if 表示式1 else if 表示式2 else if 表示式n 1 else 2 s...

第二部分 程式的控制結構 1

pm eval input please enter the numner of pm2.5 if 0 pm 35 print 空氣優質,快去戶外活動!elif 35 pm 75 print 空氣良好,適度戶外運動!else print 空氣汙染,請小心!please enter the numne...