banquet 40

17
夜宴-表单-反馈-体验 合沙-2010-9-6

Upload: koubei-ued

Post on 31-May-2015

419 views

Category:

Documents


3 download

TRANSCRIPT

Page 1: Banquet 40

夜宴-表单-反馈-体验 合沙-2010-9-6

Page 2: Banquet 40

HTML 3.2 表单

Form属性 action=""

method="post|get"

target="_blank|_parent|_seft|_top"

enctype=""

Input type text,radio,checkbox

file,image

reset,submit,passwordk,hidden

input 属性 name,value,checked

src,size,maxlength,align

select 子元素:option

属性:name,size,multiple,selected,value

textarea 属性:name,rows,cols

Page 3: Banquet 40

HTML 4 表单

• Button 元素

• Label 元素

• filedset & legend 元素

• optgroup 元素

• accesskey 属性

• disable 属性

• redadonly 属性

• input 增加 accept属性 [type=file]

Page 4: Banquet 40

HTML 5 表单

input type search,url,email

tel,number,range

color

datetime,date,month,week

time,datetime-local

input 属性 max,min,step

placeholder

list,autocomplete

pattern,required,

autofocus

元素 datalist

keygen,output,progress,meter

dome:http://miketaylr.com/pres/html5/forms2.html

Page 5: Banquet 40

问题

• HTML 5 表单很好,但现在......

• 我们能等能哪一天吗?

• 我们需要等哪一天吗?

• 等到了,HTML 表单够用吗?

Page 6: Banquet 40

滚动条

Page 7: Banquet 40

下拉操作

Page 8: Banquet 40

输入&格式化

Page 9: Banquet 40

WIN 7 的声控制

Page 10: Banquet 40

人跟人之间的反馈

1.如果你叫了一个人10声音,他没反应,你有啥感觉?

饺子嫂说:如果是叫饺子哥10声都没反应,肯定生气,不理他!

Page 11: Banquet 40

人跟物之间反馈

1.电器开关之后的指示灯

2.电话,手机按健的声音

3.足球

4.乐器

5.等......

Page 12: Banquet 40

感觉与知觉

感觉:听觉,视觉,味觉,触觉,嗅觉

知觉:好听,好看,味,柔软,香

Page 13: Banquet 40

有了反馈,才有愉悦,才是好体验

Page 14: Banquet 40

用户体验!单从反馈的角度,我们其实可以做更多!

Page 15: Banquet 40

鼠标与鼠标背后的动作

• 指向

– 被指对象的反应!

– 光标的反应!

– 出现文本描述!

• 点击

– 鼠标的按健声音!

– 指点对象的反应!

– 点击后的反应!

Page 16: Banquet 40

鼠标与鼠标背后的动作

• 对按扭表单增加 title alt 等属性

• 利用css做光标控制

• 提醒视觉,交互要hover状态下的情况!

• 提醒视觉,交互要focus状态下的情况!

Page 17: Banquet 40

Thanks

Q&A