文字方塊

發行項
09/02/2023

注意

此設計指南是針對 Windows 7 所建立，尚未針對較新版本的 Windows 進行更新。大部分的指導方針仍以原則方式套用，但簡報和範例不會反映我們目前的設計指導方針。

透過文字方塊，使用者可以顯示、輸入或編輯文字或數值。

一般文字方塊和標籤的螢幕擷取畫面

典型的文字方塊。

注意

與版面配置、字型和球形相關的指導方針會在個別的文章中呈現。

這是正確的控制項嗎？

若要決定使用時機，請考量下列問題：

有效率地列舉所有有效值是否可行？ 如果是，請考慮單一選取清單、清單檢視、下拉式清單、可編輯的下拉式清單或滑杆。
有效資料是否完全不受限制？或者，有效的資料只受限於格式 (限制長度或字元類型) ？ 如果是，請使用文字方塊。
該值代表的資料類型是否已經有特殊的通用控制項？ 範例包括日期、時間或 IPv4 或 IPv6 位址。如果是，請使用適當的控制項，例如日期控制項，而不是文字方塊。
如果資料是數值：
- 使用者是否將設定視為相對數量？ 如果是，請使用滑桿。
- 在變更設定時，獲得即時回應的效果是否為使用者帶來益處？ 如果是，請使用滑杆，可能與文字方塊一起使用。例如，使用者可以輕鬆地使用滑杆選擇色彩，因為它們可以立即看到色調、飽和度或亮度值變更的效果。

設計概念

雖然文字方塊的優點是非常有彈性，但它們有最低條件約束的缺點。可編輯文字方塊的唯一條件約束如下：

您可以選擇性地設定最大字元數。
您可以選擇性地將輸入限制為數值字元， (0 9) 。
如果您使用微調控制項，您可以將微調控制項選項限制為有效的值。

除了其長度和微調控制項的選擇性存在之外，文字方塊沒有任何視覺線索可建議有效值或其格式。這表示依賴標籤將此資訊傳達給使用者。如果使用者輸入不正確文字，您必須處理錯誤訊息。

一般規則是， 您應該使用您可以執行的最受限控制項。使用未受限制的控制項，例如文字方塊做為最後一個方法。也就是說，當您考慮條件約束時，請記住全域使用者的需求。例如，限制為美國郵遞區號的控制項並未全球化，而是接受任何郵遞區號格式的未限制文字方塊。

使用模式

文字方塊是具有數個可能用途的彈性控制項。

標籤	值
資料輸入用來輸入或編輯簡短字串的單行未限制文字方塊。	單行、未受限制的文字方塊。
格式化的資料輸入一組簡短、固定大小的單行文字方塊，用來輸入具有特定格式的資料。	用於格式化資料輸入的文字方塊。注意：自動結束功能會自動將輸入焦點從一個文字方塊前進到下一個文字方塊。這種方法的其中一個缺點是資料無法複製或貼上為單一單位。
輔助資料輸入單行、未受限制的文字方塊，用來輸入或編輯字串，結合命令按鈕，可協助使用者選取有效的值。	在此範例中，Browse 命令可協助使用者選取有效的值。
文字輸入用來輸入或編輯長字串的多行未限制文字方塊。	多行、未受限制的文字方塊。
數字輸入單行、僅限數值的文字方塊，用來輸入或編輯數位，以及選擇性的微調控制項，以輔助滑鼠輸入。	用於數值輸入的文字方塊。文字方塊及其相關聯微調控制項的組合稱為微調方塊。
密碼和 PIN 輸入單行、未受限制的文字方塊，用來安全地輸入密碼和 PIN。	用來輸入密碼的文字方塊。
資料輸出單行唯讀文字方塊，一律不會顯示框線，用來顯示簡短字串。	不同于靜態文字，如果使用文字方塊顯示的資料可以捲動 (如果資料大於控制項) 、選取和複製，則很有用。用來顯示資料的單行唯讀文字方塊。
文字輸出用來顯示長字串的多行唯讀文字方塊。	用來顯示資料的唯讀文字方塊。

