淡泊以明志,宁静而致远。

织网

用P3P header解决iframe跨域访问cookie/session

理论很简单,而且模式也和大多请求返回状态的SSO差不多.但是有几个地方是要注意一下的.

1.页面里的COOKIE不能是浏览器进程的COOKIE(包括验证票和不设置超时时间的COOKIE),否则跨域会取不到.这点做跨域COOKIE的人比较少提到.不过实际上留意下几家大学做的方案,有细微的提到他们的验证模块里的COOKIE是有设置超时时间的.

2.当利用IFRAME时,记得要在相应的动态页的页头添加一下P3P的信息,否则IE会自觉的把IFRAME框里的COOKIE给阻止掉,产生问题.本身不保存自然就取不到了.这个其实是FRAMESET和COOKIE的问题,用FRAME或者IFRAME都会遇到.

3.测试时输出TRACE,会减少很多测试的工作量.

只需要设置 P3P HTTP Header,在隐含 iframe 里面跨域设置 cookie 就可以成功。他们所用的内容是:

P3P: CP=’CURa ADMa DEVa PSAo PSDo OUR BUS UNI PUR INT DEM STA PRE COM NAV OTC NOI DSP COR’
Continue reading

瞬间的快感之细节提升用户满意度

瞬间的快感之细节提升用户满意度

话说土匪老湿在他的大作 《交互设计之回归篇》 里曝光了上次有意思小组竞赛我们小组分享的话题 “瞬间的快感”,但这一极具噱头的主题,土匪老湿惜字如金只用了廖廖几字作了归纳…汗,字数没够,字数没够。。。以下我将采用图文并茂的方式来说明我们的观点。

在第一个瞬间,也就是当一位浏览者刚刚打开我们网站的时候,他最先可能是想看看这个网站的名字及其功能; 而下一个瞬间可能就开始移动手中的小鼠标到自已感兴趣的东西上点点。再然后则可能是寻找从哪里注册等等。然而在这些瞬间中怎么样才能让浏览者找到快感,提升他的满意度呢?

1、按钮的鼠标按下状态

我们知道按钮有未动作、鼠标经过、鼠标按下、弹起四种状态,但是现在大多数网站的按钮都只设计了未动作、鼠标经过这两种状态,其中更有不管你小鼠标怎么蹂躏它都只有一种状态者。这里我不是说这些做法不好,只是觉得如果我们在设计的时候加上鼠标按下状态会提升浏览者的满意度,让他们在点击之中获得快感。就像我们平常进行的开关灯操作一样,当手指放在开关面板上按下,伴随着“啪”这个轻脆声音,开关被按下,灯亮了。
1

上图中百度一下的鼠标按下状态加深了颜色,google搜索则直接将底色置灰,从视觉上给了浏览者最直观的感受这个按钮我按下了。

Continue reading

JavaScript添加、获取和删除Cookie的代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
function setCookie(name, value, expires, path, domain){
	//name cookie的名称
	//value cookie的值
	//expires cookie存活的时间[可选项:无值代表页面关闭生命到期],以毫秒为单位 支持 '1000'  1000  100*1000 三种格式(计算时不能用引号包含)[可以为其他目录进行赋值]
	//path cookie的可访问范围,例设置为"/test/"或"text/"或"/text" 都代表test目录下的所有文件及子目录都可访问到cookie
	//domain cookie的访问域,path的延伸,如设置为 "senfe.com" 那么"bbs.senfe.com"/"www.senfe.com"等二级子域名都可以访问到该cookie[只能为自己域赋值]
	//完整引用实例:
	//添加:setCookie('userName','qqqqqq',1000*60,'/test/','senfe.com')
	//读取:getCookie('userName')
	//删除:clearCookie('userName')
	if( expires && isNaN(expires)===false ){expires=new Date(new Date().getTime()+expires)};
	document.cookie=name+"="+escape(value)+((expires)?"; expires="+expires.toGMTString():"")+((path)?"; path="+path:"; path=/")+((domain)?";domain="+domain:"");
};
function getCookie(name){
	var arr=document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
	if(arr!=null){
		return unescape( arr[2] );
	}
		return null;
	};
function clearCookie(name, path, domain){
	if(this.get( name )){
		document.cookie=name+"="+((path)?"; path="+path:"; path=/")+((domain)?"; domain="+domain:"")+";expires=Fri, 02-Jan-1970 00:00:00 GMT";
	}
};

CSS颜色代码对照

