<strike id="cy2gs"><menu id="cy2gs"></menu></strike>
  • <del id="cy2gs"><dfn id="cy2gs"></dfn></del>
  • 2015 不要在移動端菜單設計中犯這些錯誤

    2015-3-23    用心設計

    藍藍設計www.skdbbs.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供有效的UI界面設計BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 平面設計服務

    每一個扁平化界面設計,都是我們的心靈碰撞致力于最棒的 metro ui 設計

    來源:13tech

     如果您想訂閱本博客內容,每天自動發到您的郵箱中, 請點這里

    cdsj

    當我們想要讓移動網站的用戶導航更加直觀時,會遇到這樣的挑戰:內容太多,空間太小。

    移動電商平臺設計中的趨勢是使用“漢堡包圖標”來展示分類菜單,這或許能增強主頁的擴展性,實現主頁和菜單之間的跳轉。

    cdsj1

    可切換的菜單鍵是一種很好的把導航合 并到每個頁面中去的方式。考慮到移動端搜索需求的增長,并且43%的手機上的郵箱是打開的(數據來源Litmus),因此維護那些直接進入到你的網站內頁 和不熟悉你的移動網站的用戶是至關重要的。 這種漢堡包菜單是一個好點子——且約定俗成的,但問題是如何將它應用到你的設計中去。

    要做的事:告訴用戶從哪里開始

    Buckle可以識別到首次訪問的訪客并將他們的注意力吸引到菜單鍵上。即使訪客不知道漢堡包菜單的作用,他們知道這是一個很好的起點,并且很快會發現它是用來控制分類導航的。

    cdsj2

    不能做的事:分不清“漢堡包”菜單和網站logo

    盡管移動端正在日益普及,互聯網用戶已經習慣桌面網頁的分布方式,認為左上角是logo的位置,把“漢堡包菜單”放到logo的左側是一個很大的禁忌。

    首次訪問的用戶,如何得知“DISCOUNT DANCE SUPPLY”是導航,而不是品牌logo。

    cdsj3

    Forever 21 logo右側的導航是很容易理解的,但是左側的漢堡包菜單看起來不像是可點擊的元素。

    cdsj4

    Ditto Spanx,看看這個網站,你該明白了。

    cdsj5

    不能做的事:太多留白

    我賭你一杯雙倍大份的焦糖瑪奇朵,眼球追蹤研究將顯示用戶的大部分注意力的都在圖片的部分,而不是浮動神秘的漢堡包菜單。把菜單圖標遠遠的放在右側和把它放在logo左側一樣危險。

    cdsj6

    需要做的事:將分類圖標和其他導航元素組織好

    Softchoice的漢堡包菜單作為導航菜單的一部分,用戶很容易就識別出它是可操作的。

    cdsj7

    另外,Lowe’s 把漢堡包菜單和搜索放在一起。

    cdsj13

    當你決定圖標的順序時,請牢記桌面網頁中一些約定俗成的慣例。eBags的漢堡包菜單在右上側,這個位置是傳統的放置登錄和購物車的位置。 把漢堡包菜單放到賬戶和購物車的左側,或者把它和搜索放在一起, eBags或許會更好。

    cdsj8

    Green Mountain 把漢堡包菜單和搜索放在一起,但是把它放在搜索的左側可能會更直觀,畢竟,垂直類的菜單約定俗成的出現在左側,而“搜索”按鍵則出現在搜索框的右側。

    cdsj9

    需要做的事:標注圖標

    設計師——我聽到你在哭泣,但是標注圖標可以更好的闡明這些圖標是做什么的。例如,CVS漢堡包菜單上增加了“菜單”兩個字。

    cdsj10

    如果你覺得這太擁擠了,你可以直接把“菜單”兩個字設計在按鍵上,直到漢堡包菜單成為約定俗成的菜單圖標。

    cdsj11

    注意:Harry and David的搜索圖標可能會和PayPal的logo混淆,因為PayPal的logo看起來類似一個搜索框。

    Ross Simons菜單按鍵上的加號大喊著“展開我”。這種放在搜索框左側的方式要比和購物袋圖標放在一起,或者是放在搜索框右側更加有效。

    cdsj12

    但是Ross Simons 的購物袋圖標是和logo混在一起的,而且混的有點過了。事實上,如果沒有適當的設計,任何導航圖標都可能被忽視。

    一如既往,用戶測試和A/B測或者多變量測試可以告訴你,你的設計是否有效。測試導航應該是移動優化策略中的首要任務之一,使空間使用的有效性與移動網站架構清晰相互均衡。

    日歷

    鏈接

    個人資料

    藍藍設計的小編 http://www.skdbbs.com

    存檔

    主站蜘蛛池模板: 亚洲精品乱码久久久久久按摩| 国产精品ⅴ无码大片在线看| 亚洲精品乱码久久久久久蜜桃不卡 | 3级黄性日本午夜精品| 亚洲欧美一级久久精品| 国产精品内射婷婷一级二| 精品一区二区三区在线成人 | 99久久免费国产精品| 精品成人一区二区三区四区| 99麻豆久久久国产精品免费| 亚洲欧洲美洲无码精品VA| 性色精品视频网站在线观看| 国产AV无码专区亚洲精品| 日韩精品国产另类专区| 久久久99精品一区二区| 国产精品制服丝袜亚洲欧美| 好属妞这里只有精品久久| 国产欧美亚洲精品A| 亚洲国产精品无码AAA片| 久久精品国产亚洲av瑜伽| 欧产日产国产精品精品| 亚洲国产精品一区二区三区久久| 国产精品无码无卡无需播放器| 亚洲第一精品在线视频| 久久777国产线看观看精品| 97精品伊人久久大香线蕉app| 久久99国产精品尤物| 亚洲av永久无码精品秋霞电影影院| 精品亚洲一区二区三区在线观看| 93精91精品国产综合久久香蕉| 久久国产乱子精品免费女| 国产a精品视频| 99久久精品国产麻豆| 精品国产一区AV天美传媒 | 午夜在线视频91精品| 久久精品国产WWW456C0M| 国精品产露脸自拍| 久久se精品一区二区影院| 精品欧美一区二区在线观看 | 日韩麻豆国产精品欧美| 精品国内片67194|