指導方針

一般

停用文字方塊時，也停用任何相關聯的標籤、指令標籤、微調控制項和命令按鈕。
使用自動完成來協助使用者輸入可能重複使用的資料。範例包括使用者名稱、位址和檔案名。不過，請勿針對可能包含敏感性資訊的文字方塊使用自動完成，例如密碼、PIN、信用卡號碼或醫療資訊。
不要讓使用者不必要地捲動。 如果您預期資料大於文字方塊，而且您可以立即讓文字方塊變大，而不會損害版面配置，請調整方塊的大小，以消除捲動的需求。

不正確：

在此範例中，文字方塊應該要花很多時間來處理其資料。
捲軸：
- 不要將水準捲軸放在多行文字方塊上。 請改用垂直捲動和換行。
- 請勿將任何捲軸放在單行文字方塊上。
針對數值輸入，您可以使用微調控制項。 針對文字輸入，請改用下拉式清單或可編輯的下拉式清單。
請勿使用自動結束功能，但格式化的資料輸入除外。 焦點的自動轉移可能會讓使用者感到意外。

可編輯的文字方塊

您可以限制輸入文字的長度。 例如，如果有效的輸入是介於 0 到 999 之間的數位，請使用限制為三個字元的數位文字方塊。所有使用格式化資料輸入的文字方塊部分都必須具有簡短、固定長度。
具有資料格式的彈性。 如果使用者可能會使用各種不同的格式來輸入文字，請嘗試處理所有最常見的格式。例如，許多名稱、數位和識別碼都可以使用選擇性空格和標點符號來輸入，而且大寫通常不重要。
如果您無法處理可能的格式，請使用格式化的資料輸入來要求特定格式，或指出標籤中的有效格式。

可以接受：

在此範例中，文字方塊需要特定格式的輸入。

較佳：

在此範例中，格式化的資料輸入模式是用來要求特定格式。

最好：

在此範例中，文字方塊會處理所有可能的格式。
選擇輸入長度上限時，請考慮格式彈性。例如，有效的信用卡號碼最多可以使用 19 個字元，因此將長度限制為較短的任何專案，會讓您難以使用較長的格式來輸入數位。
如果使用者較可能貼上冗長且複雜的資料，請勿使用格式化的資料輸入模式。 相反地，請保留格式化的資料輸入模式，以瞭解使用者較可能輸入資料的情況。

在此範例中，不會使用格式化的資料輸入模式，讓使用者可以貼上 IPv6 位址。
如果使用者更可能重新輸入整個值，請選取輸入焦點上的所有文字。 如果使用者更可能編輯，請將插入號放在文字結尾。

在此範例中，使用者比編輯更可能取代，因此會在輸入焦點上選取整個值。

在此範例中，使用者較可能新增關鍵字而不是取代文字，因此插入號會放在文字的結尾。
如果新行字元是有效的輸入，請一律使用多行文字方塊。
當文字方塊適用于檔案或路徑時，一律提供 [流覽] 按鈕。

數值文字方塊

選擇最方便的單位，並將單位加上標籤。 例如，請考慮使用毫秒而非 (，反之亦然) 、百分比而非直接值 (，反之亦然) 等等。

正確：

在此範例中，單位會加上標籤，但需要使用者輸入十進位數。

較佳：

在此範例中，文字方塊使用更方便的單元。
每當它很有用時，請使用微調控制項。 不過，有時候微調控制項並不實用，例如當使用者需要輸入許多大型數位時。在下列情況下使用微調控制項：
- 輸入可能是小數位，通常低於 100。
- 使用者可能會對現有數位進行小變更。
- 使用者比鍵盤更可能使用滑鼠。
每當出現時，靠右對齊數值文字：
- 有一個以上的數值文字方塊。
- 文字方塊垂直對齊。
- 使用者可能會新增或比較值。
正確：

在此範例中，數值文字靠右對齊，可讓您輕鬆地比較值。

不正確：

