2007-06-09
一种新颖的验证方式
今天注册了一个uTorrent的论坛帐号，发现该网站使用了一种新颖的验证方式。
当前网上，为了防止有人恶意访问，流行在登录或发帖时，追加验证码的输入及校验。而这个网站所使用的方式是：显示的是一张含有一个小方块的图片，要求用户点击图片某一角落的小方块进行验证。
原理应该比较简单，就是从表单数据中提取点击的坐标值，进行对比校验。
采用这种方式有一个明显的优点，它减少了用户的键盘输入。若是使用了自动填表功能，则不需要任何输入即可一点马上提交登录信息。
但这种方式也有缺点，如果用户没有鼠标或不喜欢使用鼠标，则会造成不便，虽然这是少数情况。如果同时提供两种方式，校验时，任何一种通过即成功返回，或许是个不错的完美方案。
从根本上来说，这是为了防止恶意防问，一般指程序的自动攻击。采用这种方式，被突破的概率不知道是多少，其安全强度能有几分。我的数学向来较差，不知道是不是=小方块的面积（象素单位）：图片的面积。直觉上，应该是较为可靠的。但相比于若干位英文字母+数字的方式，似乎被突破要容易得多。
另外，除了单纯的穷举法外，对图片进行分析的难度，也不及英文字母+数字的方式。但不管怎么说，在人性化方面要强上许多，对于防范要求不高的网站，还是一个比较受用户欢迎的不错选择。
Labels: Web
2007-05-16
［转摘］细说字体 Sans Serif 与 Serif
出处：http://yx.takeback.net/serif-font.html
拜读了 LGJ Font Notes 的 Serif VS. Sans Serif 注1 一文，顿时胸中豁然开朗，终于明白了什么是Sans Serif字体，什么是Serif字体，什么地方应该使用Sans Serif字体，什么地方又应该使用Serif字体。这些问题，不管是对Web Designer还是普通用户，了解它我觉得还是十分必要的，比如在很多浏览器中就涉及相应的设置。
在西方国家罗马字母阵营中，字体分为两大种类：Sans Serif和 Serif，打字机体虽然也属于 Sans Serif，但由于是等宽字体，所以另外独立出 Monospace 这一种类，例如在Web中，表示代码时常常要使用等宽字体。
Serif的意思是，在字的笔画开始及結束的地方有额外的装饰，而且笔画的粗细会因直橫的不同而有不同。相反的，Sans Serif则沒有这些额外的装饰，笔画粗细大致差不多。如下图：
字体对比图
可以看出，我们平时所用的Georgia、Times New Roman等就属于Serif字体，而Arial、Tahoma、Verdana等则属于Sans Serif字体。对中文而言，同样存在这两大种类，很明显，宋体、细明体（繁体中常用）等就属于Serif，而黑体、幼圆等则属于Sans Serif。
Serif 和 Sans Serif 的一般比较
* Serif的字体容易辨认，因此易读性较高。反之Sans Serif 则较醒目，但在行文阅读的情況下，Sans Serif 容易造成字母辨认的困扰，常会有来回重读及上下行错乱的情形。
* Serif 强调了字母笔画的开始及结束，因此较易前后连续性的辨识。
* Serif 强调一个word，而非单一的字母，反之Sans Serif则强调个别字母。
* 在小字体的场合，通常Sans Serif比Serif更清晰。
适用用途：
通常文章的內文、正文使用的是易读性较佳的 Serif 字体，这可增加易读性，而且长时间阅读下因为会以word为单位来阅读，较不容易疲倦。而标题、表格內用字则采用较醒目的Sans Serif字体，它需要显著、醒目，但不必长时间盯著这些字来阅读。
像宣传品、海报类，为求醒目，它的短篇的段落也会采用Sans Serif字体。但在书籍、报刊杂志，正文有相当篇幅的情形下，则应采用Serif字体来减轻读者阅读上的负担。在Web设计及浏览器设置中也应遵循此原则为是。
实际应用
在Firefox中（目前似乎只有Firefox有此功能），可以分别单独指定Sans Serif、Serif及Monospace的中西文字体，然而这个选项并未设置在工具菜单中，不过可以在Addressbar中键入about:config，然后在Filter中过滤font找到如下Preference Name：
font.name.monospace.x-western
font.name.monospace.zh-CN
font.name.sans-serif.x-western
font.name.sans-serif.zh-CN
font.name.serif.x-western
font.name.serif.zh-CN
你可以依照上述Sans Serif、Serif及Monospace的原则来分别指定一种对应字体，按照W3C的CSS规则 注2 ，在font（或者font-family）的最后都要求指定一个Serif这样的Generic-family，避免客户端实在没有指定字体时使用本机上的Serif默认字体。
由于Mozilla系的浏览器的这种特性，我们在CSS的font设定中，可以分别设定中西文字体来丰富版面，例如我们指定一组小字体（类似此文章标题下的日期、作者、类别）：
font-family: Arial, PMingLiU, Sans-Serif;
/*按照文章前面所讲，在小字体时Sans-serif更为清晰，所以随便指定一个Arial，
而作为Serif的PMingLiU（明体）在小字体显示时也有不俗的外观。
最后不忘指定一个Sans-Serif类。*/
参考资料：
1. Serif VS. Sans Serif
2. Font family: the ‘font-family’ property
拜读了 LGJ Font Notes 的 Serif VS. Sans Serif 注1 一文，顿时胸中豁然开朗，终于明白了什么是Sans Serif字体，什么是Serif字体，什么地方应该使用Sans Serif字体，什么地方又应该使用Serif字体。这些问题，不管是对Web Designer还是普通用户，了解它我觉得还是十分必要的，比如在很多浏览器中就涉及相应的设置。
在西方国家罗马字母阵营中，字体分为两大种类：Sans Serif和 Serif，打字机体虽然也属于 Sans Serif，但由于是等宽字体，所以另外独立出 Monospace 这一种类，例如在Web中，表示代码时常常要使用等宽字体。
Serif的意思是，在字的笔画开始及結束的地方有额外的装饰，而且笔画的粗细会因直橫的不同而有不同。相反的，Sans Serif则沒有这些额外的装饰，笔画粗细大致差不多。如下图：
字体对比图可以看出，我们平时所用的Georgia、Times New Roman等就属于Serif字体，而Arial、Tahoma、Verdana等则属于Sans Serif字体。对中文而言，同样存在这两大种类，很明显，宋体、细明体（繁体中常用）等就属于Serif，而黑体、幼圆等则属于Sans Serif。
Serif 和 Sans Serif 的一般比较
* Serif的字体容易辨认，因此易读性较高。反之Sans Serif 则较醒目，但在行文阅读的情況下，Sans Serif 容易造成字母辨认的困扰，常会有来回重读及上下行错乱的情形。
* Serif 强调了字母笔画的开始及结束，因此较易前后连续性的辨识。
* Serif 强调一个word，而非单一的字母，反之Sans Serif则强调个别字母。
* 在小字体的场合，通常Sans Serif比Serif更清晰。
适用用途：
通常文章的內文、正文使用的是易读性较佳的 Serif 字体，这可增加易读性，而且长时间阅读下因为会以word为单位来阅读，较不容易疲倦。而标题、表格內用字则采用较醒目的Sans Serif字体，它需要显著、醒目，但不必长时间盯著这些字来阅读。
像宣传品、海报类，为求醒目，它的短篇的段落也会采用Sans Serif字体。但在书籍、报刊杂志，正文有相当篇幅的情形下，则应采用Serif字体来减轻读者阅读上的负担。在Web设计及浏览器设置中也应遵循此原则为是。
实际应用
在Firefox中（目前似乎只有Firefox有此功能），可以分别单独指定Sans Serif、Serif及Monospace的中西文字体，然而这个选项并未设置在工具菜单中，不过可以在Addressbar中键入about:config，然后在Filter中过滤font找到如下Preference Name：
font.name.monospace.x-western
font.name.monospace.zh-CN
font.name.sans-serif.x-western
font.name.sans-serif.zh-CN
font.name.serif.x-western
font.name.serif.zh-CN
你可以依照上述Sans Serif、Serif及Monospace的原则来分别指定一种对应字体，按照W3C的CSS规则 注2 ，在font（或者font-family）的最后都要求指定一个Serif这样的Generic-family，避免客户端实在没有指定字体时使用本机上的Serif默认字体。
由于Mozilla系的浏览器的这种特性，我们在CSS的font设定中，可以分别设定中西文字体来丰富版面，例如我们指定一组小字体（类似此文章标题下的日期、作者、类别）：
font-family: Arial, PMingLiU, Sans-Serif;
/*按照文章前面所讲，在小字体时Sans-serif更为清晰，所以随便指定一个Arial，
而作为Serif的PMingLiU（明体）在小字体显示时也有不俗的外观。
最后不忘指定一个Sans-Serif类。*/
参考资料：
1. Serif VS. Sans Serif
2. Font family: the ‘font-family’ property
2007-04-01
做了个特殊字符查看网页
今天完成了特殊字符查看网页，并上传到了googlepage上：http://lingsmm.googlepages.com/char.html
显示的内容主要有从MSDN中来的三份特殊字符表，以及从EXCEL的插入字符中选取的中文特殊字符，另外，若选择“User Defined Font“，则可以对扩展ASCII (0~255) 的字符选择显示字体（也可以手工输入其它字体），如常用的Webdings字体。但遗憾的是，在FF2.0.0.1中测试发现，使用style.fontFamily来指定Webdings字体，无法正常显示特殊符号，所以只好使用已经过时的<font face="Webdings">来进行设置。由于此标签在XHTML1.0中，已经被废弃，所以不能在网页头上加 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 否则不能正常显示特殊字符。按我猜想，FF之所以不支持，可能是由于unicode中，已经或将要包含这些符号吧。
由于要包含中文的一些特殊字符，所以网页的字符集，采用了unicode，可能有些字符编码，甚至已经超出了utf-8字符集（没有确认过）
在这个网页的制作过程中，为了同时支持IE6与FF2，写Javascript颇费工夫，不断的冒出问题，做得很不顺利，还好，终于完成了：-）
另外，从网上看到说用CSS，也能实现圆角矩形，不禁试用了一下，感觉不错。
显示的内容主要有从MSDN中来的三份特殊字符表，以及从EXCEL的插入字符中选取的中文特殊字符，另外，若选择“User Defined Font“，则可以对扩展ASCII (0~255) 的字符选择显示字体（也可以手工输入其它字体），如常用的Webdings字体。但遗憾的是，在FF2.0.0.1中测试发现，使用style.fontFamily来指定Webdings字体，无法正常显示特殊符号，所以只好使用已经过时的<font face="Webdings">来进行设置。由于此标签在XHTML1.0中，已经被废弃，所以不能在网页头上加 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 否则不能正常显示特殊字符。按我猜想，FF之所以不支持，可能是由于unicode中，已经或将要包含这些符号吧。
由于要包含中文的一些特殊字符，所以网页的字符集，采用了unicode，可能有些字符编码，甚至已经超出了utf-8字符集（没有确认过）
在这个网页的制作过程中，为了同时支持IE6与FF2，写Javascript颇费工夫，不断的冒出问题，做得很不顺利，还好，终于完成了：-）
另外，从网上看到说用CSS，也能实现圆角矩形，不禁试用了一下，感觉不错。
Labels: Javascript, Web
2007-03-30
使用CSS实现圆角
2007-02-15
招数已老？
asp.net中，在pageLoad()中，检查GridView最新的记录行数，可令人惊讶的是，取来取去，总是之前显示的行数，费了好大的劲，才明白，要在GridView的preRender()中取最新行数，哎，原来如此……，真是招数用老，怎么也转不过弯来，想不到啊，想不到。
参考网址：
http://www.15seconds.com/issue/020102.htm
http://msdn2.microsoft.com/en-us/library/ms178472(VS.80).aspx
参考网址：
http://www.15seconds.com/issue/020102.htm
http://msdn2.microsoft.com/en-us/library/ms178472(VS.80).aspx
2007-02-10
刷，还是不刷，这是个问题
从一览画面，跳出查看画面时，如果该条记录被删除，有些人喜欢同时刷新一览画面。考虑的出发点是不让用户看到失效的链接，造成用户的困惑。
但是在我看来，即使在网络条件畅通的情况下，刷新一览页面也是浪费，要达成的目的也是毫无意义的，如果用户不熟悉电脑相关知识，原来有的记录，刷新后变成没有，不是更困惑么？如果用户知道记录被删除，而下一步他想新建一条记录，那就要等一览刷新后，才能使用新建的链接。想想在海底光缆断裂时，那种无法忍受的等待滋味。。。
但是在我看来，即使在网络条件畅通的情况下，刷新一览页面也是浪费，要达成的目的也是毫无意义的，如果用户不熟悉电脑相关知识，原来有的记录，刷新后变成没有，不是更困惑么？如果用户知道记录被删除，而下一步他想新建一条记录，那就要等一览刷新后，才能使用新建的链接。想想在海底光缆断裂时，那种无法忍受的等待滋味。。。
Labels: Web
2007-02-02
进进出出，一览无遗
在使用 ASP.Net 时，用到了 Ajax，我选择的是 Ajax Pro，在它有网站上，有个视频教程里，用 fiddlertool 来进行查看 ajax 的提交情况，觉得挺有用的，也下载试用，确实不错。
这里简单介绍一下它的功能，更多功能请下载试用或查看官方网站：
http://www.fiddlertool.com/fiddler/version.asp
1、查看 Ajax 提交与返回的内容（其实就是 Http 请求的发送信息与 Web 服务器返回的信息）
163邮局，是采用了 ajax 机制的，我打开后，删除了一封邮件，来测试一下 fiddler 的监视结果。如图，右上部分显示的是 ajax 提交的数据，右下部分为服务器返回的内容。
我们可以看到 <int name="fid">4</int> 这应该是这封邮件的内部 ID
{'code':'S_OK'} 这个返回信息应该是指删除成功的状态标志。
从以上可以看出，采用ajax，发送与接收到信息量很少，有效地减少了网络通讯量。
2、查看 HTML，JS，图片等
点击每个请求的记录，我们可以查看到返回的 Html, JS，甚至还提供了图片显示。我点击了几个 163邮局中的 JS，不过，大部分似乎都作了加密，可能还作了混淆处理吧。
3、切换到 Request Builder，可以直接发出请求，并可以从左边的列表中拖一条记录来，以现有的 Session 来发出请求，具体大家可以试试。
其它功能我就没去仔细看了，其实第2点已经包含了第一点。
这个工具我估计是监视系统的 HTTP 请求，并进行分析甚至加工，篡改。然而，现在却发现无法捕获 FireFox 的 Http 请求，不知道是否需要打开什么设置。不过，当前我也没什么其它特殊需求，就不再去调查了。
另外：官方网站上，这提供了一个叫 SyntaxView inspector 的插件，可以对 Html, Css, XML 进行语法高亮，这对查看返回内容非常有帮助。
Labels: Web
Subscribe to Posts [Atom]
