如何排放表單標籤介紹的位置?

2022-05-05 04:00:08 字數 1561 閱讀 6831

當涉及到表單的設計和開發,其中最熱門的話題之一就是表單標籤的位置。

表單標籤位置有多種不同的排版方案選擇,但很多文章關於這個問題只涉及到部分討論和分析。而在短時間內,你應該如何選擇乙個比較好、適合你的排版方案?

標籤在字段上方;

標籤在字段左側,並且左對齊;

標籤在字段左側,並且右對齊;

標籤在字段的裡面;

標籤作為提示文字出現;

下面我們一起把表單標籤位置的所有排版方案優點和缺點一一枚舉出來,通過對比各種方案來選擇最佳的方案。

1、標籤在字段上方

優點:缺點:

2、標籤在字段左側,並且左對齊

優點:缺點:

3、標籤在字段左側,並且右對齊

優點:缺點:

4、標籤在字段裡面

優點:缺點:

5、標籤作為提示文字出現

優點:缺點:即使你沒有詳細地檢視以上排版方案的優缺點, 也能很明顯知道弊多於利的是:

因此,在大多數情況下,上面兩種都是較不好的方案。相反,大多數情況下可以考慮使用以下方案:

1、填寫**所在的可視區域比較小?

小範圍的可視區域,標籤在字段上方是最佳選擇。

2、通過觸控來訪問表單?

避免使用標籤在字段裡面或作為提示文字出現。

3、標籤長度比較短?

標籤在字段左側是最佳選擇。

4、標籤長度比較長?

可以選擇標籤在字段上方或者左側,並且是左對齊。

5、表單會被翻譯成其他語言?

標籤在字段上方為翻譯多語言提供了最大的靈活性。

6、表單有哪些型別的字段?

如果表單不僅僅有文字框字段,則不要選擇標籤在字段裡面和作為提示文字出現。

7、哪種比較容易實現和維護?

標籤在字段上方花費的開發時間是最短的,其次是標籤在字段左側。

8、哪種需要較高技術水平?

標籤在字段裡面和作為提示文字出現需要較專業的開發人員花費大量時間去實現。

乙個表單

像介面設計中的其他元素一樣,表單標籤排放位置的一致性會幫助使用者快速完成表單內容填寫並且能夠減少錯誤發生。這是因為人的大腦有慣性思維,當表單標籤排放位置保持一致性,大腦就會迅速學習在**尋找標籤和其對應的字段。所以,盡量保持每個表單標籤排放位置的一致性!

多個表單

如果使用者遇到其他多數的表單而不僅僅是你設計的表單時,一致的可用性會在很大程度上幫助使用者去理解其他的表單。這就意味著標籤的排放位置不僅僅是在單個表單是最好的選擇,還要考慮和其他表單保持一致性。

例如:在你當前填寫內容的表單中,標籤在字段上方是最佳的選擇。但其他大多數的表單採用標籤在字段左側則是最佳的選擇。

表單標籤位置是乙個激烈爭論的話題,許多人快速的選用一種方法來彰顯他的實力。實際上,選擇那種方案需要細緻入微的判斷,但是這並不意味著要在所有場景下都使用一種方案。你應該根據當前表單的使用場景,對比各種表單標籤定位的優點、缺點,從而選擇該表單最佳的標籤定位。

HTML table form表單標籤的介紹

本篇主要介紹 table form標籤以及表單提交方式。目錄1.標籤 在html 中定義 布局。表單主要用於向伺服器傳輸資料 如常見的登入 註冊頁面。在上面的form 中輸入如下 賬號 admin 密碼 123456 點選提交後 url變為 http localhost 4778 ashx logi...

form表單標籤及屬性的介紹

一 表單標籤 常用屬性 action 跳轉到什麼頁面 method 以什麼模式提交 geturl有長度限制 ie6.0 url 最大長度 2083 個字元 超過無法提交 ie7.0 最大長度 2083 個字元 超過最大長度仍然可以提交但是只能提交 2083 個字元opera 9.52 最大長度764...

script標籤的位置

在我們編寫 的時候,會在頁面內使用 script 標籤來寫js,雖然理論上script標籤的位置放在 可以,但是還是有一點區別的。為什麼很多人把script標籤放在底部 初學者在學習js的時候看見很多demo裡面的script標籤寫在底部,但是卻不是很清楚為什麼,下面來解釋一下 雖然理論上放在 都是...