湖州長興德清網站建設 網頁設計 網站制作 網站設計 網站開發 就找東吳科技
湖州網站建設分站
做網站聯系東吳科技 客戶熱線:0572-6123871 13362202553

懂你所需,做你所想
當前位置:首頁 >> 新聞資訊 >> 最新資訊

湖州網站設計的10條黃金法則

發表日期:2020-07-17 16:01:40文章編輯:瀏覽次數: 標簽: ? ?

       在我們設計網站有所疑惑時,可以參照以下標準做法。                當然,這些做法并非一成不變,我只是列舉出這些方法,相信它們可以對你的日常網站設計工作有所幫助。    

       我們需要記住一點,設計其實就是跳出框框思考,這意味著,有些時候我們要打破陳規。    

       1. 設計時使用密度像素(dp),而非像素(pixel)    

       密度像素是屏幕上每一英寸所包含的像素個數,簡稱PPI(Pixels Per Inch)。dp(density-independent pixel)是密度獨立像素,也寫作dip(也有device-independent pixel之說,設備獨立像素)。    

       設計界面時,建議大家基于設備的密度像素,而不是像素。這樣可以保證我們設計出的圖標素材比例適當,適應不同尺寸的設備。    

       舉個例子,假如我們以密度獨立像素dp為單位,設計了一個 200 x 50的按鍵,那么這個按鍵在160ppi的屏幕上的尺寸是200 x 50像素,在320ppi的屏幕上的尺寸則為400 x 100像素,即原尺寸的兩倍。    

       因為有些屏幕的單位英寸的像素數量要比其他屏幕多,即ppi分辨率大,為了保證設計的圖標在不同分辨率的屏幕上都一樣大,設計師通常只是設計一個尺寸,導出2x、3x、4x的尺寸。    

       iPhone XS Max的屏幕尺寸是414 x 896。但這里的單位并不是像素,而是點的個數。論像素,則是1242 x 2688 px。知道了這些,給iPhone XS Max做設計時,我會以414 x 896個點為尺寸做設計,而后導出3x的圖標素材。    

       2. 間距使用8的倍數(8dp)    

       為什么網頁設計的間距都是8的倍數而不是5的倍數呢?這里有一個簡單的解釋—如果一個設備是1.5x的分辨率,我們就沒法導出一個奇數。    

       另外,現代主流的屏幕尺寸都是以8為單位,以8的倍數做設計可以很好地適應這些屏幕。    

       以8的倍數設計可以保證設計的一致性?;谶@種慣例,大家在進行設計工作時不用再猜測間距的數值,每個圖標都可以完美地與其他圖標對齊。    

       3. 刪減元素容器的線框    

       我們在設計的過程中應該時常將自己抽離出來,審視界面中這些作為元素“容器”的線和框是否讓界面顯得過于雜亂,是否應該予以保留。通常這些用以區隔界面內容的線和框可以被邊界留白代替。    

       我們設計的大部分元素都存在于線框里,簡單清除掉這些“容器”可以讓界面看起來不那么擁擠—給元素更多呼吸的空間。    

       4. 無障礙設計—重視對比度    

       善用對比度不僅僅是為了讓用戶的注意力集中于重要的信息,更是為了使產品更容易訪問/使用。    

       設計產品就好比建設像圖書館、學校一類的公共場所,它的適用對象需要涵蓋每一個人,包括失明、色盲和視障用戶。    

       Web內容無障礙指南(WCAG)要求文本或文本圖像的對比度至少為4.5:1。    

       為了保證設計達到該標準,我們可以下載Stark這款插件來檢查設計是否是無障礙的。    

       5. 基于用戶習慣,設計用戶體驗    

       為什么有些圖標元素會被公認為標準?原因有多種。    

       假如你把一個按鈕設計成圓形,那么當我們需要一個(字數較多的)“Start Free Trial”按鈕時,它就會不必要地占用界面中豎直方向上的空間。    

       另外,用戶期待的是與其他產品相似的體驗。如果你設計的網站、APP或軟件與用戶的既有習慣相悖,那么這樣的體驗是不直觀的,用戶很可能會因此受挫。    

       故而,在我們發揮創造力的時候,建議以現有的設計規范為基準和前提。不要重新設計輪子。    

       