在此範例中，數值文字不正確地靠左對齊。
一律靠右對齊貨幣值。
請勿將特殊意義指派給特定數值，即使應用程式在內部使用那些特殊意義也一樣。請改用核取方塊或選項按鈕進行明確的使用者選取。

不正確：

在此範例中，值 -1 具有特殊意義。

正確：

在此範例中，核取方塊會讓選項明確。

密碼和 PIN 輸入

請一律使用密碼通用控制項，而不是建立您自己的控制項。 密碼和 PIN 需要安全地處理特殊處理。

如需更多指導方針和範例，請參閱球形圖。

文字輸出

請考慮針對大型的多行唯讀文字使用白色背景系統色彩。 白色背景可讓文字更容易閱讀。灰色背景上的許多文字不建議閱讀。

如需背景色彩的詳細資訊，請參閱字型。

資料輸出

請勿使用單行、唯讀文字方塊的框線。 框線是文字可編輯的視覺線索。
請勿停用單行、唯讀文字方塊。 這可防止使用者選取文字，並將文字複製到剪貼簿。如果超過其界限的大小，它也會防止使用者捲動資料。
除非使用者可能需要捲動或複製文字，否則不要在單行、唯讀文字方塊上設定制表位。

輸入驗證和錯誤處理

因為文字方塊通常不受限制只接受有效的輸入，所以您可能需要驗證輸入並處理任何問題。驗證不同類型的輸入問題，如下所示：

如果使用者輸入不正確字元，請忽略字元，並顯示說明有效字元的輸入問題方塊。

在此範例中，氣球會報告不正確的輸入字元。
如果輸入資料的值或格式無效，當文字方塊失去輸入焦點時，會顯示輸入問題方塊。
如果輸入資料與視窗上的其他控制項不一致，請在整個輸入完成時提供錯誤訊息，例如當使用者按一下 [確定] 進行強制回應對話方塊時。

除非使用者無法輕鬆地更正錯誤，否則請勿清除不正確輸入資料。 這麼做可讓使用者更正錯誤，而不需開始。例如，您應該清除不正確的密碼和 PIN，因為使用者無法輕鬆地更正這些密碼。

如需更多指導方針和範例，請參閱錯誤訊息和批註。

提示

提示是置於文字方塊內作為預設值的標籤或簡短指令。不同于靜態文字，當使用者在文字方塊中輸入某個專案或取得輸入焦點時，提示就會從畫面消失。

包含標籤的提示文字方塊螢幕擷取畫面：搜尋

典型的提示。

在下列情況下使用提示：

螢幕空間位於使用標籤或指令的進階版，例如工具列上。
提示主要是為了以精簡的方式識別文字方塊的目的。使用者在使用文字方塊時必須看到的重要資訊不得為。

請勿只使用提示來指示使用者輸入某個專案或按一下按鈕。例如，不要撰寫顯示輸入檔案名的提示文字，然後按一下 [傳送]。

使用提示時：

以斜體灰色和一般黑色的實際輸入文字繪製提示文字。提示文字不得與真實文字混淆。
保持提示文字簡潔。您可以使用片段，而不是完整的句子。
使用句型大寫。
請勿使用結束標點符號或省略號。
提示文字不可編輯，且使用者按一下或索引標籤到文字方塊中後應該消失。
- 例外： 如果文字方塊有預設的輸入焦點，則會顯示提示，並在使用者開始輸入之後消失。
如果文字方塊在失去輸入焦點時仍為空白，則會還原提示文字。

建議的大小調整和間距

一行和兩行文字方塊的圖

文字方塊的建議調整大小和間距。

文字方塊的寬度是預期輸入大小的視覺線索。調整大小文字方塊時：

選擇適合最長有效資料的寬度。 在大部分情況下，使用者不需要捲動他們輸入或檢視的最長可能字串。
針對任何文字 (包含 30% (最多 200% 的簡短文字) ，但不會包含將會當地語系化之數位) 的額外 30%。
如果預期的輸入沒有特定大小，請選擇與視窗上其他文字方塊或控制項一致的寬度。
調整多行文字方塊的大小，以顯示文字的整數行數。

