手机版网站制作中长表单只有如此设计才能留住用户_网站设计_建站学院

手机端的应用愈加广泛，用户不再局限于B端商品的需要，网站制作中愈加多的企业选择同步做手机版网站。基于顾客业务需要，有时用户在操作过程中，不可防止的需要填写不少表单，针对于手机端长表单，应该怎么样设计才能给用户更好的体验呢?

手机端网页长表单的设计，根据设计思路的不同，一般有三种主策略，如下所示手机版网站制作中长表单只有如此设计才能留住用户一个界面将所有表单信息展示出来，假如想查找某些填写的信息也变得更容易，相对于主策略2和3，降低了页面跳转操作和查询。

缺点手机版网站制作中长表单只有如此设计才能留住用户

策略1.0，假如提交按钮放在表单之后，那样用户的视觉流和操作感觉是一致的，流畅而自然。但会出现一个问题，用户在输入信息时，键盘调用会遮挡到提交按钮。Android手机上的输入法都可以点击输入法上的按钮将键盘推下去。而iOS原生输入法无法推下去，只能点击其他非编辑地区才能推下键盘。如此就看上去非常的麻烦，用户或许会忽视掉提交按钮。

策略1.1，解决了提交按钮会被键盘挡住的缺点，但视觉流和操作行为错乱，用户在屏幕底部输入完成之后，视觉和手指要返回到顶部操作。

策略1.2，提交按钮底部悬浮，解决了策略1.1的视觉流和操作紊乱的问题，解决了策略1.0提交按钮被隐藏的问题，但当输入文本，调出键盘时，依然会被挡住。

用底部悬浮按钮的场景是操作按钮尤为重要，比如手机淘宝的立即购买和加入购物车。

同时底部悬浮按钮不适用于文本操作类。比如文章说的长表单文本输入。当输入文本，调出键盘时，依然会被挡住。

底部悬浮按钮适用于非文本输入的用法场景。从手机淘宝、新浪微博可以看出，适用于在界面中非文本输入、提供一个功能入口或者是界面非文本输入的选择信息的确认。

主策略2的设计讨论

优点手机版网站制作中长表单只有如此设计才能留住用户来回跳转，操作负荷较大，会把用户绕晕。

在策略2.0中用户填写完成的分组和未分组填写分组区别不开，将策略2.0进行优化，比如填写完成后，会出现已完成的标签，提示用户已完成和没有完成不一样的状况(如策略2.1)

主策略3的设计讨论

Facebook曾针对分步注册与非分步注册做过A/B Test，其结论指出分步注册的实际转化的比例远高于非分步注册。这样来看，非分步注册强行降低注册页面，不如适合拉长战线，给用户轻负荷的操作，让用户在无声无息中完成注册步骤。

优点手机版网站制作中长表单只有如此设计才能留住用户假如用户操作到了第三步，需要返回一步确认填写信息的准确性，那样用户需要两次返回。

用户填写的信息做保存(缓存)，用户返回上一步，填写的数据做保留。H5依然适用，用户填写的数据保存在数据库，用户返回上一步时，同时刷新载入数据库记录的数据。