FFFFFF #DDDDDD #AAAAAA #888888 #666666 #444444 #000000
#FFB7DD #FF88C2 #FF44AA #FF0088 #C10066 #A20055 #8C0044
#FFCCCC #FF8888 #FF3333 #FF0000 #CC0000 #AA0000 #880000
#FFC8B4 #FFA488 #FF7744 #FF5511 #E63F00 #C63300 #A42D00
#FFDDAA #FFBB66 #FFAA33 #FF8800 #EE7700 #CC6600 #BB5500
#FFEE99 #FFDD55 #FFCC22 #FFBB00 #DDAA00 #AA7700 #886600
#FFFFBB #FFFF77 #FFFF33 #FFFF00 #EEEE00 #BBBB00 #888800
#EEFFBB #DDFF77 #CCFF33 #BBFF00 #99DD00 #88AA00 #668800
#CCFF99 #BBFF66 #99FF33 #77FF00 #66DD00 #55AA00 #227700
#99FF99 #66FF66 #33FF33 #00FF00 #00DD00 #00AA00 #008800
#BBFFEE #77FFCC #33FFAA #00FF99 #00DD77 #00AA55 #008844
#AAFFEE #77FFEE #33FFDD #00FFCC #00DDAA #00AA88 #008866
#99FFFF #66FFFF #33FFFF #00FFFF #00DDDD #00AAAA #008888
#CCEEFF #77DDFF #33CCFF #00BBFF #009FCC #0088A8 #007799
#CCDDFF #99BBFF #5599FF #0066FF #0044BB #003C9D #003377
#CCCCFF #9999FF #5555FF #0000FF #0000CC #0000AA #000088
#CCBBFF #9F88FF #7744FF #5500FF #4400CC #2200AA #220088
#D1BBFF #B088FF #9955FF #7700FF #5500DD #4400B3 #3A0088
#E8CCFF #D28EFF #B94FFF #9900FF #7700BB #66009D #550088
#F0BBFF #E38EFF #E93EFF #CC00FF #A500CC #7A0099 #660077
#FFB3FF #FF77FF #FF3EFF #FF0 0FF #CC00CC #990099 #770077

Continue reading

55个壮观的登录表单设计

原文:55壮观的登录表单设计

登录表单,页面的设计是Ui设计的基础科目,也是最能直观体现UCD的地方,每一个用户来到登录页面的时候,都会对此产生取舍感,特别是在你经常使用这个页面的时候,体现的更突出,方便人性的设计,良好的体验,可以让他产生美感,甚至于依赖感!

Mobile Me

Straw Poll
Continue reading

做网站的一些定律

1.250定律
  拉德认为:每一位顾客身后,大体有250名亲朋好友。如果您赢得了一位顾客的好感,就意味着赢得了250个人的好感;反之,如果你得罪了一名顾客,也就意味着得罪了250 名顾客。
  在你的网站访客中,一个访客可能可以带来一群访客,任何网站都有起步和发展的过程,这个过程中此定律尤其重要。

2.达维多定律
  达维多认为,一个企业要想在市场上总是占据主导地位,那么就要做到第一个开发出新产品,又第一个淘汰自己的老产品。
  国内网站跟风太严重,比如前段时间的格子网,乞讨网,博客网,一个成功了,大家一拥而上。但实际效果是,第一个出名的往往最成功,所以在网站的定位上,要动自己的脑筋,不是去捡人家剩下的客户。同理,买人家出售的数据来建站效果是很糟糕的。

3.木桶定律
  水桶定律是指,一只水桶能装多少水,完全取决于它最短的那块木板。这就是说任何一个组织都可能面临的一个共同问题,即构成组织的各个部分往往决定了整个组织的水平。
  注意审视自己的网站,是速度最糟糕?美工最糟糕?宣传最糟糕?你首先要做的,不是改进你最强的,而应该是你最薄弱的。
Continue reading

[转]<!–[if IE]>…<![endif]–> (<!–[if !IE]>…)

1. <!–[if !IE]><!–> 除IE外都可识别 <!–<![endif]–>
2. <!–[if IE]> 所有的IE可识别 <![endif]–>
3. <!–[if IE 5.0]> 只有IE5.0可以识别 <![endif]–>
4. <!–[if IE 5]> 仅IE5.0与IE5.5可以识别 <![endif]–>
5. <!–[if gt IE 5.0]> IE5.0以及IE5.0以上版本都可以识别 <![endif]–>
6. <!–[if IE 6]> 仅IE6可识别 <![endif]–>
7. <!–[if lt IE 6]> IE6以及IE6以下版本可识别 <![endif]–>
8. <!–[if gte IE 6]> IE6以及IE6以上版本可识别 <![endif]–>
9. <!–[if IE 7]> 仅IE7可识别 <![endif]–>
10. <!–[if lt IE 7]> IE7以及IE7以下版本可识别 <![endif]–>
11. <!–[if gte IE 7]> IE7以及IE7以上版本可识别 <![endif]–>

