让UCH更可亲 注册篇

让UCH更可亲
Chapter 1  注册篇

最近研究UCenter Home，没事情看看代码。
发现UCH有些地方处理的不怎么样，特作此文来修改一些小细节让UCH给可亲。

首先我们从注册的页面讲起。

UCH的注册页面是do.php?ac=register

打开这个页面我们会发现如果开启了验证码之后表单从上到下依次是验证码，用户名，再次输入密码，邮箱。
到这里大家会发现光标的焦点是在用户名上的，而用户名却位于第二项，这样用户要完成注册就需要点击一次鼠标才能转到验证码的文本框。查看了一下模板源代码，用户名的tabindex="2"而验证码的tabindex="1"，出现这种情况的元凶就是这句话

1. $('username').focus();

复制代码

我们可以修改让注册码获取焦点，但是这样的话又有一个问题出现了。
如果没有开启验证码那么验证码的文本框自然不存在，这样js就会报错。所以最好的方法是把注册码下移，并且修改相应的tabindex

注册密码这一栏我们可以看到单元格里有文本框和密码安全程度的现实
由于左侧的注册密码是垂直居中的看起来很变扭，而且密码和确认密码的文本框中间隔开局距离较大，影响两个文本框的关联性。
因此把密码安全程度移动的确认密码的下方。

终于到最后一项邮箱了
这个觉得有个莫名其妙的问题，为什么默认会有个@呢？
使用键盘的tab键还好但是如果是习惯用鼠标的呢？这不是给用户输入设置障碍吗？
都已经告诉用户使输入邮箱了还需要用个@来提示吗？

纵观这个注册页面基本上每个输入都有验证，但是很奇怪邮箱却没有
我们可以在模板的js中发现这样一句话

1. var lastUserName = lastPassword = lastEmail = lastSecCode = '';

复制代码

但是这个模板中没有出现lastEmail，可以看出官方本来是准备添加验证的，但是不知为什么加了个变量就无下文了。
所以我们给邮箱添加一个验证

1.         function checkEmail(){
   
2.                 var email = trim($('email').value);
   
3.                 if(email == lastEmail) {
   
4.                         return;
   
5.                 } else {
   
6.                         lastEmail = email;
   
7.                 }
   
8.                 var cu = $('checkemail');
   
9.                 ajaxresponse('checkemail', 'op=checkemail&email=' + (is_ie && document.charset == 'utf-8' ? encodeURIComponent(email) : email));
   
10.         }
    

复制代码

这个验证涉嫌到PHP文件修改！

修改完成，效果如下，你也可以到这里（http://www.ishenme.cn/do.php?ac=register）查看实际效果


敬请期待 让UCH更友好 第二集

附件提供完整修改文件

好东西，顶了

原帖由 alibuybuy 于 2008-6-19 21:20 发表
没看懂

呵呵

人家说的很详细了啊

目前 email 在最后 显然是不重视
为什么不能把email上移 ，
在注册方式改成email之前
提醒用户email 的重要性

这个是相当的人性化

用户体验很重要啊

一看楼主就是一个思维严谨、注重细节的人，赞一个

有个建议啊```可以注册必须填写QQ号码.邮箱就自动填写QQ邮箱```这样更加有亲和力```而且黏性也会更强啊```不知道这个怎么实现```楼主能试试么?``````````

赞一个

这就是人性化的体验