表單設(shè)計(jì)中 “星號(hào)(*)”的使用分析

5 評(píng)論 9665 瀏覽 12 收藏 9 分鐘

編輯導(dǎo)語(yǔ):在涉及到一些表單頁(yè)面的設(shè)計(jì)時(shí),必填項(xiàng)目常常需要用“*”來進(jìn)行特殊標(biāo)記。本篇文章作者從十分常見的星號(hào)(*)出發(fā),從“星號(hào)(*)”起源到現(xiàn)在的用戶界面應(yīng)用,將相關(guān)信息匯總歸納,一起來看。

前言

這次的起因是在工作涉及到一些B端表單頁(yè)的設(shè)計(jì),其中必填項(xiàng)目需要用“*”來進(jìn)行特殊標(biāo)記,這本來是大家常見共識(shí)的點(diǎn),但慢慢發(fā)現(xiàn),有的頁(yè)面中幾乎全部都是必填項(xiàng),就開始思考既然全都需要用“*”標(biāo)記,那標(biāo)記還有意義嗎?于是就去查閱了部分資料,從“星號(hào)(*)”起源到現(xiàn)在的用戶界面應(yīng)用,將相關(guān)信息匯總歸納,集合這一篇。

一、“星號(hào)*”是什么?

星號(hào)(英文:asterisk,拉丁文:asteriscum,意謂“小星星”,來自希臘文 ?στερ?σκο?)是印刷符號(hào)或字形。之所以稱為星號(hào)是因?yàn)榕c一般人印象中的星星相似。計(jì)算機(jī)科學(xué)家與數(shù)學(xué)家常稱之為“star”或“星”。

星號(hào)起源于歐洲封建時(shí)代,族譜印制者要表示出生日期的符號(hào)。最初的形狀是六芒,每一芒都像是由中央散開的淚珠。因此,有些電腦界的圈子稱之為“splat”(狀聲詞,類似中文的“啪”),或許是因?yàn)樵S多早期的列式打印機(jī)印出來的星號(hào)看起來像是被壓扁的蟲子。

現(xiàn)代的計(jì)算機(jī)操作體統(tǒng)已經(jīng)可以同時(shí)兼容多種字體,因此使用不同的輸入法,所展示出的星號(hào)*也各不相同。

二、“星號(hào)(*)”的使用場(chǎng)景

1. 標(biāo)記符號(hào)

  • 在文章表達(dá)中,會(huì)對(duì)一些特殊的字、詞、句后部進(jìn)行標(biāo)示,并在頁(yè)尾處進(jìn)行進(jìn)一步解釋。
  • 對(duì)于文章中存在語(yǔ)病進(jìn)行標(biāo)記,并在其他地方進(jìn)行解釋說明。
  • 對(duì)于一些需要強(qiáng)調(diào)的內(nèi)容區(qū)進(jìn)行標(biāo)記(如上文提到的表單)。

2. 替代字符

  • 在某些電腦界面中(Unix shell及微軟的命令提示字元),“*”是通配符,可以代表任何一種字符。
  • 在某些具有社交屬性的平臺(tái)上(論壇、游戲內(nèi)對(duì)話等),“*”常被用來替代被“和諧”的字眼。
  • 在電腦中x(乘號(hào))和X(字母)容易混淆,所以會(huì)用*來指代乘號(hào)。

3. 敏感信息

  • 部分登錄頁(yè)的輸入密碼會(huì)用“*”代表已輸入的字符。
  • 具有個(gè)人隱私身份證號(hào)、手機(jī)號(hào)等,在需要展示的場(chǎng)景中會(huì)用“*”代替部分字符。

4. 數(shù)學(xué)符號(hào)

  • 代表計(jì)算符號(hào),如比如 f ? g 是 f 與 g 的卷積。
  • 代表某種數(shù)學(xué)屬性,如向量空間 V 的對(duì)偶空間符號(hào)為 V*。

5. 編程語(yǔ)言

  • 在C語(yǔ)言與C++中,星號(hào)被用來獲得指針的內(nèi)容。它是得到變量地址的 & 算子的逆運(yùn)算。它還被用來聲明指針變量。
  • 在 Common Lisp 編程語(yǔ)言,全局變量的名字按慣例陪襯上星號(hào),*LIKE-THIS*。

三、界面設(shè)計(jì)的應(yīng)用

1. 用還是不用?

那我們回到之前的那個(gè)問題,同一頁(yè)內(nèi)表單設(shè)計(jì)中如果存在大量標(biāo)記符號(hào),是否可以省略呢?答案是絕對(duì)不可以。要明確的一點(diǎn)是,表單上標(biāo)記符號(hào)的目的是提醒用戶注意這里是一個(gè)重要項(xiàng),要謹(jǐn)慎仔細(xì)的進(jìn)行操作(常見為必填項(xiàng))。

