欧美成人粉红派对在线不卡_亚洲精品口爆av美女_国产成人乱码一二三区性色qery_日韩加勒比无码成人精品_国产口爆骚妇一区色色

2、彈出合適的鍵盤（60%的網(wǎng)站犯了此錯誤）

　　問題：彈出不合適的鍵盤會降低輸入速度，用戶經(jīng)常會因?yàn)闃?biāo)準(zhǔn)鍵盤上數(shù)字的很小的點(diǎn)擊區(qū)域以及間距而打錯很長一串?dāng)?shù)字。

　　智能手機(jī)上觸屏鍵盤的一個很大局限就是它的尺寸。字符本身也都是非常小的。事實(shí)上，在iPhone4豎屏?xí)r一個字符的大小是4*5.9毫米。

　　再來對照一下蘋果自己的設(shè)計準(zhǔn)則，其中提到所有可點(diǎn)擊的界面元素至少要有6.85*6.85毫米，因?yàn)槿魏涡∮谶@個尺寸的元素點(diǎn)擊準(zhǔn)確度都會非常的差（微軟和諾基亞同樣制定了最小點(diǎn)擊區(qū)域?yàn)?*7毫米）�？梢灶A(yù)見，這將會導(dǎo)致拼寫錯誤。

　　但是通過更改輸入框代碼的一到兩個屬性，你就可以讓用戶的手機(jī)自動顯示所需輸入的最合適的鍵盤。例如，你可以為信用卡號輸入框調(diào)用數(shù)字鍵盤，為電話號碼輸入框調(diào)用撥號鍵盤，為電子郵件地址輸入框調(diào)用電子郵件的鍵盤。這樣可以節(jié)省用戶必須切換傳統(tǒng)鍵盤的時間，并且在輸入數(shù)字的場景中，最大限度的減少輸入錯誤，因?yàn)檫@樣的專用鍵盤按鍵尺寸更大，會減少意外輸錯的機(jī)率。

　　Best Buy的信用卡號輸入框調(diào)用了標(biāo)準(zhǔn)鍵盤，所以用戶必須先切換至數(shù)字和字符鍵盤，然后準(zhǔn)確無誤的輸入16位數(shù)字。這對于被試者是件很困難的事情，他們要來回看著信用卡和手機(jī)，小心翼翼的點(diǎn)擊數(shù)字鍵，不碰到旁邊的鍵。

　　在整個測試中，很多被試者都注意到了專用鍵盤，并對它們贊許有加。事實(shí)上，在iOS中，數(shù)字鍵盤的點(diǎn)擊區(qū)域要比標(biāo)準(zhǔn)鍵盤大471%（數(shù)字鍵盤209*108像素vs標(biāo)準(zhǔn)鍵盤52*76像素）。更重要的是，我們發(fā)現(xiàn)在數(shù)字輸入框里采用數(shù)字鍵盤時錯別字明顯減少。這會導(dǎo)致更少的驗(yàn)證錯誤，反過來，也可以將網(wǎng)站引向一個更好更無縫的購物體驗(yàn)。這對于長數(shù)字隊(duì)列尤為明顯，比如電話號碼以及信用卡號。

　　左圖，一個被試者由于標(biāo)準(zhǔn)鍵盤按鍵尺寸小且鄰近，在輸入“1”的時候不小心按到了橫劃線。這個時候調(diào)用數(shù)字鍵盤會更加合適。右圖，用戶在GAP網(wǎng)站上輸入“日間聯(lián)系電話”時，調(diào)出的是專門優(yōu)化過的鍵盤，按鍵比標(biāo)準(zhǔn)鍵盤大471%。

　　調(diào)用專用鍵盤的另一個好處就是可以表明需要輸入的是什么內(nèi)容，如果輸入框標(biāo)題滑出視線范圍或是用戶不確定要輸入什么的時候，這會很有用。然而，數(shù)字鍵盤也有一定的局限性，因?yàn)樗�不允許用戶輸入拼音字符，只有少量特殊字符或分隔符，也可能連這個都沒有。所以，只有最合適的時候再調(diào)用這樣的鍵盤，這很重要，比如輸入電話號碼、郵政編碼、信用卡號以及信用卡安全碼。同樣的，在調(diào)用鍵盤時，確保你給出的格式樣例是可以復(fù)制的。

　　根據(jù)給出的樣例格式（比如“555-555-5555”）輸入電話號碼在iOS上是不可能的，因?yàn)檎{(diào)出的鍵盤是沒有橫劃線的。（有趣的是，在Android系統(tǒng)上輸入是可以的，這也說明了為什么在多個平臺測試有助于確保在格式樣例只在有些平臺上必須。）

　　說了這么多可用性上的優(yōu)點(diǎn)，你可能會想這種專用鍵盤是被廣泛應(yīng)用的。然而，60%的熱門移動電子商務(wù)網(wǎng)站在對應(yīng)的場景并沒有調(diào)用它們，如電子郵件（電子郵件鍵盤）、電話號碼（撥號鍵盤）以及信用卡號（數(shù)字鍵盤）。

　　技術(shù)上來說，有很多種方式可以調(diào)出數(shù)字鍵盤，每種鍵盤之間略有差別（如撥號鍵盤和數(shù)字鍵盤），不同平臺間行為也會有輕微的不同（iOS，Android等）。大體來說有兩種HTML屬性可以調(diào)用數(shù)字鍵盤，分別是type和pattern屬性。

　　Type屬性承載語義的含義，僅僅當(dāng)輸入時有合適的類型可調(diào)用時才會被用到，這主要是針對電話號碼和電子郵件地址的場景。不過對于數(shù)字輸入，更推薦使用pattern屬性來替代。（注意如果你僅僅是想要瀏覽器調(diào)用鍵盤，并不強(qiáng)制格式，可以加入novalidate屬性。）

　　針對任何電話號碼框，用如下代碼：

　　針對其他你想要調(diào)用數(shù)字鍵盤的輸入框，用如下代碼：

　　針對任何電子郵件地址框，用如下代碼：

　　正如上面提到的，各種數(shù)字鍵盤之間會有一些區(qū)別，在不同平臺之間也會有一些不同。例如，在iOS平臺上，上述代碼調(diào)出的電話鍵盤可以讓用戶輸入數(shù)字以及少量電話相關(guān)的特殊字符和分隔符，而調(diào)起的數(shù)字鍵盤只能輸入數(shù)字。與此同時，在Android平臺上，調(diào)起的電話鍵盤則有著更多的特殊字符，支持更多格式的電話號碼。

　　但是，由pattern屬性調(diào)起數(shù)字鍵盤在Android上根本不支持，相反，它只會調(diào)起常用的字母鍵盤。雖然在iOS和Android平臺上，你都可以使用type=“number”調(diào)起數(shù)字鍵盤，但將type設(shè)置為number帶有語義含義，在很多場景下并不合適（比如信用卡號是一個數(shù)字隊(duì)列，不單單是一個數(shù)字）。

　　所以，我們推薦更為保守的策略，使用pattern=“\d*”，這樣在iOS平臺上可以有更好的體驗(yàn)，在其他不支持該屬性的平臺上也不會有什么影響。（當(dāng)然了，如果輸入框就是針對一個數(shù)字的，比如價格或是數(shù)量，那么顯然應(yīng)該使用type=“number”了。）