您现在的位置: 万盛学电脑网 >> 程序编程 >> 网页制作 >> Html5 >> 正文

web前端开发折叠表单的使用方法介绍

作者:佚名    责任编辑:admin    更新时间:2022-06-22

很多博客和新闻网站上的评论表单看上去都不是令人愉悦的元素。为什么呢?因为它们绝大多数都不够友好,不是吗?当你准备发表一条评论,你只是单纯希望输入评论而已。相反的,一种典型的表单会问你各种其他无关的东西,非常烦人。下面我们给大家介绍一下web前端开发折叠表单的使用方法吧!

为了促使用户发表更多评论,我们可以折叠表单,仅仅展现最为关键的元素:评论框。当用户点击输入框,你可以相应的展开表单。我们可以在纽约时报测试版网站上找到这种进阶展开的实际例子。

web前端开发折叠表单的使用方法

你可以更进一步,在展开表单时光标聚焦评论框。然而这一方法有一个问题:一个关键的交互设计原则是这样说的,行为应发生在离交互产生最近的地方(焦点附近)。因此我们还可以再进一步,为评论框增加动画来引导用户注意到评论框上:

web前端开发折叠表单的使用方法

你甚至可以将评论框固定至顶部,根据用户的操作展开,展现它下面更多的内容。

正如你看到的,这减少了杂乱同时令评论表单更具吸引力。那么如果将所有以往评论也折叠起来呢?

将评论折叠,并用滚动条表示正文的长度,而不是整个页面的长度。一个常见的做法就是当用户到达页面底部的时候自动加载评论。我们应该避免强制用户点击,除非有更好的理由这样做。

以上就是我们给大家介绍的web前端开发折叠表单的使用方法了,希望大家继续关注我们的网站!