網(wǎng)站注冊(cè)以及登陸界面方案推薦！

    目前很多網(wǎng)站有選擇用戶(hù)名這個(gè)字段，或者單獨(dú)用戶(hù)手機(jī)、郵箱、微信等方式登陸，不過(guò)這并沒(méi)有錯(cuò)，而是根據(jù)網(wǎng)站的類(lèi)型以及需求來(lái)定，設(shè)計(jì)人員可以自行決定。而下面說(shuō)的是采取手機(jī)和郵箱的注冊(cè)模式。

①用戶(hù)注冊(cè)模式。

1.手機(jī)和郵箱注冊(cè)；----同框，輸入框提示文字。----判定正確性與重復(fù)提示。

-----驗(yàn)證碼。--------------圖文對(duì)應(yīng)入座驗(yàn)證。

-----輸入二次輸入驗(yàn)證。-------輸入框提示密碼位數(shù)與位數(shù)判定-以及密碼二次輸入判定。

----輸入手機(jī)號(hào)/郵箱----手機(jī)驗(yàn)證或者郵箱驗(yàn)證，提示輸入手機(jī)或者郵箱先驗(yàn)證是否驗(yàn)證過(guò)。

-----默認(rèn)勾選用戶(hù)協(xié)議。

----點(diǎn)擊注冊(cè)

------響應(yīng)事件，注冊(cè)成功。

------跳轉(zhuǎn)登陸界面，讓用戶(hù)輸入賬號(hào)密碼登陸。進(jìn)行登陸驗(yàn)證。

至于手機(jī)與郵箱的使用，方便的是后期用戶(hù)的郵件營(yíng)銷(xiāo)活動(dòng)而定的。不然無(wú)法順利把需要表達(dá)的信息傳遞到用戶(hù)手上。比如用郵件，很多微信上都會(huì)收到郵件提示。

2.第三方注冊(cè)。

第三方注冊(cè)，是一個(gè)很方便的，直接用第三方插件來(lái)使用就可以，但是對(duì)于一些網(wǎng)站來(lái)說(shuō)，還是需要對(duì)第三方注冊(cè)的用戶(hù)進(jìn)行標(biāo)記或者綁定，這是出于業(yè)務(wù)或者更多需求，下面就說(shuō)下這點(diǎn)。不需要的可以路過(guò)。

創(chuàng)建新賬號(hào)/綁定已有賬號(hào)

2.1創(chuàng)建新賬號(hào)。

----輸入手機(jī)號(hào)，郵箱，類(lèi)似第一種注冊(cè)。

----輸入密碼---位數(shù)、格式驗(yàn)證。以及二次密碼驗(yàn)證。

----圖片驗(yàn)證碼。

----注冊(cè)成功；

綁定成功，第三方登陸成功。

2.2綁定已有賬號(hào)。

-----輸入賬號(hào)，驗(yàn)證賬號(hào)是否注冊(cè)。

----輸入密碼

------驗(yàn)證碼，圖文驗(yàn)證。

-----驗(yàn)證賬號(hào)，密碼；綁定成功，注冊(cè)成功，跳轉(zhuǎn)上級(jí)頁(yè)面。

PS：其實(shí)，用第三方登陸的人很少去使用上面的方式，大部分都是論壇會(huì)使用到。也很麻煩，多此一舉的感覺(jué)。

②登陸模式。

1.手機(jī)、郵箱，同框。

----判定正確性，手機(jī)、郵箱注冊(cè)與否，如果未注冊(cè)，提示去注冊(cè)。

輸入密碼一次。---密碼框有按鈕可以選擇顯示密碼。

輸入驗(yàn)證碼------圖文驗(yàn)證。

登陸成功，響應(yīng)事件，彈窗提示登陸成功，然后返回上一級(jí)界面。

2.第三方登陸。

其它相應(yīng)位置顯示第三方登陸標(biāo)志。或者首頁(yè)有快捷鍵。

且把第三方登陸的快捷鍵放在明顯位置，即可，這個(gè)省略。

PS：在登陸界面添加注冊(cè)、找回密碼、記住密碼入口與相應(yīng)功能按鈕。

③密碼找回。

密碼找回，找回方式-手機(jī)/郵箱找回。

-----選擇找回方式，必須輸入手機(jī)號(hào)或者郵箱。

-----選擇手機(jī)號(hào)/郵箱，發(fā)送驗(yàn)證碼到手機(jī)或者郵箱。

-----用戶(hù)驗(yàn)證成功

---進(jìn)入密碼重置界面，二次輸入新密碼。

----輸入完成，密碼驗(yàn)證成功，點(diǎn)擊完成重置。

----提示，密碼重置成功，返回登陸界面。

④快捷按鈕以及其他信息。

1.登陸框添加快捷按鈕：不同的網(wǎng)站可以在登陸界面加一些小的快捷鍵，根據(jù)網(wǎng)站的需求來(lái)加，這個(gè)看自身情況。

2.注冊(cè)、密碼找回，登陸等界面，如果是單獨(dú)頁(yè)面，可以添加相應(yīng)匹配的信息。

    （作者：一步蓮華，來(lái)自，站長(zhǎng)資源平臺(tái)：http://afrimangol.com/  ）