湖州網站設計

   

       6. 善用顏色重量(color weight),建立視覺層次    

       每一種顏色都有自己的視覺重量,我們可以通過借助顏色的視覺重量來建立內容的視覺層次,用顏色的深淺來呈現內容的重要性的層級。    

       善用顏色視覺重量的秘訣是,一個更為重要的元素,應該有更重的視覺顏色,以便用戶快速瀏覽網頁,區分重要和不重要的信息。    

       大字號、粗體的信息會首先被用戶注意到,而后他們會關注其下的輔助性信息。    

       7. 避免使用超過兩種字體    

       通常,設計界面會控制使用的字體數目,兩種不同的字體就應足夠—這不是說你不能使用更多字體,只是你需要充分的理由。通常來講,僅用兩種字體會更好。    

       設計界面時要善用字體家族。    

       使用字體家族意味著我們可以使用同一字體的不同變體。字體家族的存在就是為了字體的不同變體可以更和諧地被放在一起,讓設計在保持多變性的同時兼顧一致性。    

       選擇字體時,盡量選擇那些有多種重量(如標準、適中、粗體、特粗)和樣式的(如長體、寬體、斜體)的字體家族。這樣既會給設計留出可探索的空間,也不會增加額外的字體種類。    

       8. 讓用戶認知,而非記住    

       讓用戶去認知產品是產品設計中所推崇的,因為,我們為什么要讓用戶在使用的過程中去思考呢?    

       結賬頁面、電子郵箱、搜索歷史、返回按鈕等都是很好的建立了用戶認知的例子。    

       在好的設計中,結賬頁面是不需要讓用戶記住他們所要購買的物品的。用戶應該可以清楚地從界面中確認他要購買的物品,而非通過回憶來想起。    

       在Gmail郵箱中,我瞟一眼就可以知道哪些是已讀郵件,哪些是未讀郵件,這個過程不需要過腦子。同理,我登錄到自己的亞馬遜賬戶后,可以迅速地從上次購物時中斷的地方繼續開始購物—因為它顯示了我最近瀏覽過的物品。    

       設計時,應讓元素、功能、選項明顯可見,最小化用戶的記憶負荷。用戶無需自己在操作的步驟中記住信息。系統的操作說明應該在需要時很容易看到或查到。    

       —Nielson Norman Group(尼爾森諾曼集團,人機交互和用戶體驗咨詢公司,唐·諾曼是創始人之一)    

       9. 切忌拖慢用戶體驗      

       作為用戶,速度和效率是重要的。用戶使用一個應用程序,是為了解決某個特定的問題。    

       如果將一張支票通過手機存入銀行賬戶這個體驗是非常讓人享受的,那固然很好,但作為設計師,千萬不要讓你的創造力阻礙用戶實現他們的目標。    

       關于動畫和微交互的一條經驗就是,如果某個體驗只是無謂地增加了時間,那么這不是在改善用戶體驗。    

       如果加入的動畫帶有目的性,則可以改善用戶體驗;但是如果增加的只是不必要的分散注意力的元素或用戶操作,那么用戶體驗不會變得更好。    

       Dribble上有很多著陸頁的設計—當用戶向下滾動鼠標時,動畫隨之展開。通常,這些設計展現出過火的動畫效果,每個元素都在淡入淡出,動來動去,而幾乎不關注體驗本身。當太多事情同時在界面上發生時,用戶很難知道到底哪些信息是應該關注的,這等同于浪費用戶寶貴的時間。    

       無數研究表明,界面中動畫的最佳時間在200到500毫秒之間,這個數字是由大腦的特征決定的。任何短于100毫秒的動畫都是一晃而過,人眼根本無法識別;而超過一秒的動畫會帶給人無聊和延遲的感覺。    

       所以,如果你要在界面中使用動畫,那么給它一個明確的目的,并且不要讓用戶等待超過500毫秒。在2019年的今天,惹惱你的用戶只需要1毫秒。    

       10. 大道至簡    

       每次我們想要增加額外的信息到界面中時,例如按鈕、文字、照片、動畫、插圖等等,它們就會跟相關的信息進行競爭。如果一頁上有太多東西,那么某些元素的重要程度就會被削減。    

       谷歌搜索首頁就是典范。這個設計將全部的注意力放在了搜索這個主要功能上,沒有把用戶淹沒在不必要的信息海洋里。    

       End,分享給大家一句我愛的設計箴言:                臻于完美之時,不是加無可加,而是減無可減。                —Antoine de Saint-Exupery(法國作家,《小王子》作者)    

如沒特殊注明,文章均為東吳科技原創,轉載請注明來自http://http://www.123499.tw//news/1475.html
相關新聞

湖州長興企業網站營銷型網站對企業...

網站優化的發展程度直接決定企業的經濟效益,那么網站建設對企業的作用有哪些呢?下面

日期:2020-09-11 瀏覽次數:18

湖州網站建設分析網站上線后可以修...

公司網站上線后,有時客戶會由于公司原因而需要調整網站,并且通常會進行修改。但是一

日期:2020-07-25 瀏覽次數:12

湖州網站建設分析網站和app登錄...

用戶通常有兩種不同的方式來登錄一個網站。最新的一個方式是通過某社交網站的賬號采用

日期:2020-07-20 瀏覽次數:13

湖州網站建設網站制作四大發展趨勢...

現如今,隨著人們的生活水平的不斷提高,人們的審美也有著不斷的變化,對于網站來說,

日期:2020-07-18 瀏覽次數:18

小程序開發對湖州企業的四大好處

①、連接在線和離線促銷方式資源許多商家的應用程序可以通過掃描二維碼的方法下載。然

日期:2020-07-18 瀏覽次數:21

湖州長興外貿營銷型網站建設網頁設...

       外貿網站不管是品牌站

日期:2020-07-17 瀏覽次數:42

湖州網站設計的10條黃金法則

       在我們設計網站有所疑

日期:2020-07-17 瀏覽次數:12

流量玩法失效,湖州企業網站怎么做...

流量玩法怎么會失效呢?君不見李佳琦,一人創收超過四家上市公司;君不見李子染,攻占

日期:2020-03-23 瀏覽次數:48

湖州企業網站建設公司告訴您產品展...

  目前的網站類型是非常的多的,產品展示網站與營銷網站都是其中重要的網站類型,可

日期:2020-03-19 瀏覽次數:39

湖州網站建設:如何建設一個有趨向...

營銷型網站建設想要做好,不單單需要一個好的設計,更需要的是能夠吸引客戶,那么湖州

日期:2020-03-14 瀏覽次數:45

22选5开奖现场 100万靴 百家乐 山东麻将258将app 时时彩平台排行2018 一肖两码默认版本 娱网棋牌官方免费下载 1998年nba总决赛公牛vs爵士g4全场录像回放 最好信誉棋牌网址 手机捕鱼游戏编程原理 上海快3和值走势一定牛 腾游娱乐官网 欢乐大众麻将手机版下载 河南11选5基本走势图 腾讯分分彩技巧皿可63390 mg赌场亚洲 甘肃省快3玩法必中技巧 金沙城电子棋牌