那除了使用標(biāo)記符號(hào)外, 也可以在表單下方進(jìn)行單獨(dú)說明告知用戶進(jìn)行相應(yīng)操作(此處要和驗(yàn)證提示的說明文字區(qū)分開)。

回到一開始對(duì)于“標(biāo)記符號(hào)(*)”的解釋,目的是為了提醒用戶注意,如果用戶已經(jīng)知道該項(xiàng)為重要項(xiàng),在某些特殊場(chǎng)景,例如“登錄頁(yè)”都需要輸入賬號(hào)密碼,已經(jīng)是大家的共識(shí)(雅各布定律)的情況下,可以不進(jìn)行特殊標(biāo)示。

需要注意的是注冊(cè)頁(yè)是必須要進(jìn)行標(biāo)示的,需要根據(jù)實(shí)際業(yè)務(wù)情況選擇需要將哪些標(biāo)示為必填項(xiàng)。

2. 怎么用

首先要明確一點(diǎn),在界面設(shè)計(jì)中,“*”既有標(biāo)示符號(hào)的屬性,其本身具有字符屬性。因此需要注意在使用標(biāo)示符屬性時(shí),“*”是一個(gè)獨(dú)立的元素。因?yàn)椤?”經(jīng)常和表題一起,就會(huì)有很多設(shè)計(jì)師直接在表題同一個(gè)文本框內(nèi)打出一個(gè)*字符,這其實(shí)在邏輯上是不對(duì)的(盡管看起來一樣)。

標(biāo)記符號(hào)(*)的放置位置并沒有一個(gè)統(tǒng)一的標(biāo)準(zhǔn),在查閱大廠規(guī)范后發(fā)現(xiàn)放在表題前、表題后并沒有一致的標(biāo)準(zhǔn),在實(shí)際項(xiàng)目中優(yōu)先選擇放在前面,因?yàn)檫@種情況更多,用戶更容易接受。如果有其他的想法,注意保持全局統(tǒng)一。

3. 常見錯(cuò)誤

前面說過“*”在作為標(biāo)示符號(hào)時(shí),是一個(gè)獨(dú)立的元素,那么在一個(gè)頁(yè)面中元素之間應(yīng)該符合整體的柵格規(guī)范。如果直在表題框內(nèi)打一個(gè)*,那么*就會(huì)和文字貼在一起,有的設(shè)計(jì)師會(huì)打兩個(gè)空格作為間距來改善視覺效果,這種做法仍然有些草率。在Ant Design中“*”和表題之間間距為4px。

后記

在上文介紹了關(guān)于“*”的基本知識(shí)和界面設(shè)計(jì)中的使用方式,像是這種被大家習(xí)以為常的小細(xì)節(jié),很容易被忽略。在平時(shí)的實(shí)踐過程中,應(yīng)該多注意這些“共識(shí)性“的內(nèi)容,并在系統(tǒng)學(xué)習(xí)分析后,再落實(shí)在自己的設(shè)計(jì)之中。

資料參考:

  • https://zh.wikipedia.org/wiki/%E6%98%9F%E8%99%9F
  • https://baike.baidu.com/item/%2A
  • https://ant-design.gitee.io/docs/spec/introduce-cn
  • https://design.teambition.com/
  • https://arco.design/docs/spec/introduce
  • https://element.eleme.cn/#/zh-CN/component/installation
  • https://design.youzan.com/design/introduce.html
  • https://tdesign.tencent.com/design/values
  • https://www.lightningdesignsystem.com/

 

本文由 @YMOOOM 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自Unsplash,基于 CC0 協(xié)議。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 30%以內(nèi)的必填字段加*,如果全必填就不加*。需要用統(tǒng)一的通知或者告示來同步給填寫用戶。

    來自北京 回復(fù)
  2. 星號(hào)標(biāo)紅確實(shí)可以第一眼就看出有什么必填有什么重要的項(xiàng)目,但如果表單內(nèi)都是這樣的,那也就不必要了

    來自福建 回復(fù)
  3. 同一頁(yè)內(nèi)表單設(shè)計(jì)中如果存在大量標(biāo)記符號(hào),這給人觀感其實(shí)很不好。

    來自江西 回復(fù)
  4. 學(xué)到了,原來星號(hào)有這么多說法,不過行程碼要是帶星號(hào)還真的挺煩

    來自湖北 回復(fù)
  5. 使用不同的輸入法,所展示出的星號(hào)*也各不相同,這個(gè)影響說大也不大,說小也不小

    來自江西 回復(fù)