技術(shù)資訊
優(yōu)秀Web設(shè)計的10項原則:富有美感并創(chuàng)新實用
2012-03-08 17:20:37
1.優(yōu)秀的設(shè)計富有美感
對于一個網(wǎng)站來講,美感是可視細節(jié)和實用性之間的平衡關(guān)系。一個富有美感的網(wǎng)站,不僅給用戶提供非同尋常的體驗,而且呈現(xiàn)出相關(guān)的內(nèi)容。
單純從面向設(shè)計的視角來看,有三點能夠幫助設(shè)計者做出優(yōu)秀且富有美感的Web設(shè)計。
1.顏色:謹慎對待色彩方案—它們給所有頁面帶來馨香。你可以嘗試使用不用的組合,但是需要考慮到每種顏色的含義。如果你準備給不同的設(shè)備提供不同的體驗,顯示器上顯示出的顏色不會比紙質(zhì)的或某個物件上的顏色更好控制。
2.網(wǎng)格、空間:在組織網(wǎng)站的基本結(jié)構(gòu)時,你需要決定用戶如何看到網(wǎng)站的內(nèi)容—按照次序或網(wǎng)格,對待空白部分要尤其小心。信息的不同尺寸/對稱性/次序決定人們?nèi)绾谓忉屵@些內(nèi)容。
3.版式:顯示文本的方式和字體的選擇比一般人想象的更重要,能夠閱讀并且強調(diào)不同的內(nèi)容取決于你為網(wǎng)站選擇的版式。
2.優(yōu)秀的設(shè)計應該是創(chuàng)新的
第一項原則同樣也是Web設(shè)計的基礎(chǔ)—創(chuàng)新。設(shè)計者必須注意的是,在構(gòu)思優(yōu)秀的Web設(shè)計,創(chuàng)新能夠起到非常重要的作用。以下是兩個基本點:
1.在UI和圖片設(shè)計方面,應該用創(chuàng)新的心態(tài)和批判性的思維對待每一個項目,并試圖開闊自己的思維,發(fā)掘其它的分支。把創(chuàng)造力作為創(chuàng)新工具,來脫穎而出。
2.多和身邊的新人保持交流,不管是圖片生成工具還是新的編程語言,多接觸這些內(nèi)容
管理創(chuàng)新是一項艱巨的任務,因為它總是不斷的變化發(fā)展,但是要一直保持開闊的思維,嘗試新的方式進行創(chuàng)造,只有像這樣你才能夠有多種途徑做出優(yōu)秀的Web設(shè)計。
3.優(yōu)秀的設(shè)計讓產(chǎn)品更加實用
何謂實用性網(wǎng)站,如何使網(wǎng)站具有可用性?
這一點描述起來有點棘手,因為在不同的人看來網(wǎng)站的可用性是不同,但是我想強調(diào)實用性網(wǎng)站的三個方面。
1.有助于訪客瀏覽網(wǎng)站:盡可能使訪客毫不費力就找到他們想找的內(nèi)容,用戶界面的細節(jié)和信息的顯示都能夠使網(wǎng)站變得實用。
2.實用的內(nèi)容:網(wǎng)站的內(nèi)容是網(wǎng)站最有用的部分,如果不重視網(wǎng)站的內(nèi)容,你就輕而易舉地丟掉了提升網(wǎng)站實用性的一大法寶。
3.實用性網(wǎng)站的最后一點是你怎樣編碼你的網(wǎng)站,因為你需要考慮到網(wǎng)站優(yōu)化和性能方面,以使網(wǎng)站實用。
4.優(yōu)秀的設(shè)計使產(chǎn)品更簡單易懂
為了確保網(wǎng)站易懂,你需要清醒地意識到目的,網(wǎng)站為了某些目標而進行設(shè)計。你需要保證網(wǎng)站的易用性,對于用戶來說,怎樣毫不費力地達到了他們的目的。
舉個列子,如果你有一家網(wǎng)店,目的就是為了銷售,因此,你的設(shè)計要盡可能簡潔,小心改進瀏覽商品的體驗和訪客退出的方式。網(wǎng)站最好是一目了然的。
5.優(yōu)秀的設(shè)計是謙虛的
謙虛的網(wǎng)站必須要注意兩大點:
1.單純從面向設(shè)計的觀點看,Mies van der Rohe有這么一則非常妙的格言:“少即是多。”的確,設(shè)計師很容易在裝飾和圖片細節(jié)中迷失,切記不要這樣!保持內(nèi)容生動易懂—訪客必須盡可能理解內(nèi)容傳遞的信息,然后理解圖片的細節(jié),盡可能營造一種瀏覽網(wǎng)頁的體驗,而不是讓訪客感覺眼花繚亂。設(shè)計應該是中性的。
2.另一方面是輔助功能,在設(shè)計網(wǎng)站的時候,你必須清楚網(wǎng)站輔助功能的基本規(guī)則。
倫敦的設(shè)計顧問Bibliothèque 和生產(chǎn)商Vits 最近做了一張7色A0海報來慶祝Rams的10條關(guān)于優(yōu)秀設(shè)計的原則。
6.優(yōu)秀的設(shè)計是誠實的
何謂誠實的網(wǎng)站?對于一個網(wǎng)站來說,所謂的誠實就是要對訪客保持開放的態(tài)度,總是給他們提供幾個選項以供選擇,不要過分地強調(diào)你的設(shè)計的重要性。
舉個例子:盡可能地闡述清楚某個選項或者按鈕的目的,或者使用錯誤提示信息來指示錯誤的內(nèi)容。
一個誠實的網(wǎng)站往往會提供工具來幫助用戶達到他們的目的,一系列的選擇、可視的鏈接和其它一些暗示會給用戶滿足他們所有可能的需要。
7.優(yōu)秀的設(shè)計經(jīng)得起歲月的考驗
對于網(wǎng)站是否經(jīng)得起歲月的考驗這個問題是存在爭議的,但是這項原則可以毫不費力的應用到設(shè)計方面的趨勢中去。換言之,web設(shè)計中總存在著最新趨勢。不要只跟隨潮流,而不考慮你的設(shè)計中的根本性的改變。
網(wǎng)站的內(nèi)容必須時刻保持最新,但是主要結(jié)構(gòu)應該是可持續(xù)發(fā)展的,因此使用迭代設(shè)計來增強視覺體驗,使用技術(shù)來
在Web設(shè)計中,“可持續(xù)”跟現(xiàn)實中的“可持續(xù)”有些出入。最重要的是能夠使用戶喜歡你的設(shè)計,你也必須一直適應自己的工作,否則,這兩方面會導致要重新設(shè)計,在我們這個時代,每兩年就會出現(xiàn)一次這種情況。
8.優(yōu)秀的設(shè)計考慮周到并且重視每一個細節(jié)
這項原則,顧名思義,把你所有的精力都投入到設(shè)計中去,就像它是你生命中最重要的一部分。試圖從不同的角度來探尋自己的想法,并且小心設(shè)計瀏覽網(wǎng)站的體驗。
9.優(yōu)秀的設(shè)計重視環(huán)境
這一點做起來有些難度,我只指出優(yōu)化的方法。在你設(shè)計網(wǎng)站的時候,不要大幅度地減少碳足跡,盡可能保留雨林。但是你要記住幾點:
1.縮減頁面的規(guī)模。
2.使用經(jīng)過Web優(yōu)化的圖片
3.使用盡可能好的辦法優(yōu)化代碼,使你的游覽器使用更少的損耗正確顯示你的網(wǎng)站。
10.優(yōu)秀的設(shè)計是簡潔的
最后,并且必要的一點,這項原則確定了設(shè)計的好壞—要始終謹記你想法的目的,創(chuàng)建透明易用的系統(tǒng)。在設(shè)計網(wǎng)站的的時候,把重點放在其主要功能上,并保持它的簡潔,使用戶能夠更好地理解。
使內(nèi)容生動地顯示出來,最好的設(shè)計是你感受到的,而不是理論上你支持的。
這些原則中傳達出的最重要的信息之一就是我們是為人而設(shè)計。這是我們網(wǎng)站的最終目的,在創(chuàng)建新項目的時候,我們要時刻謹記這一點。就像Rams說的那樣,“設(shè)計師是用戶忠實的擁護者”,我們必須創(chuàng)造理性,同時也是感性的作品。
隨著對Dieter Rams的作品的認識,你會不由自主地感覺振奮,開始創(chuàng)造出驚艷的作品,不管是哪個領(lǐng)域中的設(shè)計。
這就是我怎么把20世紀最著名的設(shè)計師之一的這些原則應用到新設(shè)計領(lǐng)域來的,數(shù)字領(lǐng)域和Web設(shè)計。
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿足預期到走向卓越
- [2023-04-11 09:17:49] H5頁面設(shè)計開發(fā)——移動端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項目
- [2021-03-05 10:34:45] 移動互聯(lián)時代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢?為什么要開發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計
- [2020-12-16 16:55:32] 建設(shè)一個常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2015-11-16 11:04:47] 實用、簡單的.htaccess技巧
- [2016-09-11 13:47:00] 有趣且相當實用的Photoshop圖層教程
- [2012-01-29 11:38:12] 簡單實用的 Windows7 技巧
- [2008-07-04 17:40:00] 戴爾官網(wǎng)首頁即將改版:實用和美觀并重
- [2009-01-07 09:04:00] 方便和實用
- [2009-01-13 22:22:00] 10大實用web應用界面技術(shù)[譯]
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計解決方案 機械行業(yè)網(wǎng)站設(shè)計解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計解決方案 科技企業(yè)網(wǎng)站設(shè)計解決方案 電子家電網(wǎng)站設(shè)計解決方案 食品行業(yè)網(wǎng)站設(shè)計解決方案 集團公司網(wǎng)站設(shè)計解決方案 企事業(yè)單位網(wǎng)站設(shè)計解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計解決方案 健身運動網(wǎng)站設(shè)計解決方案 美容與化妝品網(wǎng)站設(shè)計解決方案 建筑設(shè)計行業(yè)網(wǎng)站設(shè)計解決方案 物流行業(yè)網(wǎng)站設(shè)計解決方案
TAGS關(guān)鍵字
用戶界面 力圖 程序開發(fā) 圖形網(wǎng)格 網(wǎng)站建設(shè),手機網(wǎng)站 企業(yè)網(wǎng)站設(shè)計 網(wǎng)站的速度 企業(yè)網(wǎng)站建設(shè) 青島黃島、紅島網(wǎng)站建設(shè)公司 良好的導航 青島IT資訊 青島網(wǎng)絡公司 網(wǎng)站建設(shè)的步驟有哪些 集團公司網(wǎng)站建設(shè) 青島網(wǎng)站營銷 微信小程序 青島網(wǎng)頁制作 頁面設(shè)計 青島輪胎網(wǎng)站設(shè)計 青島高端網(wǎng)站建設(shè)公司哪家好 微官網(wǎng)帶來的好處 青島SEO 營銷策略 手機網(wǎng)站建設(shè) 網(wǎng)站改版 輪胎網(wǎng)站設(shè)計 青島海洋投資集團 網(wǎng)站策劃 HTML5 網(wǎng)站推廣