7個讓Web頁面布局成為敗筆的設計誤區

2021-09-01 16:57:56 字數 2360 閱讀 6330

雖然

web設計

領域已經

步入了產業化方向,但是

開發乙個**仍

然是技術和藝術的結合。**的設計既可以

為其帶來大量流量,也可

能嚇走大量使用者,這些

無疑取決於

設計師的設計水平

。經驗、天份和能力是乙個設計師最強大的工具,好的

web布局

完全基於這些,當然

,這也是乙個非常耗時的工作。

設計乙個好的布局是件不容易的事情,而且

對布局的

判斷也非常主觀

化。乙個設計可能

能夠取悅你,

卻可能讓

他人厭惡。儘管如此,

在web設計中還是有一些「久經考驗」

的設計誤區。

為了幫助設計初學者少走彎路,我們

1.缺乏空白區域

沒有比把頁面塞得像麻袋一樣滿更讓人

討厭的設計了。你應該

在頁面上

保留一定的空白讓訪問者

可以放鬆他們的眼睛。很多設計者都想在

首頁提供更多的內容。似乎初學設計的人更容易犯這個錯誤,但其實各個設計水平的人都有這個傾向。設計者太依賴於布局而不敢嘗試其

他方式。有時候,最簡單的因素勝於一切。

2.糟糕的顏色組合

糟糕的顏色搭配絕對是最嚇人的。乙個很常見的錯誤就是使用高對比顏色

,藉此來

建立乙個富有視覺張力的設計。

對比色的

設計大部分是為了突顯某一部分,也許你可以嘗試使用一種顏色而通過不同的色調及飽和度來實現

。這裡有乙個小技巧非常不錯:降低你的檔案飽和度,

直到各個元素之間的區別非常清晰。

其思路非常簡單:視覺沒有問題的人

可以非常清晰

地看到各個元素

,有視覺問題的人

則將看到黑色、白色或者

是灰色的布局。

接下來就

簡單了,如果他們檢視布局顏色沒有困難,那麼

便可提交無障礙測試了

3.個頁面裡包含了太多的內容

這聽起來似乎與第一點類似,但是在乙個頁面中也可能同時

擁有很多空白區域

以及大量資訊。通常人們

瀏覽**時都會

先掃上幾眼,因此設計人員應該讓整個布局

更加清晰

。乙個充斥著大量

資訊而又插入了

太多圖示、按鈕

或是的**,

將會非常難以瀏覽,會讓**的易用度大打折扣

,對使用者來說也是不友善的

4.使用不當

一圖抵千言

,但是如果使用不當的話,你的布局設計就失敗了。文字、布局和應該

融合成一體

,它們並不是分離的。任何web設計人員都應該理解創意並且有效的實現。應該能有效地說明**需要表達的資訊,這在設計之初

就需要考慮到。

5.忽略字型排版

僅僅因為文字太多認為其過於平凡瑣碎

就忽略字型排版是乙個非常大的錯誤。字型排版不是乙個簡單的如何選擇字型的過程,它還包含了句子、段落及標題的組織方式。你可能想這裡需要做的工作太多了,但是乙個富有成效的設計將會對頁面布局產生非常重要的影響。

6.沒有考慮到可性和所有人的使用感受可達

性(accessibility

)可能被很多人認為是一

件多餘的事情,但是乙個

未完全實現無障礙標準

的**只

是乙個自私設計者的作品。網路世界對於任何人都是平等的,如果你的設計不能讓每個人都能享受到,那麼將會是一件很不尊重人的事情。美國有一項法規規定:任何機構和部門的**都必須通過

webaccessibility測試

。實際上可

達性並不是個高科技的東西。例如,你只需要簡單加上alt標籤屬性,這並不會給你帶來任何麻煩。這裡用不著遵循什麼法規,從道德和道義上來講,我們應該自覺地將這個考慮

用到設計中去。

7.沒有事先思考

由於缺乏經驗,我們

可能需要不停地修改自己的東西。滑稽的是,我們可能晚上設計的東西,第二天可能就會被

推翻。聰明的設計者會在一開始

便思考整個布局。這可以節省很多時間和資源。很明顯,在實際做之前思考是一件很不容易的事情,但是至少能夠幫助我們

少些去修改

許多設計。不用擔心,經驗可以幫助我們做到這一點。

7個讓Web頁面布局成為敗筆的設計誤區

即使web設計已經成為乙個真正的產業,開發乙個 仍舊是技術和藝術的結合。乙個 的設計既可以帶來大量流量,同時也可以嚇走大量使用者,當然這些都和設計師相關。經驗 天份和能力是乙個設計師最強大的工具。乙個設計精良的布局是web設計的基礎,而且,這也是乙個非常耗時的工作。設計乙個非常好的布局是一件非常不容...

移動WEB的頁面布局

隨著移動網際網路的日益普遍,現在移動版本的web應用也應用而生,那麼在做移動web頁面布局的過程中,應該注意哪些要點呢?現把個人的一些學習經驗總結如下 1px 2dp dp dpr dpi ppi ios的viewport為980px 布局 layout viewport 檢視 visual vie...

10個步驟讓你成為高效的Web開發者

要成為高產 高效的web開發者,這需要我們做很多任務作,來提高我們的工作方式,以及改善我們的勞動成果。下面是10個提高效率的步驟,雖然不能保證解決你在開發中的所有問題,但至少是非常實用的,可以簡化你的web開發流程,使開發的每乙個環節快速 流暢。還可以幫助你節省大量的時間,以便開發更多 更好的專案。...