久久技术网

本博客是作者学习flex, actionscript, html5等脚本技术的经验积累和学习心得.

十款提高开发效率的PHP编码工具

1 . PHPUnit
测试在软件开发中是相当重要的一环,但很多开发者都只是给予很少的时间去测试,因为这工作的确相当耗时,枯燥并且容易出错。为了解决以上问题,自动化测试工具能让开发者编写一系列测试脚本,这些脚本能容易地执行,并且可以根据计划任务去执行。这些自动化测试工具通常提供了测试报告,里面详细描述了每次测试的结果。PHP开发者在自动测试化方面,有一个相当不错的测试框架PHPUNIT。基于非常流行的测试驱动开发方法,如xUnit,PHPUNIT允许开发者使用PHP的语法去编写测试用例,然后用很简单的命令行工具去执行测试。甚至你可以将PHPUNIT与一些持续集成工具如phpUnderControl整合(http://phpundercontrol.org/),这在本文稍侯会讨论。如果你不熟悉phpunit,可以查看之前的文章Use PHPUnit to Implement Unit Testing in Your PHP Development(http://www.phpbuilder.com/columns/Jason_Gilmore052510.php3),详细讲述了如何使用phpunit。
...

(转载)Web入门者必看的HTML代码编写的30条军规

 

本文总结了30条html代码编写指南,只要在编写HTML代码的过程中牢记它们,灵活运用,你一定会写出一手漂亮的代码,早日迈入专业开发者的行列。

1. 一定要闭合HTML标签

在以往的页面源代码里,经常看到这样的语句:


<li>Some text here. 
<li>Some new text here. 
<li>You get the idea.

也许过去我们可以容忍这样的非闭合HTML标签,但在今天的标准来看,这是非常不可取的,是必须百分百避免的。一定要注意闭合你的HTML标签,否则将无法通过验证,并且容易出现一些难以预见的问题。

最好使用这样的形式:


<ul>
<li>Some text here. </li>
<li>Some new text here. </li>
<li>You get the idea. </li>
</ul>

2. 声明正确的文档类型( DocType )

笔者早先曾加入过许多CSS论坛,在那里,如果有用户遇到问题,我们会建议他首先做两件事:

1. 验证CSS文件,解决所有可见的错误

2. 加上文档类型 Doctype

DOCTYPE 定义在HTML标签出现之前,它告诉浏览器这个页面包含的是HTML,XHTML,还是两者混合出现,这样浏览器才能正确的解析标记。

通常有四种文档类型可供选择:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

关于该使用什么样的文档类型声明,一直有不同的说法。通常认为使用最严格的声明是最佳选择,但研究表明,大部分浏览器会使用普通的方式解析这种声明,所以很多人选择使用HTML4.01标准。选择声明的底线是,它是不是真的适合你,所以你要综合考虑来选择适合你得项目的声明。

3. 不要使用嵌入式CSS样式

当你在埋头写代码时,可能会经常顺手或偷懒的加上一点嵌入式css代码,就象这样:


<p style="color: red;">帕兰映像</p>

这样看起来即方便又没有问题,但是它会在你得代码中产生问题。

在你开始写代码时,最好是在内容结构完成之后再开始加入样式代码。

这样的编码方式就像打游击,是一种很山寨的做法。——Chris Coyier

更好的做法是,把这个P的样式定义在样式表文件里:

4. 在页面head标签中引入所有的样式表文件

理论上讲,你可以在任何位置引入CSS样式表,但HTML规范建议在网页的head标记中引入,这样可以加快页面的渲染速度。

在雅虎的开发过程中,我们发现,在head标签中引入样式表,会加快网页加载速度,因为这样可以使页面逐步渲染。 —— ySlow团队


<head>
<title>My Favorites Kinds of Corn</title>
<link rel="stylesheet" type="text/css" media="screen" href="path/to/file.css" />
<link rel="stylesheet" type="text/css" media="screen" href="path/to/anotherFile.css" />
</head>

5. 在页面底部引入javascript文件

要记住一个原则,就是让页面以最快的速度呈现在用户面前。当加载一个脚本时,页面会暂停加载,直到脚本完全载入。所以会浪费用户更多的时间。

如果你的JS文件只是要实现某些功能,(比如点击按钮事件),那就放心的在body底部引入它,这绝对是最佳的方法。

举例:


<p>And now you know my favorite kinds of corn. </p>
<script type="text/javascript" src="path/to/file.js"></script>
<script type="text/javascript" src="path/to/anotherFile.js"></script>
</body>
</html>

6. 不要使用嵌入式JavaScript,这都21世纪了!

许多年以前,还存在一种这样的方式,就是直接将JS代码加入到HTML标签中。尤其是在简单的图片相册中非常常见。本质上讲,一个“onclick”事件是附加在 标签上的,其效果等同于一些JS代码。不需要讨论太多,非常不应该使用这样的方式,应该把代码转移到一个外部JS文件中,然后使用“ addEventListener / attachEvent ”加入时间侦听器。或者使用jquery等框架,之需要使用其“clock”方法。


$('a#moreCornInfoLink').click(function() { 
alert('Want to learn more about corn?'); 
});

7. 开发中随时进行标准验证

很多人并不真正理解标准验证的意义和价值,笔者在一篇博客中详细分析了这个问题。一句话,标准验证是为你服务的,不是给你找麻烦的。

如果你刚开始从事网页制作,那强烈建议你下载这个网页开发工具条(https://addons.mozilla.org/en-US/firefox/addon/60) ,并在编码过程中随时使用”HTML标准验证”和“CSS标准验证”。如果你认为CSS是一种非常好学的语言,那么它会把你整的死去活来。你的不严谨的代码会让你的页面漏洞百出,问题不断,一个好的方法就是—— 验证,验证,再验证。

8. 下载Firebug

Firebug是当之无愧的网页开发最佳插件,它不但可以调试JavaScript,还可以直观的让你了解页面标记的属性和位置。不用多说, 下载它(https://addons.mozilla.org/cn-ZH/firefox/addon/1843)!

9. 使用Firebug!

据笔者观察,大部分的使用者仅仅使用了Firebug 20%的功能,那真是太浪费了,你不妨花几个小时的时间来系统学习这个工具,相信会让你事半功倍。

Firebug教程:

Overview of Firebug(http://michaelsync.net/2007/09/08/firebug-tutorial-overview-of-firebug)

Debug Javascript With Firebug – video tutorial(http://www.digitalmediaminute.com/screencast/firebug-js/)

10. 使用小写的标记

理论上讲,你可以像这样随性的书写标记:


<DIV>
<P>Here's an interesting fact about corn. </P>
</DIV>

最好不要这样写,费力气输入大些字母没有任何用处,并且会让代码很难看,这样子就很好:


<div>
<p>Here's an interesting fact about corn. </p>
</div>

 

11.使用H1 – H6标签

笔者建议你在网页中使用其中全部六种标记,虽然大部分人只会用到前四个,但使用最多的H会有很多好处,比如设备友好、搜索引擎友好等,不妨把你的P标签都替换成H6。

12. 如果是博客,那把H1留给文章标题

今天笔者在Twitter上发起一次讨论:是该把H1定义到LOGO上还是定义到文章标题上,有80%的人选择了后者。

当然具体如何使用要看你的需求,但我建议你在建立博客的时候,将文章题目定为H1,这对搜索引擎优化(seo)是非常有好处的。

13. 下载ySlow

在过去几年里,雅虎的团队在前端开发领域做了许多伟大的工作。前不久,它们发布了一个叫ySlow的Firebug扩展,它会分析你的<网页,并返回 一个“成绩单”,上面细致分析了这个网页的方方面面,提出需要改进的地方,虽然它有点苛刻,但它绝对会对你有所帮助,强烈推荐—— ySlow(http://developer.yahoo.com/yslow/)!

14. 使用UL列表布局导航菜单

通常网站都会有导航菜单,你可以用这样的方式定义:


<div id="nav">
<a href="#">Home </a>
<a href="#">About </a>
<a href="#">Contact </a>
</div>

如果你想书写优美的代码,那最好不要用这种方式,

为什么要用UL布局导航菜单?——因为UL生来就是为定义列表准备的

最好这样定义:


<ul id="nav">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>

15. 学会怎样对付IE

IE一直以来都是前端开发人员的噩梦!

如果你的CSS样式表基本定型了,那么可以为IE单独建立一个样式表,然后这样仅对IE生效:


<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" media="screen" href="path/to/ie.css" />
<![endif]-->

这些代码的意思是:如果用户浏览器是IE6及以下,那这段代码才会生效。如果你想把IE7也包含进来,那么就把“[if lt IE 7]”改为“[if lte IE 7]”。

16. 使用一个好的代码编辑器

不论你是Windows还是Mac用户,这里都有很多优秀的编辑器供你选择:

Mac 用户

Coda(http://www.panic.com/coda/)
Espresso(http://macrabbit.com/espresso/)
TextMate(http://macromates.com/)
Aptana(http://www.aptana.com/)
DreamWeaver CS4(http://www.adobe.com/products/dreamweaver.html)

PC 用户

InType(http://intype.info/home/index.php)
E-Text Editor(http://www.e-texteditor.com/)
Notepad++(http://notepad-plus.sourceforge.net/uk/site.htm)
Aptana(http://www.aptana.com/)
Dreamweaver CS4(http://www.adobe.com/products/dreamweaver.html)

17. 压缩前端代码!

Javascript 压缩服务

Javascript Compressor(http://javascriptcompressor.com/)

JS Compressor(http://www.xmlforasp.net/JSCompressor.aspx)

CSS Compression Services

CSS Optimiser(http://www.cssoptimiser.com/)

CSS Compressor(http://www.cssdrive.com/index.php/main/csscompressor/)

Clean CSS(http://www.cleancss.com/)

18. 缩减,缩减,缩减

回望我们大多数人写的第一个页面,一定会发现严重的 “DIV癖”( divitis ),通常初学者的本能就是把一个段落用DIV包起来,然后为了控制定位而套上更多的DIV。—— 其实这是一种低效而有害的做法。

网页写完后,一定要多次回头检查,尽量的减少元素的数量。能用UL布局的列表就不要用一个个的DIV去布局。

正如写文章的关键是“缩减,缩减,缩减”一样,写页面也要遵循这个标准。

19. 为所有的图片加上Alt属性

为图片加上alt属性的好处是不言而喻的 —— 这样可以让禁用图片或者使用特殊设备的用户无障碍得了解你的王爷信息,并且对图像搜索引擎友好。

firefox不支持显示图像Alt属性,可以加入title属性:


<img src="cornImage.jpg" alt="帕兰映像" title="帕兰映像" />

20. 学会熬夜

我经常不知不觉的学习工作到凌晨,我认为这是个很好的状况。

我的“啊~哈!”时间( “AH-HA” moments,指柳暗花明或豁然开朗的时刻)通常都发生在深夜,比如我彻底理解JavaScript的“闭包”概念,就是在这样一种情况下。如果你还没有感受过这种奇妙的时刻,那就马上试试吧!

 

21. 查看源代码

没有什么比模仿你的偶像能让你更快的学习HTML。起初,我们都要甘做复印机,然后慢慢得发展自己的风格。研究你喜欢的网站页面代码,看看他们是怎么实现的。这是高手的必经之路,你一定要试一下。注意:只是学习和模仿他们的编码风格,而不是抄袭和照搬!

留意网络上各种炫酷的JavaScript效果,如果看上去是使用了插件,那根据它源码中head标签内的文件名,就可以找到这个插件名称,然后就可以学习它据为己用。

22. 为所有的元素定义样式

这一条在你制作其他公司企业网站时尤为必要。你自己不使用blockquote标记?那用户可能会用,你自己不使用OL?用户也可能会。花时间做一个页面,显示出ul, ol, p, h1-h6, blockquotes, 等等元素的样式,检查一下是否有遗漏。

23. 使用第三方服务

译者注:英文原文标题为“使用twitter”

现在互联网上流行着许多可以免费加在网页中的API,这些工具非常强大。它可以帮你实现许多巧妙的功能,更重要的是可以帮你宣传网站。

24. 学习photoshop

Photoshop是前端工程师的一个重要工具,如果你已经熟练掌握HTML和CSS,那不妨多学习一下Photshop。

Psdtuts+上有许多英文的饰品教程:Videos section

Lynda.com 也有大量教程,不过要支付$25美元

“You Suck at Photoshop” 系列教程

花费几个小时的时间学习Photoshop的快捷键操作

25. 学习每一个HTML标签

虽然有些HTML标签很少用到,但你依然应该了解他们。比如“abbr”、“cite”等,你必须学习它们以备不时之需。

26. 参与社区讨论

网络上有许许多多优秀的资源,而社区中也隐藏着许多高手,这里你既可以自学,也能请教经验丰富的开发者。

27. 使用CSS Reset

Css Reset也就Reset Css ,就是重置一些HTML标签样式,或者说默认的样式。

关于是否应该使用CSS Reset,网上也有激烈的争论,笔者是建议使用的。你可以先选用一些成熟的CSS Reset,然后慢慢演变成适合自己的。

28. 对齐元素

简单来说,你应该尽可能的对齐你的网页元素。可以观察一下你喜欢的网站,它们的LOGO、标题、图表、段落肯定是对得非常整齐的。否则就会显得混乱和不专业。

29. 关于PSD切片

现在你已经掌握了HTML、CSS、Photoshop知识,那么你还需要学习如何把PSD转换为网页上的图片和背景,下面有两个不错的教程:

Slice and Dice that PSD(http://net.tutsplus.com/articles/news/slice-and-dice-that-psd/)

From PSD to HTML/CSS (http://net.tutsplus.com/videos/screencasts/converting-a-design-from-psd-to-html/)

30. 不要随意使用框架

Javascript和CSS都有许多优秀的框架,但如果你是初学者,不要急于使用它们。如果你还没能熟练的驾驭CSS,使用框架会混淆你的知识体系。

CSS框架是为熟练开发者设计的,这样会节省它们大量的时间。

原文:http://net.tutsplus.com/tutorials/html-css-techniques/30-html-best-practices-for-beginners/

译文:http://paranimage.com/30-html-guidelines-for-beginners/

 

Flex的事件机制浅析

做过flex项目的兄弟们肯定都有一个体会,那就是一定要了解flex中的事件处理机制,本文就和各位朋友们一起t简单探讨一下flex中的事件机制。

首先我们需要对我们的目标对象添加监听器,填加监听器需要指定事件类型。

比如:

myButton.addEventListener(MouseEvent.CLICK, OnMyButton_ClickHandler);

myButton是一个按钮就是我们所说的目标对象,此行代码就是给myButton这个按钮对象填加了一个事件监听,事件的类型是鼠标单击类型MouseEvent.CLICK,OnMyButton_ClickHandler是我们的事件响应函数,那么当我们用鼠标单击此按钮时,那么此按钮就会触发此事件,此时程序就会进入OnMyButton_ClickHandler函数执行,

那么对OnMyButton_ClickHandler这个函数有什么要求呢?

比如:

function OnMyButton_ClickHandler(event:MouseEvent):void

{

//code

}

要求是此函数要有一个MouseEvent类型的对象做为参数,此对象中包括一些我们想要用到对象,比如我们可以利用event.target取得myButton这个按钮对象,注意还有一个event.currentTarget这两者有区别,咱们放在日后进行讨论学习。

其次我们一个对象只可以注册一个事件监听吗?答案是否,我们当然可以为一个myButton填加多个事件监听了,可以为myButton填加不同类型的监听,同一个事件类型的监听也可以有多个。

比如:

填加不同类型的监听

myButton.addEventListener(MouseEvent.DOUBLE_CLICK, OnMyButton_DoubleClickHandler);

填加多个同种类型的监听

myButton.addEventListener(MouseEvent.CLICK, OnMyButton_ClickHandler1);

myButton.addEventListener(MouseEvent.CLICK, OnMyButton_ClickHandler2);

myButton.addEventListener(MouseEvent.CLICK, OnMyButton_ClickHandler3);

Z-Blog利用微软组件写博客的方法(转载)

本文介绍如何使用Word与Windows Live Writer写Z-Blog
本文使用的Z-Blog版本为 Z-Blog 1.8 Walle Build 100427
Word为2010(2007也可以,2003自觉绕道)与2011版WindowsLive软件包
一、Word的方法
1.打开Word,按下文件,选择新建-博客文章。
2.选择管理账户-新建。
3.博客提供商选择其他严49重抗{议采n集网站的非,法行径!本站真实77地址:http://www.zsxsoft.tk/

8严49重抗{议采n集网站的非,法行径!本站真实77地址:http://www.zsxsoft.tk/

4.
API选择MetaWebLog
URL填写http://你的Z-Blog网站/xml-rpc/index.asp
用户名和密码填写你的zblog管理员密码
5.按下是,与博客提供商联系完成以后,会出现

9

6.写博客
在标题栏输入标题,在内容栏输入内容,点击发布即可。
二、Windows Live Writer
1.为Z-Blog安装插件Windows Live Writer支持(http://download.rainbowsoft.org/plugins/WLWSupport/
2.打开wlw
3.打开配置窗口
4.选择其他服务

10

5.
URL填写http://你的Z-Blog网站/ 
不需要什么xml-rpc,只需要填入域名。
用户名和密码填写你的zblog管理员密码

11

6.等待出现下载已完成文字
7.页面跳转后,按下完成
8.输入标题与内容,按下发布。

12

大功告成
用微软组件写博客,可以避免加载那慢吞吞的可视化组件,何乐而不为?

文章来源:http://www.zsxsoft.tk/post/38Z-BlogLiYongWeiRuanZuJianXieBoKeDeFangFa2010-10-31/

flex监听浏览器关闭事件

公司所有的flex的项目都需要防止用户误操作关闭浏览器导至数据丢失,所以我们需要在flex中监听浏览器的关闭事件,可是flex中又没有直接的办法,我们只好用javascript与flex进行交互来实现此功能

其实javascript调用flex的函数相当简单

先取得flash的html object,然后直接调用就可以了。

这里面比较重要的是我们要熟悉BOM的事件

代码如下:

window.onbeforeunload = function beforeclose() {
var flexObj = '';
  var obj = document.getElementById("FlashObj");//这是你的html中Object

  if (obj) {
  try {
  flexObj = FlashObj.checkExit();//这是调用flex中的函数
  }
  catch (e) { 
  }
  }

//onbeforeunload会根据此函数的返回值来判断是否需要关闭,如果有返回值,那么浏览器就不关闭,如果没有返回值那就直接关闭。
  if (flexObj != '') {
  return flexObj;
  }
  else { return; }
}

CSS清除浮动

前段时间在给一个朋友帮忙做一个网站的时候,使用div+css布局

比如:

 css:

css:

.main {
border: 2px solid red;
width: 400px;
margin: 0 auto;
line-height: 1.6em;
border-image: initial;
}
.content {
border: 5px solid #8FCB67;
...

Ben Forta:网络浏览器和Flash的分界线在变化

 最近在After MAX大会上,Adobe全球平台推广部总监Ben Forta向参会者介绍了很多正在进行的新项目,并且宣布了下一代的创意工具以及Flash的最新计划和对HTML5和新网络标准的制定。在接受赛迪网记者采访时Ben Forta首先是对不再为基于移动设备的支持浏览器的Flash推出更新版本做出澄清。...

分页:[«]1[»]

日历

<< 2012-1 >>

Sun

Mon

Tue

Wed

Thu

Fri

Sat

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

26

27

28

29

30

31

控制面板

最新评论及回复

最近留言

最近引用

文章归档

Search

站点统计

  • 文章总数:8
  • 评论总数:0
  • 引用总数:0
  • 浏览总数:16
  • 留言总数:0
  • 当前主题:Discuz7主题
  • 当前样式:Discuz7

网站收藏

友情链接

图标汇集

  • 本站支持WAP访问
  • 订阅本站的 RSS 2.0 新闻聚合

Copyright www.flex.com 冀ICP备1200031号 Q Q:155202781