所有文字方塊都需要標籤。將標籤撰寫為單字或片語，而不是句子、以冒號結尾，以及使用靜態文字。

例外狀況：
- 有提示的文字方塊位於進階空間的位置。
- 針對標記，用於 格式化資料輸入 的文字方塊群組應該視為單一文字方塊。
- 如果文字方塊屬於選項按鈕或核取方塊，而且會由其標籤以冒號結尾導入，請勿在文字方塊中加上額外的標籤。
- 省略重新指定主要指令的控制項標籤。 在此情況下，主要指令會採用冒號 (，除非它是) 和存取金鑰的問題。
  
  可以接受：
  
  在此範例中，文字方塊標籤只是主要指令的重新整理。
  
  較佳：
  
  在此範例中，會移除備援標籤，因此主要指令會採用冒號和存取金鑰。
指派唯一的存取金鑰。如需便捷鍵指派指導方針，請參閱鍵盤。
使用句型大寫。
將標籤放在文字方塊的左邊或上方，並將標籤對齊文字方塊的左邊緣。如果標籤位於左側，則垂直對齊標籤文字與文字方塊文字。

正確：

在這些範例中，頂端的標籤會與文字方塊的左邊緣對齊，而左邊的標籤與文字方塊中的文字對齊。

不正確：

在這些不正確的範例中，頂端的標籤會與文字方塊中的文字對齊，而左邊的標籤與文字方塊頂端對齊。
您可以指定單位 (，例如，標籤之後的括弧) 秒或連接。
如果文字方塊接受任意的最小字元數，您可以指出標籤中的輸入上限。文字方塊寬度也應該建議大小上限。

在此範例中，標籤會提供最大字元數。
請勿讓文字方塊的內容 (或其單位標籤) 句子的一部分，因為這是無法當地語系化的。
如果文字方塊可用來輸入數個專案，請清楚說明如何分隔標籤中的專案。

在此範例中，會在標籤中指定專案分隔符號。
如需指示必要輸入的指導方針，請參閱對話方塊中的必要輸入。

指令標籤

如果您需要新增文字方塊的相關指示文字，請將它新增至標籤上方。使用完整句子搭配結尾標點符號。
使用句型大寫。
其他實用但不需要的資訊應該保持簡短。將此資訊放在標籤和冒號之間的括弧中，或在文字方塊下方沒有括弧。

在此範例中，其他資訊會放在文字方塊下方。

提示標籤

保持提示文字簡潔。您可以使用片段，而不是完整的句子。
使用句型大寫。
請勿使用結束標點符號或省略號。
如果提示會指示使用者輸入文字方塊旁按鈕將採取動作的資訊，只要將按鈕放在文字方塊旁即可。請勿使用提示指示使用者按一下按鈕 (例如，不要撰寫提示文字，拖曳檔案，然後按一下 [傳送) ]。

文件

參考文字方塊時：

使用類型來參考需要輸入或貼上的使用者互動;否則，如果使用者可以使用其他方法將資訊放入文字方塊中，請使用 Enter，例如從清單中選取值或使用 [流覽] 按鈕。
使用 select 來參照唯讀文字方塊中的專案。
使用確切的標籤文字，包括其大寫，以及包含文字方塊。請勿包含便捷鍵底線或冒號。請勿將文字方塊稱為文字方塊或欄位。
可能的話，請使用粗體文字格式化標籤。否則，只有在需要以避免混淆時，才將標籤放在引號中。

範例：在 [ 密碼 ] 方塊中輸入您的密碼，然後按一下 [ 確定]。
如果文字方塊需要特定格式，則只記載最常用的可接受的格式。讓使用者自行探索任何其他格式。您想要彈性地使用資料格式，但這樣做不應該產生複雜的檔。

正確：

使用 1234-56-7890 格式輸入元件的序號。

不正確：

使用下列任何格式輸入元件的序號：

1234567890

1234-56-7890

1234 56 7890