WebDev

240多个jQuery插件

jquery 是继 prototype 之后又一个优秀的 Javascript 框架。其宗旨是—写更少的代码,做更多的事情。它是轻量级的 js 库(压缩后只有21k) ,这是其它的 js 库所不及 的,它兼容 CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。 jQuery 是一个快速的,简洁的 javaScript 库,使用户能更方便地处理 HTML documents、events、实现动画效果,并且方便地为网站提供 AJAX 交互。 jQuery 还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的插件可供选择。 jQuery 能够使用户的 html 页保持代码和 html 内容分离,也就是说,不用再在 html 里面插入一堆js来调用命令了,只需定义 id 即可。

» 阅读全文

Tags: jquery

使你的网站设计更加科学的23条

科学设计你的网站网页:来自 Eye-Tracking研究的23节必修课 ——Christina Laun

在网络设计领域关于Eye-Tracking的研究十分火爆,但是如何把这些研究结果转变为具体可行的设计来运作依旧是个难点。以下就是一些来自于Eye-Tracking研究结果的窍门,可以为改进你的网站设计提供些意见:

1.对比图像,文字更具吸引力

与你所认为的相反,在浏览一个网站的时候,能够直接吸引用户目光的并不是图像。大多数通过偶然点击进入你的网站的用户,他们是来寻觅信息的而不是图像。因此,保证你的网站设计凸现出最重要的信息板块,这才是设计的首要原则。

2.眼球的第一运动聚焦于网页的左上角

用户浏览网页的这一习惯应该在意料之中,毕竟左上部为主要操作中心这一点为大多数重要的计算机应用程序的设计所采用。在你构建网站考虑网站设计时,应该尽量保持这一格式。要知道,如果你希望保持个人特色,搭建一个成功的网站,你就必须尊重用户们的习惯。

3.用户浏览网页时,首先观察网页的左上部和上层部分,之后再往下阅读,浏览右边的内容

用户普遍的浏览方式呈现出“F”的形状 。保证网站内容的重要要素集中于这些关键区域,以此确保读者的参与。在此放置头条,副题,热点以及重要文章,这样可以吸引到读者进行阅读。

4.读者会忽视横幅广告

研究表明,读者常忽视大部分的横幅广告——尽管你以此维持网站生计——视线往往只停留几分之一秒。如果你想通过广告挣钱,那么必须创新你的广告位以及合理配置网站广告形式。

5.花哨的字体和格式被忽视

为什么呢?那是因为用户会认为这些是广告,并非他们所需要的信息。事实上,研究表明用户很难在充满大量颜色的花哨字体格式里寻找到所需的信息,因为视觉线索告诉他们把这些忽略吧。保持网站的清爽,不要因为华而不实的表面,让重要的信息被忽略。

6.用数词来代替数字

如果使用数词取代数字的罗列,读者会发现在你的网站可以很容易地发现真实的资料。要知道,你是写给那些将第一次浏览你的网站的读者,所以,让他们容易发现他们所需的信息,让他们感兴趣。

7.字体大小影响浏览行为

想改变人们对你的网页的看法吗?改变网页字体的大小。大的字体刺激浏览,而小一些的字体则提高焦点阅读量。根据你的需要,合理配置两者的比例。

8.遇到感兴趣的内容,用户仅会多看一眼副标题

不要过分坚持副标题固定的格式——保证他们的相关性和兴趣。你也可以让副标题包含关键词,这样可以有效利用搜索引擎,让它带来读者。

9.人们大都只浏览网页的小部分内容

如果在用户浏览的时候提供信息使他们尽快锁定目标,就可以把这一点发展成为你的优势。突出某些部分或者创建项目列表使网页信息容易找到和阅读。

10.简短的段落相对于长段落来说有更好的表现力

网页信息是为大多数强调快速浏览的无联网用户提供的。除非上下文的衔接要求,保持信息由简短的段落和句式组成,例如 这个电子商务网站 的产品介绍。

11.根据视觉锁定,一栏格式比多栏格式拥有更好的表现力

别让过多的信息把网站来访者淹没。大多数情况下,简洁更具力量。多栏内容容易被用户忽视,我们需要消除这些干扰。

