Ⅰ 关于Web表单设计的经验分享
表单在UI设计中的出现场景还是比较多的，尤其是在一些To B的产品设计中。最近自己有做大量web 表单设计，就想把自己学到的一些关于表单设计的知识点分享给大家～
一、什么是表单？
表单在网页中的主要功能是负责采集数据以及向服务器传送数据的。表单是采集用户信息数据重要的途径。好的表单设计能提升信息采集的效率与成功率。不好的表单设计会影响用户心情，体验差，导致信息采集不成功甚至带来利益的损失。
二、表单的构成
表单通常由标签、输入域、操作按钮、这三部分构成。
标签
标签我们可以把它理解为标题，告诉用户该表单需要填写什么信息、该表单需要采集什么内容。标签通常出现在输入域的左边、顶部、或者输入域内。
标签按所填信息的必要性分为必填项和非必填项，一般我们会在必填项的标签内容加上＊号。＊号的的摆放位置有下面两种情况：
1.当标签与输入域居中对齐时，建议把＊号放在标签左侧。
因为＊号比较显目，用户往往第一眼会先看到它，然后按照用户从左往右的阅读习惯，视觉落点分别为文字标签、输入域。考虑到表单的填写效率，＊号位于左侧的表单阅读起来会更加顺畅。所以当标签与输入域居中对齐时，把＊号放在标签左侧会更好。
2.当标签与输入域左对齐时，建议把＊号放在标签右侧。
由于人们纵向的阅读习惯，视线会成F型。＊号在左侧还是在右侧并不会对用户视觉落脚点造成太多困扰，另外考虑到对齐的形式，＊号放在标签右侧会更好。
输入域
输入域是录入用户各种类型信息的重要交互区域。输入域包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框、和文件上传框等等。
不知道这些输入域的区别的小伙伴可以去ant design官网学习一下，传送门：
https://ant.design/components/overview-cn/
因为输入域是录入信息很重要的交互区域，在设计时我们应该考虑用户输入的多种场景去设计。我们可以将用户的输入过程分为输入前、输入中、输入后。根据每一种场景中细化我们的设计。比如在输入中：我们要考虑光标的设计、输入文字信息的设计，信息提示等，在输入后：我们要考虑信息输入错误应该给予怎样的视觉反馈等。总之考虑得越细致，越能提高信息录入的成功率。
操作按钮
操作按钮是在用户填写完表单各项内容后，所要进行的操作动作，来完成或者结束当前操作流程。操作按钮分为全局操作按钮与局部操作按钮。全局操作按钮控制整个表单，比如提交、发送等操作按钮。局部操作按钮是对某一范围的内容起作用，比如编辑、删除操作。
三、表单设计常见问题
1.标签采用哪种对齐方式更好？
在我们的实际项目中，通常会因为文案的长短不一，导致我们不知道该采用哪种对齐方式。标签的处理原则就是要要尽量对齐，采用哪种对齐方式应考虑具体的制约因素和目标来定。
左对齐
当标签采用左对齐的方式的时，因为文字标签的长度不统一，导致标签与输入框的间距是不可控的。这就会造成设计的通用性不强，以及横向空间的浪费。
如果采用左对齐的形式，就要尽量去保持文字标签的长度一致，比如通过字距的调整让文字标签的长度保持一致或者通过留足留白空间，这样设计上会更统一。以为例，采取左对齐形式，但是它留足了文字标签与输入域之间的距离，让表单看上去更统一和谐，不足的就是造成了部分空间的浪费。
顶对齐
采用顶对齐的形式，会让标签和输入域垂直显示，纵向布局的信息呈现效果会更好，从而提高用户填写的效率。顶对齐因为垂直排布，会造成纵向空间的浪费，但在横空间上比较节省，比较适用于横向宽度较窄的页面。
▵顶对齐
右对齐
右对齐跟左对齐一样会因为标签长度不可控。导致设计的通用性不强，以及横向空间的浪费，但节约了纵向空间。
▵右对齐
在这几种对齐方式中，用户浏览信息的速率顶对齐>右对齐>左对齐。顶对齐形式适合简易表单、右对齐与左对齐表单适合复杂表单。
2.操作按钮应该用哪种设计形式比较好？
对于全局的操作按钮会用常规的按钮样式，全局按钮分为主按钮与次按钮。
主按钮
主按钮是界面中比较重要的功能操作按钮，比如提交、保存等一些正向的操作。主按钮在视觉层级上最高，能够引导用户很快的找到核心的操作并点击。主按钮通常是纯文本或图文结合的面性形式。图文结合的形式能吸引用户注意，也帮助用户理解该按钮的操作含义。
次按钮
次按钮的层级相对于主按钮层级要弱一些，通常采用线性形式。在一个页面中可以出现多个次按钮。
对于局部操作按钮的设计形式可以是文字按钮、图标按钮，也可以是图标＋文字的形式。至于应该应用哪种形式就要结合具体端场景去考虑。
图标按钮
图标按钮就是用图标来代表该操作的含义，能够直观的表达按钮的功能。在设计的时候我们需要注意图标是易于理解的、是用户熟悉的。图标按钮的设计通常都会配上悬浮框设计，也就是当用户鼠标停留在该图标按钮上会出现对该按钮的文字释义的悬浮框。以微信公众号为例，当鼠标停留在编辑图标那时会出现黑色的悬浮框对其进行解释，让用户理解此按钮的意义，让用户放心操作。
在web设计中，由于按钮的种类与使用场景比较多，建议局部的操作按钮使用线性图标，让它的层级相对其他按钮要弱化一些。
文字按钮
文字按钮通常出现在列表的操作项中。文字的颜色通常是品牌色或者蓝色，因为蓝色在用户的认知中通常是可点击的。
图标＋文字 按钮
图文结合的按钮相对于纯文字按钮会更加直观，也能更吸引用户注意。
3.输入框应该设计几种状态？
考虑的状态越多，设计就会越细，能够及时的反馈信息给用户，从而提高表单填写效率。在考虑输入框的设计状态时，遵循及时反馈的设计原则去考虑。
为了避免用户填写完所有信息后，才反馈有错误，会造成时间浪费，表单填写效率低。通常会把输入框线变成红色，同时出现红色的说明文案，来引起用户的注意。
▵及时反馈错误信息
在设计中我们还需要考虑自动校验的成功与警告状态。颜色通常为绿色与橙色。
输入框到底应该设计几种状态我们也需要根据我们表单的复杂情况去考虑，对于简单的表单设计过于细化的状态是没有必要的。
写在最后的话
表单设计看起来简单，但实际在设计过程中还是有大量的点值得我们去学习与研究的。在这次做表单的过程中，觉得作为设计师我们不应该去挑活，不要觉得表单设计是一个很小的设计就不动脑的照着别人的设计规范抄一遍。像这种看似枯燥但又很重要的模块设计，我们在前期开始设计之前可以从交互层去考虑，再从视觉层面去考虑怎样的表单设计能让用户填得舒心又高效。在看别人的设计规范比如ant design的组件规范时，我们可以去留意他们的设计细节，比如表单上下之间的间距留的是多少？有什么规律吗？按钮的上下边距与左右边距有什么关系吗？通过这些思考，然后去观察总结，并转化为自己的小技巧，到下一次设计表单的时候，我们就会做得很好了。
往期解析
UI设计－首页解析
详情页设计技法解析
轻松get文字标签设计技法
Get点9切图方法（内附切图神器）
Ⅱ web服务器表单的html设计问题
你说的这个很简单啊，我不知道你知道不知道如何在web服务器取的客户端form里发过来的数据，限制可以双向，一般在客户端先进行一个判定（限制5位数和只能是数字，用trim和string长度限制即可，数字用正则判定就行）。你发的代码是ajax，这个就解释了获得数据后如何刷新下，ajax就是无刷新显示的意思，你发的代码意思是：
function LED0()
{
loadXMLDoc("/led_red.cgi?red=1&t="+ Math.random(),
//获取XML文档对象，后面的参数是red=1，另一个随机数是为了防止浏览器缓存
function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
//这里的意思是XMLHTTPrequest对象的状态，4代表响应已完成可以获取并使用服务器回复的响应了，200代表正常
{
document.getElementById("red").src=xmlhttp.responseText;
//获取id=red的dom对象，并更改该对象的src属性=xmlhttprequest对象返回的内容
}
});
}
明白了没？
Ⅲ 静态页面的表单数据如何收集。能否帮忙将代码写出来
首先需要明白，静态页面很难完成交互的。
完成你的需求必须要把表单中的内容做个存储，如果不想用数据库，可以存储到txt中，
那么再回到你的需求上来，静态页面可以考虑用js生成txt文件来存储
利用jQuery获取表单输入的值，然后在把值写入到生成的txt中。
具体涉及的代码比较多，上面把思路给你了，自行网络吧
Ⅳ 网页端表格设计指南
想象一下你为企业端产品设计了一个系统，或是设计了某个应用程序。在诸如此类的设计中都需要用到表格。这些表格设计不是那些设计网站中展示的非常精美的表格样式，而是具有复杂交互和数百个单元格的表格。
在这种情况下，设计师会面临许多挑战。 例如：将设计与现有的前端框架进行匹配，或与破坏布局的“不舒服”数据进行斗争。 我们将通过以下步骤来解决这些问题：系统化需求，原子化，定义交互。
所以，你已经采访了目标受众。现在是时候将他们的需求和需求拼凑在一起，并转化为对设计有用的东西。例如，一位用户说：“我需要看看我的数据如何影响应用程序的其他部分。”或者在看到另一个人使用软件时，你注意到他只使用快捷方式而根本不摸鼠标。这是什么意思？第一个用户的话是关于输入验证和提示。你需要考虑将警报或帮助信息附加到表中，或者开发一个有意义的颜色系统。这取决于领域和心理模型。观察第二个用户的工作可能是你需要设计键盘可设置快捷方式，可能需要考虑比“Cmd + C”和“Cmd + V”更深刻的快捷方式。
这样，你就有一系列的需求和愿望。开放式问题有助于找出真正的需求并过滤掉一时兴起。例如，“什么可以帮助你更快地工作？这如何提高你的工作效率？如果你不能做XX会有什么改变？“
这时候就需要一个功能框架了。如下图
任何表的最小构建块都是一个单元，联合成行和列，其具有不同于其他单元的特定特征。 最后，我们将表格的重要补充作为顶栏，键盘命令，处理错误等。
简而言之，构建一个复杂的表，收集并优先考虑用户需求。 考虑非表格解决方案，例如图表。
绘制一张树形图，系统化所有需要的功能。
原子化是首先设计小的UI组件然后组装更大的UI组件。 我们将逐渐从字体和颜色等基本粒子转移到像标题或列这样的大模态。
这些部分可以由设计系统或UI框架定义。 如果为现有产品创建表，请检查调色板，字体和图标是否满足表格的需要。
当表格原子设计准备就绪时，我们可以继续设计不同类型的单元。 首先要事先考虑每个元素的“正常”，“悬停”和“激活”的状态。 后面再添加“点击”，“禁用”和其他状态。
单元格可以有工具提示，输入提示，错误消息，占位符等附件。
设计单元格创建行时，需要查看各种组合是否可以很好地协同工作。 下面我在一行中展示了只读和可编辑单元格的。 一旦设计一个具有复杂编辑逻辑的表格，那么表格的某些字段由用户提供，而其他字段则使用默认值自动计算或填充。
需要注意的是，将鼠标悬停在只读和可编辑单元格上时，光标会有所不同。 点击单元格会触发选择行或进入可编辑单元格的编辑模式。 你可以在下图看到用户选择一行或多行时的单元格状态。
现在是时候考虑表头了。 根据我的经验，通常无法控制列标题长度并坚持一行。 我在下图展示了表头的不同变体。
基于数据的工具，用户经常需要排序和过滤。 它可以帮助用户在冗长的数据中找到有价值的信息。 排序和过滤的挑战是将排序控件和过滤控件与其他标题元素（列标题，度量单位等）结合起来。
与表格单元格不同，过滤器框通常在右侧具有“重置”图标，以便用户可以查看未过滤的内容。
在示例中，有三种类型的过滤器框。 字母数字过滤器可以按字母和数字进行搜索。 它支持通配符 - 未知数量的未知字符。
日期选择器过滤器具有日历，其工作方式与其单元格相同。 允许用户手动输入日期并从日历中选择是一件好事。 如果他们知道他们在搜索什么，那么打字比点击容易得多。 在我的一个项目中，我们允许输入“01/25/2017”，“6 12 17”和“2016年9月4日”等日期，仅过滤一个月或一年。
复杂表的一个常见功能是固定列。 通常，包含关键信息的列（例如，元素名称或状态）不可滚动。
虽然表列应该巧妙地适应内容大小，但是当文本被截断时会发生。 在这种情况下，列大小调整很有帮助。 用户可以拖动列边缘并查看长内容。
处理长文本字符串的另一种方法是：使用最长内容拉伸列或将内容折成多行。 第一种方法对于或多或少类似的文本字符串更有效。 如果看到全部内容对于人们来说比保持表格的垂直紧凑更重要，那么第二个更好。
我们需要定义列的默认最小宽度，以防止表格不适合调整大小。
什么构成一张表格？ 单元格，列，行。 此外，复杂的表通常有一个顶部操作区。 与其他组件一样，顶部栏由较小的元素构成 - 标题和命令。 下面我收集了我们在其中一个产品中使用的各种状态的命令列表。
现在我们可以尝试组合不同的元素，看看它是否有效。 这里有些例子。
当然，这不是功能和元素的最终列表。 它不同于一个项目，可能包含其他内容，例如：
按多列排序;
可自定义的列;
可扩展行;
用于过滤和搜索的逻辑运算符（“和”，“或”，“其他”等）。
如果你犹豫要设计哪些功能，哪些没有，可以参考奥卡姆的剃刀，或简约法则。 如果现有的实例满足需求，则设计者不应创建新实例。 你应该“削减”用户可能需要的令人讨厌的功能。
只读表格 。 要构建的最简单的表类型，因为它只显示数据。 没有过滤或编辑选项。
搜索表格 。 单元格不可编辑，标题有过滤框和排序控件，可以选择行。 从实践来看，这些表格有助于从大量类似的东西中查找，比较和选择一个项目或几个项目。
可编辑的表格 。 所有或部分单元格都是可编辑的，通常没有筛选，因为行的顺序可能是自定义的。 这些表格通常会有工具栏并允许使用行执行操作。
简而言之
从最小的组件开始。 然后逐渐走向更大的，最后，模拟整个表格。
事先考虑每个组件的所有可能状态。
使用Occam的剃刀原则将元素数量保持在最小但覆盖所有用例。
构建块不足以构建像表格这样复杂的。设计师应该考虑“游戏规则”，并设计视觉部分背后的逻辑原则和惯例。
容器与响应式
如何将表格放在界面中？ 例如，它会占用现有容器中的一些空间还是一个单独的模块？ 这些问题的答案完全取决于产品，最好预见可能的问题并彻底定义原则。
有些应用程序使用线条或白色灰色“斑马线”来使信息更易读。
定义合理的默认宽度，并允许在需要时手动调整大小。对于阅读表格，最好在右边有一些空格而不是列之间的间隙。但是如果一个表包含许多行和列，则水平和垂直滚动是不可避免的。对于手机端的阅读，还可以把表格做成卡片式利于用户浏览数据。
即使是非常流畅和漂亮的表格也可能成为用户的噩梦。因此，遵循可访问性原则非常重要。 以下是可访问性方面的主要设计考虑因素。
给出标题并准备简明的摘要 。视力受损的用户应该能够在不对其所有单元进行语音处理的情况下处理表格。
注意字体大小 。尽管网络没有正式的最小尺寸，但16 px（12 pt）被认为是最佳的。此外，用户应该能够在不破坏整个布局的情况下将表格增加到200％。
为有色盲的人测试颜色 。文本和控件应与其背景具有足够的对比度。最低要求色比3：1（越多越好）。颜色不应该是标记事物的唯一方式。例如，错误消息不应仅依赖于红色文本，警告图标将为色盲用户提供参考。
避免使用小而模糊的控件 。如果可点击组件至少为40×40像素，则认为它们是触摸友好的。由图标表示的命令应标记或具有工具提示和替代文本。设计师不应过度使用图标，因为用户可能无法正确理解复杂的隐喻。
简而言之
内容统一和格式化也是设计师的工作。
不仅要考虑界面元素，还要考虑用例，规则和常用模式。
原文：https://medium.muz.li/complex-tables-356826d11861
译者：Ever
相关文章推荐：
在构建设计规范之前，你需要看看这些设计资源
如何构建设计语言系统
给初级UI&UE设计师的Sketch资源分享
交互设计原则和理论1——尼尔森十大可用性原则
交互设计原则和理论2——七大定律
国外设计团队的高频设计工具与协作工具
16个表单优化技巧
网页端表格设计指南
怎样提高注册登录流程的交互体验
不可错过的2019设计趋势
Ⅳ 求推荐现在有什么好用的web报表工具
思迈特软件Smartbi的报表工具就挺好用的，思迈特软件Smartbi在大数据审计分析中的应用重点包括跨库查询、高性能存储、疑点生成、自助分析、数据报送、财务分析、专题分析、自动取证单、大屏报送等。思迈特软件Smartbi是一款基于轻量级Web报表工具，采用拖拽式设计模式，不需任何服务器和组件支持，即可在 Mac、Linux 和 Windows 操作系统中，设计多种类型的报表。思迈特软件Smartbi在Web平台的扩展，不但继承了其强大的报表设计能力和高效的报表开发引擎，还提供了全新的跨平台报表设计器和纯前端报表查看器，全面支持 Node.js、Angular、React、Vue 等前端开发框架。
Smartbi从报表开发的数据准备、样式设计、数据计算、数据可视化、互动逻辑、共享发布六大步骤上都有特色的功能，充分利用了Excel的现有能力，堪称企业报表平台的解决方案专家。尤其集成了Excel和ECharts后，使得Smartbi Insight具有丰富的展现力、强大的互动性（基于单元格和对象的数据模型）、超级灵活的布局能力，而且这些都可以在Excel界面上全部完成。
集群：提高系统性能和可靠性
高一致性：所有通过Smartbi产品进行的配置和文件都可以随时同步到集群的各个节点。
高可用性：支持所有单机功能。单一节点宕机后，系统仍可正常访问。
强扩展性：基于良好的架构设计，随着节点的增加，系统所支持的并发几乎呈线性增长，且每个节点的负载更加均衡。
使用简单：可在平台中通过简单的操作快速配置集群环境，其中节点的增删支持热部署。此外，还可在平台中监控各个节点的运行情况和日志。
自成立初期，思迈特软件Smartbi就一直坚持国产自主研发道路，先后获得软着数十项；同时与华为、深信服、新华三、达梦、麒麟软件、人大金仓等合作伙伴通力合作，共同打造产品销售、产品整合、产品应用的国产化可信生态体系，与上下游厂商、专业实施伙伴和销售渠道伙伴共同为最终用户服务。
报表工具靠不靠谱，来试试Smartbi,思迈特软件Smartbi经过多年持续自主研发，凝聚大量商业智能最佳实践经验，整合了各行业的数据分析和决策支持的功能需求。满足最终用户在企业级报表、数据可视化分析、自助探索分析、数据挖掘建模、AI智能分析等大数据分析需求。
思迈特软件Smartbi个人用户全功能模块长期免费试用
马上免费体验:Smartbi一站式大数据分析平台
Ⅵ web表格怎样做得美
下面我们以一个简单的示例来体会体会一下表单。
最终效果如下：
如何用web表格控件FineReport做web表格
2
新建表单
点击文件>新建表单，如下图
如何用web表格控件FineReport做web表格
拖入组件
如上图所示的效果图，我们可以看到该表单需要有1个下拉框控件以及对应的1个标签控件和一个查询按钮，还需要一个以表格形式显示数据的报表块和显示图表的图表块，此时，我们确定了需要在表单中添加一个报表块，一个图表块，3个控件。
注：在组件介绍中，我们知道控件即可依附于参数面板组件存在，也可以单独以组件的形式存在，在这里可随意使用哪种形式，效果都一样，那么使用依附于参数面板组件存在的形式。
参数组件
从工具栏中将参数组件拖拽至表单主体中，并将相应的三个控件：下拉框、文本控件和查询按钮拖拽至参数组件中，并设置标签控件的控件值为：客户，如下图：
如何用web表格控件FineReport做web表格
报表块组件
从工具栏中将报表组件也拖拽至表单主体中，如下图：
如何用web表格控件FineReport做web表格
注：如果组件数量过多，在web端展示的时候自适应在一页内显示会比较拥挤，那么此时可以在右侧下方选中整体框架body，在右侧上方的属性表中将组件缩放修改为自适应原样缩放，如下图：
如何用web表格控件FineReport做web表格
充满展现区域：是指在web端展示的时候，所有组件自适应充满整个浏览器页面显示，不出现滚动条；
自适应原样缩放：是指在web端展示的时候根据制作表单时候组件大小比例显示，并不缩放充满整个web页面，如果超过页面大小，会出现滚动条。
其详细显示样式请查看表单样式
图表组件
再从工具栏中将图表组件拖曳至报表块组件的下方，如下图：
如何用web表格控件FineReport做web表格
控件绑定数据
定义数据集
效果图中，新建数据集ds1：SELECT 产品名称,库存量,产品.成本价 ,产品.单价 FROM 订单,订单明细,产品 where 客户ID='${company}'and 订单.订单ID=订单明细.订单ID and 订单明细.产品ID=产品.产品ID，参数company的默认值为VINET,。
注：参数名字必须与客户ID下拉框控件名称保持一致。
客户下拉框控件
选中下拉框控件拖拽到适当位置，下拉框控件名设为“company”，数据字典来自FRDemo数据库的客户表（数据类型选择数据库表，数据库选择FRDemo），实际值和显示值分别为客户ID和客户名称，控件值为VINET：
如何用web表格控件FineReport做web表格
报表块
参数面板与控件都已经设置好之后，点开报表块里面的触笔按钮，进行报表块编辑界面，如下图：
如何用web表格控件FineReport做web表格
新建数据集
效果图中，报表块里面要显示订单明细数据，根据客户ID进行过滤，新建数据集ds2：select * from 订单 where 客户ID='${company}'，company默认值为VINET.
表样设计
如下图所示，设计表样：
如何用web表格控件FineReport做web表格
点击左下角的表单按钮回到表单的设计界面，选中报表块，可在右侧的属性表中设置其报表块工具栏是否可见，如下图：
如何用web表格控件FineReport做web表格
图表块
鼠标选中图表块所在区域，为该图表绑定数据，图表数据源来源于数据集数据源，其分类系列设置如下：
如何用web表格控件FineReport做web表格
条件属性
由于该图表块类型为组合图，即需要通过图表条件属性来修改不同系列的图表类型，如下图，新增一个条件属性，设置当系列序号为3的时候，其坐标轴为次坐标轴，图表类型为折线图：
如何用web表格控件FineReport做web表格
13
注：设置条件选择系列序号的时候需要与数据绑定时的数据列顺序相匹配，在上图设置图表数据时，库存量、成本价和单价的系列序号依次为1、2、3，条件属性主要是设置库存量系列用柱形图展示，成本价和单价用折线图展示并使用次坐标轴。在添加一个组合图时，会默认添加2个条件属性，详细请查看组合图
到此为止，表单就已经制作好了。
Ⅶ 表单在网页中的作用是什么
收集信息
最初，将Web设计为全球共享和浏览静态信息的媒体，目前它已经发展为一种交互式媒体。如今，最普通的交互方式就是数据输入表单。表单由数据输入框、控件、标签和动作按钮组成。表单可以是单一的搜索对话框，也可以是多页面的调查问卷保单形式。Web表单中的数据输入框和控件主要是由标准控件组成的，这些标准控件是从Web诞生前的图形用户界面中继承下来的：文本与数字框、单选按钮、复选框、菜单等。然而，Web是一种新兴的且飞速发展的媒体，在Web上，无论好坏，设计人员都在发挥创造力设计出全新的交互技术和控件。
不幸的是，Web上设计出来的许多表单和控制面板几乎没有从图形用户界面设计人员那里得到支持。有些表单太有创造力了，通用性不强。
文本框是表单中使用最频繁的控件，实际上是严重过度使用。Web上到处充斥着这样的站点，站点中使用文本框来定义结构或者约束数据的值，例如时间、体积、日期、金额和未成年儿童的数量等。对于这类数据来说，文本框形式太自由了。除非在对话框的标签中给出范例，否则几乎没有什么可以作为有效值的标准，因此，很容易输入无效值。通常在表单提交时检查输入的内容，如果输入的某个值无效，那么将得到一条如下的出错消息：！无效的输入，请重新输入。
假如表单允许用户进行选择而不是直接输入，那么就不需要出错消息了，因为根本不可能输入无效值。不幸的是，许多网站没有考虑这种方式。我要尽可能的在利用表单的功能的同时，更好的完成合理的用户体验设计。
Ⅷ web中表单发送数据有哪些方法各有什么优缺点
常用的就GET和POST是HTTP请求的两种基本方法
GET在浏览器回退时是无害的，而POST会再次提交请求。
GET产生的URL地址可以被Bookmark，而POST不可以。
GET请求只能进行url编码，而POST支持多种编码方式。
GET请求会被浏览器主动cache，而POST不会，除非手动设置。
GET请求在URL中传送的参数是有长度限制的，而POST没有。
对参数的数据类型，GET只接受ASCII字符，而POST没有限制。
GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。
GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。
GET参数通过URL传递，POST放在Request body中。
Ⅸ 如何使用OQSS在线问卷制作
产品简介
OQSS是智能的web表单引擎，专业的问卷调研调查软件，后台程序运行于web服务器，前台使用浏览器进行操作，同时也是在线的web表单开发引擎，是第一款国产开放式的问卷调查系统及表单引擎。使用OQSS:你可以用来制作、发布、分析在线调查表，制作信息搜集表单，设计web程序，进行网络考试，在高节奏的互联网上工作，每个企业都需要一套OQSS。
OQSS已经有5年历史，逐渐发展成熟，拥有一批客户，如中国搜索、普思电子、厦门大学、温州大学、厦新电子、TCL集团、CSDN、读者杂志社、女友杂志社、中国电信、中国移动、中国汽车网、珠海视听网、赛迪顾问、深圳公安局、税务局、红塔集团...，在这些客户的支持下，OQSS团队不断进取、不断创新，坚持在软件结构、人性化、安全性方面进行提升，使OQSS更好用、更易用，功能更强大。
OQSS的适用范围
市场调查
客户反馈
科研调研
数据收集
网站调查
表单开发
心理调查
考试试卷
web表单
.....
OQSS详细功能:请点击这里
OQSS的内核是一套表单开发引擎
OQSS的问卷模型
单行填充题(单行输入控件)
多行填充题(多行输入控件)
单选+输入(redio点选控件)
多选+输入(checkbox多选控件,可控选择数)
矩阵题(矩阵单行输入控件)
对选项进行分值设定(根据分值计算结果)
集成输入验证(常见表单验证)
多级下拉联动
多选互斥
选项控制题呈现
图形化选项
为题目选项设定分值，以实现问卷记分
URL参数传递
程序精细控制
防IP重复提交，可设置重复提交时间间隔
可设定问卷结束日期
可设定提交后的显示页，可设置为问卷评分结果，可设置提交后显示问卷报表
问卷密码前置，可设置问卷密码，打开问卷前需要输入密码，保护你的问卷
即时开关问卷，即时开关问卷，使问开启或者关闭
即时开关数据，即时开关结果数据，未开启数据前匿名不用不可查看
集成问卷邮件群发
长期跟踪同一样本
在线样本组管理
问卷邮件在线群发
可从断点群发
直接在收到的Email中回答问卷
在线统计分析
显示一张答卷所有内容
一页中显示多个答卷
频率频数分析
柱形图、饼形图
任意设定过虑条件分析
数据可导出为Excel文件
OQSS架构
B/S结构，.Net+AJAX+DB
内核:表单开发引擎默认用户名[email protected] 密码hello
Ⅹ Web表单设计—点石成金的艺术（一）
最近在读《 Web表单设计—点石成金的艺术 》一书，颇受启发。而且该书目前已经买不到了，好像二手书也买不到，特意找了pdf扫描版来读，读书过程中的一些感悟跟大家分享。
一、表单的设计
大多数人都不喜欢填写表单，这也就说明了应该关注优秀表单设计。
而很多的特定数据来源都提供了衡量表单设计影响的方式：
（1） 可用性测试 （观察人们与表单如何交互）
（2） 实地测试 （从人种学角度观察人们在家中或办公室中与表单互动的情况；）
（3） 客户支持 （了解客户填写表单时遇到的问题）
（4） 网站追踪
（5） 眼动跟踪 （记录人们如何理解表单的表现形式）
（6） Web惯例 （即查看该问题的通用解决模式，可理解为分析竞争对手的解决方案）
二、表单的组织
类似标签后面是否要防止冒号的问题，用户真的不关心。用户关心的是问题内容和所问的原因。
有些字段需要告诉用户填写的原因（ 为什么问这些问题，能为用户带来的好处 ），如果不能回答，就要考虑是否真的需要这个字段。
表单所提的问题即 标签要尽量的简洁清晰 。
如果简洁的标签容易引起用户的误会，应该 尝试使用自然语言的方式 。
表单较长或较复杂时应 考虑对表单内容进行分组 ，有助于浏览和快速完成填写。
有些时候很多问题需要按顺序回答，否则回答就没有意义。这时候人们需要看到所有问题，一个较长的网页是好的解决方案。通常这些问题会和一个主题相关。
有些 可选问题在表单填写完成后再问比较好 ，如“您如何知道我们”或者“您想进一步了解我们吗”。这样会比初始表单就提问能获得更多的答案。
可以通过Web惯例调查， 比较相似网站的设计方案 ，引导发现网上已经形成的常见表单组织结构，但是也要结合自身情况不要只停留在简单复制竞争对手。
对表单进行分组时， 每个内容组都从视觉上区别于表单的其余部分 ，但是对比太多也可能造成视觉污染，阻碍人们浏览表单。
信息设计专家爱德华,托佛特认为，信息由产生作用的差异构成，任何无助于布局的页面元素都会损坏布局。 采用最好的必要视觉信息来区分内容组 。
英文网站， 标签首字母应当大写 ，使内容组更容易浏览。
最后，祝大家六一儿童节快乐！永葆童心~