建站常識(shí)
觸屏界面的按鈕文本設(shè)計(jì)原則 (翻譯)
2009-07-24 07:47:00
一篇簡(jiǎn)短但是蠻有用的文章,對(duì)于做觸屏界面設(shè)計(jì)的朋友來說也許有些意義。
原文: Labeling Touchscreen Interfaces / 作者: Morgan Strauss from Guifx
一幅畫可能包含了千言萬語,但是一個(gè)用戶界面卻需要用簡(jiǎn)潔的語句明確地告訴用戶該做什么。因此決定哪些文字應(yīng)該出現(xiàn),哪些文字應(yīng)該是界面設(shè)計(jì)非常重要的一部分。以下是四個(gè)適用于觸摸屏界面的文本添加原則,遵循這些一定有助于提升界面的可用性。
原則1
用動(dòng)詞來描述一個(gè)按鈕是用來做什么的。
如果不是直接用動(dòng)詞描述,用戶可能會(huì)感到困惑,并且增加學(xué)習(xí)的成本。所以"OK"和"Cancel"并不是最佳選擇,“Yes”和“No”則更差。
原則2
把文本的重點(diǎn)放在最前面的12個(gè)字符上
(注:12個(gè)字符是英文,對(duì)于中文來說可能就是三四個(gè)字)。人們閱讀地時(shí)候總是掃描文字,所以大家可以比較一下這兩句話:
“您正要進(jìn)行關(guān)機(jī),確認(rèn)嗎?”
“關(guān)機(jī)嗎?”
同樣的意思但是哪一句您閱讀地更快呢?
原則3
按鈕的文本應(yīng)該置于按鈕本身而不是列在旁邊。
研究顯示多數(shù)觸摸屏用戶會(huì)觸碰按鈕的下半部,所以我們也建議把文字從垂直居中的位置上提一點(diǎn),這樣用戶在按下按鈕的同時(shí),文本不容易被手指遮擋。
原則4
減少重復(fù)。
如果在一組按鈕中一樣的文字不斷重復(fù),那就把這些按鈕放到一組,用一個(gè)標(biāo)題來簡(jiǎn)化文本內(nèi)容。或者有些情況下可以直接去掉這些重復(fù)的文字。這有助于幫助你的用戶快速定位他需要進(jìn)行的操作。
實(shí)際情況中我們不可能永遠(yuǎn)應(yīng)用這四點(diǎn),但是完全可以把這些思想靈活運(yùn)用在界面設(shè)計(jì)中。
近期更新
- [2023-06-25 23:22:29] 優(yōu)秀網(wǎng)站設(shè)計(jì)的五大特點(diǎn)
- [2023-04-27 14:05:55] Html 5 響應(yīng)式網(wǎng)站設(shè)計(jì)制作
- [2023-04-10 11:07:30] 網(wǎng)站建設(shè)制作流程知多少
- [2022-10-14 10:11:30] 做網(wǎng)站設(shè)計(jì)應(yīng)該更看重框架搭建還是視覺觀感?
- [2022-08-09 15:57:48] 以“產(chǎn)品”思維搭建網(wǎng)站!
- [2022-08-08 09:12:57] 一家公司的網(wǎng)站應(yīng)該有哪些板塊內(nèi)容?
- [2022-08-05 09:28:06] 企業(yè)網(wǎng)站建設(shè)為什么要設(shè)置新聞板塊?
- [2022-07-04 15:58:06] 網(wǎng)站首頁設(shè)計(jì)的好看,這個(gè)網(wǎng)站就成功了一大半!
- [2022-05-20 09:34:19] 網(wǎng)站后臺(tái)管理系統(tǒng)是什么?有什么作用?
- [2022-05-17 11:29:32] 作為消費(fèi)者,應(yīng)該如何選擇一家水平高的網(wǎng)站建設(shè)公司
- [2022-05-17 11:27:01] 高端網(wǎng)站定制與模板化網(wǎng)站應(yīng)該怎么選擇?
- [2022-04-22 16:00:41] 現(xiàn)在高端的網(wǎng)站設(shè)計(jì)都有哪些新的趨勢(shì)?
延伸閱讀
- [2010-12-01 08:22:00] 巧妙性設(shè)計(jì)之UI按鈕設(shè)計(jì)方法論(二)
- [2009-07-30 08:06:00] 觸不到的按鈕
- [2010-01-27 14:18:00] 自然描述與自然任務(wù)
- [2008-02-13 11:29:00] 圖片與文本誰更重要?
- [2010-01-11 21:44:00] 多按鈕共存——don’t make me think
- [2009-11-05 08:31:00] 行動(dòng)召喚按鈕:實(shí)例與最佳實(shí)踐
- [2009-12-05 22:40:00] 為中文而設(shè)計(jì)的文本框
- [2009-05-04 08:32:00] 按鈕還是鏈接?(二)
- [2010-10-27 15:11:00] 巧妙性設(shè)計(jì)之UI按鈕設(shè)計(jì)方法論(一)
- [2007-04-18 09:08:00] 怎么讓按鈕更容易被點(diǎn)擊
- [2007-11-20 14:03:00] 按鈕上的內(nèi)容
- [2007-11-20 14:05:00] 網(wǎng)頁按鈕的功能與表現(xiàn)
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計(jì)解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計(jì)解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 科技企業(yè)網(wǎng)站設(shè)計(jì)解決方案 電子家電網(wǎng)站設(shè)計(jì)解決方案 食品行業(yè)網(wǎng)站設(shè)計(jì)解決方案 集團(tuán)公司網(wǎng)站設(shè)計(jì)解決方案 企事業(yè)單位網(wǎng)站設(shè)計(jì)解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 健身運(yùn)動(dòng)網(wǎng)站設(shè)計(jì)解決方案 美容與化妝品網(wǎng)站設(shè)計(jì)解決方案 建筑設(shè)計(jì)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 物流行業(yè)網(wǎng)站設(shè)計(jì)解決方案
TAGS關(guān)鍵字
審美 力圖 青島做網(wǎng)站多少錢 用戶界面 官網(wǎng)網(wǎng)站建設(shè) 網(wǎng)站建設(shè)的步驟有哪些 網(wǎng)頁設(shè)計(jì) 視覺靈感 青島網(wǎng)頁設(shè)計(jì) 青島網(wǎng)絡(luò)公司 SEO優(yōu)化 H5專題頁面 膠南網(wǎng)站建設(shè)公司 手機(jī)端的網(wǎng)站 營(yíng)銷型網(wǎng)站建設(shè) 青島高端網(wǎng)站建設(shè)公司哪家好 搜索引擎 html和css php程序 青島高端網(wǎng)站建設(shè) 青島不錯(cuò)的英文網(wǎng)站建設(shè)公司 H5 集團(tuán)官網(wǎng) 網(wǎng)站規(guī)劃 新的元素 集團(tuán)公司網(wǎng)站建設(shè) 青島網(wǎng)頁制作 企業(yè)網(wǎng)站 青島網(wǎng)站制作 青島好的網(wǎng)站優(yōu)化公司