12.网页顶部和左边的广告更能吸引眼球

如需要在网站植入广告,试图使他们融入网页的左上部,这样他们才能吸引到最大的视觉注意力。当然,用户仅仅会注意到这些广告,这并不意味着他们会用鼠标点击。所以不要为了提高广告的注意力而牺牲原有的网站设计。

13.将广告放置与最佳内容一旁也可以提升注意力

如果想要提升广告的可视性和点击率,可以将其设置于最能引起人兴趣的内容一旁,整合进网页的设计里。这样,用户既可以找到所需的内容,你也能提升广告的效益。

14.在各种测试中,人们阅读文字广告最为专心。

正如上面提到的,一般的互联网用户不会花费太多时间用于查看那些一眼就能看出是广告的内容。这就是文字广告表现出众的原因。他们并没有分散注意力,而是与网页的其它部分内容融为一体,这让他们减少了对读者的视觉刺激,也使这一广告形式获得成功的阅读率。

15.越大的图像吸引越多的注意力

如果要在网页中使用图片,那越大越好。人们更倾向于查看那些能够清楚地看到细节和获取信息的图像。要保证你所用的图片与文章内容相关,否则它更容易被忽视。大多数读者都拥有高速的连接速度,所以请放心在你的网站上使用那些较大体积的图片。

16.干净、清晰的特写图片能吸引更多的视觉注意

可能那些抽象的艺术图片会让你的网站看起来很有味道,但是他们并不会吸引多少读者的注意力。如果你需要使用到这些图片,请确保所用图片的清晰以及其表达内容的简单可读性。必须注意的是,那些与真实的“人”相关的图片比所谓的模特图片更为“优秀”。

17.标题能吸引眼球

浏览网页时,读者能发现的第一内容是标题。确保网页的所有相关链接畅通和有效,以让读者顺利的通过网站进一步搜索。

18.用户花费大量时间察看按钮和菜单

所以,你需要花费额外的时间维护你的精心设计。毕竟,他们不仅吸引了读者的眼球,更是网站设计的重要组成要素。

19.表单格式可以延长读者的注意时间

分解内容和段落,大量使用表单形式来表现你的文章,可以保证读者的浏览率。使用数字和其它标记符号来突出文章的重要内容,会让网站更容易浏览,用户更快的找到所需的信息。

20.避免呈现大块的文本

研究显示,一般的网络浏览者不会花费时间去阅读大块的文本,无论他们有多重要或写得多好。因此,必须把这些大文本分解为若干小段落。突出重要的地方,放置点击的按钮也可以提高用户的注意力。

21.格式可以吸引注意力

在文中使用粗体、大写、彩体、下划线可以帮助用户获取正文所表达的最主要的信息。使用时需要谨慎,因为过多的使用会使你的网页难以阅读,把读者吓跑。

22.利用好空白

尽管把网页的每寸空间都填满这个想法十分诱人,但事实上让网站留出部分剩余更为不错。网站的过量信息会把用户淹没,同时他们也会忘记所提供的大部分的内容。所以保持网页的简洁,给读者预留出一些视觉空间来供读者休息。

23.放置于网页顶部,导航工具的作用将更好的发挥

理想情况下,你不会满足于当读者打开你的网站时仅浏览初始页,而是希望他们浏览翻阅,察看其它感兴趣的内容。将导航器置于网页顶部,就可以让用户通过使用这个工具轻松的找到所需的目标内容。

Tags: 设计

符合标准的带关闭的对联广告

这东西虽然自己不喜欢,可还是有用得着的时候。

» 阅读全文

Tags: 广告

常用正则

匹配中文字符的正则表达式: [\u4e00-\u9fa5]
匹配双字节字符(包括汉字在内): [^\x00-\xff]
应用:计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)
String.prototype.len=function(){return this.replace([^\x00-\xff]/g,"aa").length;}
匹配空行的正则表达式: \n[\s| ]*\r
匹配HTML标记的正则表达式: /<(.*)>.*<\/>|<(.*) \/>/
匹配首尾空格的正则表达式: (^\s*)|(\s*$)
应用:javascript中没有像vbscript那样的trim函数,我们就可以利用这个表达式来实现,如下:
String.prototype.trim = function() {
return this.replace(/(^\s*)|(\s*$)/g, "");
}