<!–[if lte IE 6]>……<![endif]–>

Ite:less than or equal to意思是小于或等于IE6浏览器,用于IE浏览器的条件注释,常用于CSShack,针对IE的JS等。
Continue reading

[转]CSS代码命名惯例语义化的方法

  CSS代码的命名惯例一直是大家热门讨论的话题。今天暴风彬彬想通过分析一个流行三栏布局中的必要元素,来为大家讲解关于使用语义化方法替代结构化方法来命名CSS类的建议和指导。

您还可以参考彬Go的相关文章:
整理及优化CSS代码的7个原则
10个CSS简写技巧让你永远受用
DIV+CSS网页布局常用的一些基础知识整理》 

CSS类命名的语义化VS结构化方式

  一般而言,CSS类名的语义化声明方式应当考虑你的页面中某个相对元素的”用意”,独立于它的”定位”或确切的特性(结构化方式)。像left-bar, red-text, small-title…这些都属于结构化定义的例子。

让我们看看下面这个例子:

CSS-语义化-结构化

  …而现在我们想把页面中的元素调换一下位置,如果你使用的是结构化方式(1),那么你就要把所有CSS类名重新进行定义,因为它们的位置变了。在布局(3)中,我们看到元素都倒转了: right-bar 现在成了 “left-bar”,而 left-content 成了 “right-content”。如果你使用语义化方式则避免了此类问题。

  换句话说,使用语义化方式的话,你在修改网站布局的时候可以仅仅修改相关CSS类的属性即可,而不用修改它们的类名了,如果网站的代码很庞大,这将节省大量的时间。

  彬Go会经常更新前端开发/网页设计等相关技术及教程文章,欢迎订阅本博客来及时浏览本博客的最新教程及资源。

Continue reading

正则表达式修饰符

手册是没有,这些都是修饰符
i :如果在修饰符中加上”i”,则正则将会取消大小写敏感性,即”a”和”A” 是一样的。
m:默认的正则开始”^”和结束”$”只是对于正则字符串如果在修饰符中加上”m”,那么开始和结束将会指字符串的每一行:每一行的开头就是”^”,结尾就是”$”。
s:如果在修饰符中加入”s”,那么默认的”.”代表除了换行符以外的任何字符将会变成任意字符,也就是包括换行符!
x:如果加上该修饰符,表达式中的空白字符将会被忽略,除非它已经被转义。
e:本修饰符仅仅对于replacement有用,代表在replacement中作为PHP代码。
A:如果使用这个修饰符,那么表达式必须是匹配的字符串中的开头部分。比如说”/a/A”匹配”abcd”。
E:与”m”相反,如果使用这个修饰符,那么”$”将匹配绝对字符串的结尾,而不是换行符前面,默认就打开了这个模式。
U:和问号的作用差不多,用于设置”贪婪模式”。
Continue reading

[转]php时区相关问题

之前有一个遗留问题,就是echo date(“y-m-d h:i:s”,time())回来的时间总是与实际时间对不上,今天终于在网上找到了原因和解决方法,分享如下:

我补充一点,我按照下面提示的方法修改php.ini找不到date.timezone 这行,是不是就没办法了呢,当然不是啦,哈哈没有的话就自己加嘛,自己动手丰衣足食。我加了这样一句date.timezone = “PRC”,问题就搞定了,高兴一下.

从php5.1.0开始,php.ini里加入了date.timezone这个选项,默认情况下是关闭的

也就是显示的时间(无论用什么php命令)都是格林威治标准时间

和我们的时间(北京时间)差了正好8个小时,有以下2中方法可以恢复正常的时间。

1,一劳永逸,仅限能修改php.ini。打开php.ini查找date.timezone 去掉前面的分号
= 后面加XXX,重启http服务(如apache2或iis等)即可

2,如果一定要用,而且不能修改php.ini,则需要在关于时间的初始化的语句的
上面加上 date_default_timezone_set (timezone);

关于timezone:必需。时区标识符,比如 “UTC” 或 “Europe/Paris”。合法时区的列表:http://www.php.net/manual/en/timezones.php

大陆内地可用的值是:Asia/Chongqing ,Asia/Shanghai ,Asia/Urumqi (依次为重庆,上海,乌鲁木齐)
港台地区可用:Asia/Macao ,Asia/Hong_Kong ,Asia/Taipei (依次为澳门,香港,台北)
还有新加坡:Asia/Singapore
老外好像把北京漏调了
其他可用的值是:Etc/GMT-8 ,Singapore ,Hongkong ,PRC
PRC是什么?PRC是中华人民共和国啊-_- Continue reading