仓酷云

标题: 来看看：制造网页表单的标签和输出区 [打印本页]

作者: 兰色精灵 时间: 2015-1-15 23:57
标题: 来看看：制造网页表单的标签和输出区
强大的字体控制和排版能力。CSS控制字体的能力比糟糕的FONT标签好多了。
破洛洛文章简介：表单，特别是注册表单，就像一扇门，穿过他才干看到完全的产物。以是万万别做这类门，本人省事不说，用户也不会买账。这个计划最糟的地方，就在于它有悖常理。好的计划应该遵守于其天然纪律，如许一来切合人们预期，利用起来也就顺畅。
重读LukeW的《WebFormDesign:FillingintheBlanks》感到很深，除信服LukeW的研究精力外，更多的是进修他对计划细节的固执和了解。我把对本书的了解，与事情生存中碰到的实践成绩分离起来，作为从此计划事情的引导和标准。
有一些元素，看着很复杂，计划起来却很头疼。常常如许的元素都具有一个配合的特性——变更多，表单的计划就是云云。你说见过20、30种以上分歧的表单，我其实不惊奇，产物需求、作风分歧，一定八门五花。固然，换了计划师，表单的款式也大概会分歧。但是，不克不及让这类情形持续下往，表单不是艺术展。不要让你的才干拦阻了他人的行进。
表单就是一扇门古有年夜禹，三过家门而不进；今有效户，看到表单犯懵懂。岂非年夜禹碰到的是如许的门？
表单，特别是注册表单，就像一扇门，穿过他才干看到完全的产物。以是万万别做这类门，本人省事不说，用户也不会买账。这个计划最糟的地方，就在于它有悖常理。好的计划应该遵守于其天然纪律，如许一来切合人们预期，利用起来也就顺畅。
表单中标签与输出区的4种对齐体例

标签垂直顶对齐
标签程度右对齐
标签程度左对齐
标签在输出区外部

《WebFormDesign》一书中对标签和输出区组合举行了一些研讨，我收拾了一份数据对照的表格：

标签垂直顶对齐
标签和输出区垂直顺次分列，从而下降了对页面宽度的请求。假如你的页面没有充裕的空间用于标签和输出区的横向分列，这类组合是个不错的选择。

眼动轨迹标明，用户自上而下的扫描表单，核心多会合在左边一列，且跳动较小。

破洛洛文章简介：表单，特别是注册表单，就像一扇门，穿过他才干看到完全的产物。以是万万别做这类门，本人省事不说，用户也不会买账。这个计划最糟的地方，就在于它有悖常理。好的计划应该遵守于其天然纪律，如许一来切合人们预期，利用起来也就顺畅。

标签程度右对齐标签右对齐和输出区程度分列，从而下降了对页面高度的请求。但与标签垂直顶对齐比拟，因为标签笔墨左边乱七八糟，对成绩的认知和扫描工夫变的更长。

眼动轨迹标明，用户花了更多工夫在看成绩，输出框对他们来讲很复杂。

标签程度左对齐
标签左对齐和输出区程度分列，一样下降了对页面高度的请求。标签左对齐有益于用户对成绩标签的扫描，但倒霉于填写谜底，由于标签间隔输出区较远，要从头定位到右边输出框，的确要损耗一点工夫。

眼动轨迹标明，用户花在定位输出区上的工夫比看清标签更长，从而影响了全部表单的完成工夫。

标签在输出区外部
这类体例固然具有垂直组合的长处，但仍应审慎利用。当核心移进输出区后，标签消散，看不到成绩，大概会健忘要回覆甚么，很忧郁，不能不清失落输出好的字，把“成绩”复原出来。这类组合对照合适只要一两个输出框的冗长表单，并且人们对他很熟习，不必吃力往记着标签提出的成绩，好比：搜刮框。

当你真的选择用这类表单的时分，注重，让标签和实在内容辨别开来，一些商定俗成的做法是减淡标具名色，在前面打上“…”；下拉菜单则在默许选项两侧打上“-”，以示区分：

计划要有一条主线，贯串于全部产物，别让人用着感到像是几个计划师干的事。仔细思索一遍，就会有新一层的了解，这对我的事情有极年夜的匡助。
原文：http://blog.b3inside.com/userexperience/label-and-input-in-form-design/

不管你用什么工具软件制作网页，都有在有意无意地使用CSS。用好CSS能使你的网页更加简炼，同样内容的网页，有的人做出来有几十KB，而高手做出来只有十几KB。

作者: 再见西城 时间: 2015-1-17 23:51
Dreamweaver是唯一提供RoundtripHTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。

作者: 老尸 时间: 2015-1-24 13:18
以上大概就是文字图片的一些链接方法，通过学习Dreamweaver、练习让我对dreameaver8有了进一步的认识，他其实是一款很好的建立Web站点和应用程序的软件。它将可视布局工具、应用程序开发功能和代码编辑支持组合在一起，其功能强大，使得各个层次的开发人员和设计人员都能够快速创建界面吸引人的基于标准的网站和应用程序。

作者: 谁可相欹 时间: 2015-2-1 16:27
dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。

作者: 金色的骷髅 时间: 2015-2-21 23:44
还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。

作者: 简单生活 时间: 2015-3-6 23:33
Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。

作者: 愤怒的大鸟 时间: 2015-3-13 23:23
直接用代码建立链接，如：可以直接输入 <a herf = \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\"red.html\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\">红色的网页 12、插入标签法建立链接，可以再选中文字后在代码中插入html标签，页元素<a>.也可以按ctrl+t进入html标签插入方法之后输入代码即可。

作者: 飘飘悠悠 时间: 2015-3-20 23:44
Dreamweaver8中文版(dw)是由Macromedia公司开发的一款所见即所得的网页编辑器。和二维动画设计软件FLASH，专业网页图像设计软件FIREWORKS，并称为“网页三剑客”。

欢迎光临仓酷云 (http://ckuyun.com/)