利用正则表达式分解和转换IP地址:
下面是利用正则表达式匹配IP地址,并将IP地址转换成对应数值的javascript程序:
function IP2V(ip) {
re=/(\d )\.(\d )\.(\d )\.(\d )/g //匹配IP地址的正则表达式
if(re.test(ip)) {
return RegExp.*Math.pow(255,3)) RegExp.*Math.pow(255,2)) RegExp.*255 RegExp.*1
}
else {
throw new Error("Not a valid IP address!")
}
}

不过上面的程序如果不用正则表达式,而直接用split函数来分解可能更简单,程序如下:
var ip="10.100.20.168"
ip=ip.split(".")
alert("IP值是:" (ip[0]*255*255*255 ip[1]*255*255 ip[2]*255 ip[3]*1))

匹配Email地址的正则表达式: \w ([- .]\w )*@\w ([-.]\w )*\.\w ([-.]\w )*
匹配网址URL的正则表达式: http://([\w-] \.) [\w-] (/[\w- ./?%&=]*)?
利用正则表达式去除字串中重复的字符的算法程序:
var s="abacabefgeeii"
var s1=s.replace(/(.).*/g,"")
var re=new RegExp("[" s1 "]","g")
var s2=s.replace(re,"")
alert(s1 s2) //结果为:abcefgi

用正则表达式从URL地址中提取文件名的javascript程序,如下结果为page1
s="http://www.9499.net/page1.htm"
s=s.replace(/(.*\/)([^\.] ).*/ig,"")
alert(s)

利用正则表达式限制网页表单里的文本框输入内容:
用正则表达式限制只能输入中文:
onkeyup="value=value.replace(/[^\u4E00-\u9FA5]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\u4E00-\u9FA5]/g,''))"
用正则表达式限制只能输入全角字符:
onkeyup="value=value.replace(/[^\uFF00-\uFFFF]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\uFF00-\uFFFF]/g,''))"
用正则表达式限制只能输入数字:
onkeyup="value=value.replace(/[^\d]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"
用正则表达式限制只能输入数字和英文:
onkeyup="value=value.replace(/[\W]/g,'') "onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))"

Tags: 正则

抓网页内容file_get_contents curl fopen

1.file_get_contents

php代码
  1. <?php   
  2. $url = http://www.xxx.com/;
  3. $contents = file_get_contents($url);
  4. //如果出现中文乱码使用下面代码
  5. //$getcontent = iconv("gb2312", "utf-8",file_get_contents($url)); 
  6. //echo $getcontent;
  7. echo $contents;
  8. ?>  

2.curl

PHP代码
  1. <?php   
  2. $url = "http://www.xxx.com/";
  3. $ch = curl_init();
  4. $timeout = 5;
  5. curl_setopt($ch, CURLOPT_URL, $url);
  6. curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
  7. curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, $timeout);
  8. //在需要用户检测的网页里需要增加下面两行
  9. //curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_ANY);
  10. //curl_setopt($ch, CURLOPT_USERPWD, US_NAME.":".US_PWD);
  11. $contents = curl_exec($ch);
  12. curl_close($ch);
  13. echo $contents;
  14. ?>

3.fopen->fread->fclose

PHP代码
  1. <?php   
  2. $handle = fopen ("http://www.xxx.com/""rb");
  3. $contents = "";
  4. do {
  5.    $data = fread($handle, 8192);
  6.    if (strlen($data) == 0) {
  7.    break;
  8.    }
  9.    $contents .= $data;
  10. while(true);
  11. fclose ($handle);
  12. echo $contents;
  13. ?>

Ps1.使用file_get_contents和fopen必须空间开启allow_url_fopen。方法:编辑php.ini,设置allow_url_fopen = On,allow_url_fopen关闭时fopen和file_get_contents都不能打开远程文件。
Ps2.使用curl必须空间开启curl。方法:WIN下修改php.ini,将extension=php_curl.dll前面的分号去掉,而且需要拷贝ssleay32.dll和libeay32.dll到C:\WINDOWS\system32下;Linux下要安装curl扩展。

Tags: php