iOS的UI元素導(dǎo)航欄里的完成按鈕的優(yōu)化
發(fā)表日期:2015/8/12 11:49:18 文章編輯: 瀏覽次數(shù):2381
iOS中很多代表“完成”操作的按鈕時(shí)常被置于導(dǎo)航欄當(dāng)中右側(cè)的位置,包括表單界面的提交按鈕也是如此。如今這種模式也開始潛移默化的影響到一些Android平臺(tái)里的app。
根據(jù)我們的可用性測(cè)試所得出的結(jié)論,不說(shuō)跨平臺(tái)的影響力,單就iOS本身,我們也不建議將“完成”性質(zhì)的按鈕放在這里,原因很簡(jiǎn)單,將最終操作放置在界面頂部,有悖于自上而下的信息流向。用戶在填寫表單或編輯內(nèi)容時(shí),交互行為通常是由上至下的,當(dāng)他們即將完成的時(shí)候,也會(huì)預(yù)期在結(jié)尾處看到結(jié)束處理的操作。多數(shù)情況下,當(dāng)人們無(wú)法在結(jié)尾處找到這樣的功能時(shí),便會(huì)產(chǎn)生迷惑并開始四處尋找。
在下面的案例當(dāng)中(左側(cè)是Pinkberry,右側(cè)是Nordstorm),用戶填寫完表單之后需要點(diǎn)擊登錄或下單按鈕。這樣的布局就是我們所說(shuō)的有悖于自上而下信息流向的形式,用戶的全部注意力都隨著表單而逐漸下移,最終發(fā)現(xiàn)在結(jié)尾的地方?jīng)]有任何完成操作,剩下的就是茫然無(wú)措。要知道,即使是在手機(jī)這樣的小屏設(shè)備上,四處尋找某種UI元素也是需要耗費(fèi)很多額外的注意力成本的;將完成按鈕直接放置在內(nèi)容底部是最符合直覺的做法。
當(dāng)然,從另外一個(gè)方面講,將完成按鈕置于導(dǎo)航欄當(dāng)中的模式也有其自身的優(yōu)勢(shì):因?yàn)榫W(wǎng)頁(yè)設(shè)計(jì)導(dǎo)航欄是固定在頂部的,所以用戶在編輯內(nèi)容時(shí)可以隨時(shí)點(diǎn)擊到,而且當(dāng)內(nèi)容區(qū)域較長(zhǎng)時(shí),放置在頂部的按鈕也不會(huì)被鍵盤所遮擋。如果用戶確實(shí)無(wú)需完成全部?jī)?nèi)容的填寫便可以進(jìn)行完成操作,那么你可以考慮將完成按鈕固定在底部,并會(huì)隨著鍵盤的起落而相應(yīng)的移動(dòng)。這種方式的缺點(diǎn)是會(huì)占用一定的縱向空間,但優(yōu)點(diǎn)也是很明顯的:即符合直覺,又隨時(shí)保持可見,同時(shí)相比于頂部右端的位置來(lái)說(shuō),更易單手點(diǎn)擊操作。
鑒于導(dǎo)航欄里的完成按鈕所存在的一些可用性問(wèn)題,我們建議:將按鈕置于內(nèi)容底部;如果內(nèi)容較長(zhǎng),可以嘗試將按鈕位置固定,并使其不會(huì)被鍵盤遮擋,以便用戶可以隨時(shí)點(diǎn)擊。
------北京網(wǎng)站建設(shè)公司 北京傳誠(chéng)信-------
-
iOS中UI元素拖拽圖標(biāo)的優(yōu)化
日期:2015-08-12 瀏覽次數(shù):2518
-
安卓和蘋果手表之間的操作系統(tǒng)對(duì)比。
日期:2015-08-12 瀏覽次數(shù):2664
-
iOS當(dāng)中UI元素頁(yè)碼指示符(小圓點(diǎn))的優(yōu)化。
日期:2015-08-12 瀏覽次數(shù):2547
-
如何打造響應(yīng)式的布局結(jié)構(gòu)。
日期:2015-07-23 瀏覽次數(shù):2389
-
CSS3樣式收集
日期:2015-07-30 瀏覽次數(shù):2725
-
免費(fèi)SSL證書申請(qǐng)網(wǎng)站topssl.cn上線
日期:2024-09-23 瀏覽次數(shù):1089
-
如何在北京順義尋找一個(gè)踏實(shí)的網(wǎng)站建設(shè)公司
日期:2023-08-10 瀏覽次數(shù):4141
-
順義網(wǎng)站建設(shè):北京順義網(wǎng)站建設(shè)的優(yōu)點(diǎn)
日期:2023-05-25 瀏覽次數(shù):4565
-
選擇網(wǎng)站公司需要考慮哪些因素
日期:2023-05-25 瀏覽次數(shù):3425
-
北京模板建站
日期:2023-03-28 瀏覽次數(shù):3606
-
現(xiàn)代網(wǎng)站設(shè)計(jì)趨勢(shì)的新功能
日期:2019-01-25 瀏覽次數(shù):2230
-
讓您的網(wǎng)站訪問(wèn)者更長(zhǎng)久的9個(gè)辦法
日期:2019-02-27 瀏覽次數(shù):2478
-
評(píng)估高端網(wǎng)站設(shè)計(jì)的標(biāo)準(zhǔn)
日期:2021-09-03 瀏覽次數(shù):1914
-
后臺(tái)產(chǎn)品的以下幾個(gè)特點(diǎn)
日期:2018-09-29 瀏覽次數(shù):2491
-
解決HTML5在實(shí)際應(yīng)用中的兼容性問(wèn)題若干意見
日期:2018-08-01 瀏覽次數(shù):2562