本文我们将列举读者们建议的30款网页设计师和开发人员必备的mac应用程序，这些程序或能节省网页或程序开发的时间，或能帮助他们有效实施工作计划。

1. Transmit

功能丰富的FTP / SFTP / WebDAV客户端软件：获取iDisk, FTP, SFTP, 或者TLS/SSL上的文件。可以使用各种程序编辑远程文件，甚至是图形文件。具有拖拽功能和自动同步功能。

2. TextMate

无论你是一名程序开发人员还是设计师，编写代码都是一件非常辛苦的事情，TextMate可以让你工作起来游刃有余，降低脑力负荷，并让常规的手写工作交由电脑来完成。TextMate被我们的读者评选为最有用的和极具扩展功能的文本编辑器，特别是使用Subversion的用户。TextMate产品贴士，是一篇非常有用的文章，提供了12个技巧帮助你更有效的使用TextMate。

3. Anxiety

Anxiety是Mac OS X Leopard下的一款轻量级的To-do工具，可以和iCal以及Mail同步。Anxiety提供了一个简介而紧凑的界面，可以添加和查看你的任务清单，并且可以以各种方式集合在桌面背景上。

4. BBEdit

BBEdit是一款专业的Mac平台下的HTML及文本编辑工具，提供了对文本进行编辑，查找和管理的各种高性能。智能界面可以让你轻松使用BBEdit的各种特性，包括检索目标模式匹配，多文件查找替换（甚至是没有打开的文件以远程服务器上的文件），项目定义工具，功能导览以及针对不同代码语言的语法颜色标识，代码折叠，FTP和SFTP模式打开、保存文件，AppleScript，Mac OS X Unix脚本支持，文本和代码自动完成，当然还有一系列的HTML工具。

5. HyperEdit

Tumult HyperEdit 是一款轻量级的HTML编辑器，它提供了一个预览窗口来实时显示页面。HyperEdit打破了冗长乏味的代码书写模式：写html，保存，在浏览器中加载及预览。它实现了撰写，修改与预览的同步进行，加快了整个页面设计的进程。W3C验证会将错误的语法用红色的下划线标记出来。它内嵌了与Safari相同的渲染引擎，因此不仅符合标准而且速度还非常快。

6. Versions

Versions提供了在mac上用Subversion工作的一个非常好的方式。无论你是一个Subversion高手，还是新手，Versions都会帮你优化你的工作流程。

7. Skitch

skitch不仅允许你快速创建并编辑截屏，而且还提供给你一个服务器空间和平台来储存这些图片方面你在skitch页面上进行浏览。skitch特性包括：网页快照，捕捉对话瞬间，应用程序截屏，iSight捕捉，快速建立想法草图，连接到iPhoto库。

8. LaunchBar

LaunchBar是一款获奖的工具软件，提供了快速接口进入你的应用程序，文件，联系人以及书签，iTunes资源库，以及搜索引擎等，所有这些仅需输入你要查找的项目名称的缩写即可。

9. Quicksilver

当打开Quicksilver的时候，它会创建一个经常使用的文件夹和文件的目录。激活它以后，你可以快速查找和打开目录中的任意一项。Quicksilver可以基于先前的经验来查找哪个项目是你正在查找的。他也支持缩写功能，因此你可以输入整个字符或者片段即可。

10. Littlesnapper

LittleSnapper是一款截屏和网页快照应用程序。特性包括：完整页面捕捉，元素捕捉（意味着你将不再需要使用十字线），突出显示指定区域，内建文本标注，与客户共享快照等。

11. Aptana

Aptana Studio是一款完整的网页开发环境，整合了一系列强大的写作工具以及协作服务帮助你和你的团队实现轻松的工作。创建，调试，测试以及配置可扩展的PHP解决方案。支持jQuery, prototype, dojo, YUI, ExtJS, MooTools及其他 Ajax库。停放和扩展你的PHP及Jaxer 应用，使用Aptana RadRails快速开发Ruby及Rails应用。使用你的Ajax和JavaScript技巧创建服务器端应用等。

12. ForkLift

强大而快速的FTP应用程序。

13. journler

Journler是一款日记及信息记录软件。与iLife整合，语音和视频接口，文件导入和即时搜索与过滤，不仅集成Mail, iWeb以及Address Book，而且还支持博客，AppleScript以及Spotlight 。

14. Evernote

Evernote允许你在任何环境下使用任何工具或平台来捕获信息，并且在任何时候任何地点均可查看这些信息。

15. TimeLog

跟踪项目时间，界面类似iTunes™，任何一个Mac使用者都会对TimeLog感觉非常熟悉。TimeLog可以跟踪你正在使用的软件，并且显示时间线。这对于跟踪你的工作非常容易，甚至是你忘记了开始的时间。

16. Intaglio

Intaglio是Macintosh下的一款传统的绘画绘图软件。仿照原始的Macintosh绘图工具，Intaglio更倾向于初级使用者以及传统的Macintosh使用者。Intaglio创建2D图形，文字，颜色和适用于Mac OS X的脚本来提供作为一款廉价的绘图软件创建出的前所未有的力量和灵活性。Intaglio并不适用于Mac OS X，它起初的目的就是为了探索该平台为绘图工作实现理想化的能力。

17. Code Collector Pro

Code Collector Pro提供了组织，实用以及共享代码 片段的最好解决方案。

18. Rapidweaver

RapidWeaver是Mac OS X下的一款强大的网页设计应用程序。它基于标准的代码，并且能发不到任何ftp服务器上或是.Mac及MobileMe。

19. Paparazzi

Paparazzi是一款小型的Mac OS X工具用来制作网页快照。

20. Growl

Growl是Mac上的一款通知系统。它提供你正在使用的软件的一些提示信息，而无需进行程序切换。

21. Filezilla

另一款免费的FTP应用程序。

22. Mamp

MAMP可以在你的Mac OS X电脑上安装一个服务器环境。只需点几下鼠标，你就可以为Mac OS X安装Apache, PHP以及MySQL。

23. Billings

Billings可以在任何地方生成专业模式的发票，并且它还内建了30款模板供选择。

24. ColorSchemer

ColorSchemer是一款针对爱好者或者高级人士的专业配色程序。通过使用一个动态视觉色轮，可以即可观察各匹配颜色之间的关系，甚至可以让ColorSchemer智能提供给你一些配色建议。

25. ExpanDrive

ExpanDrive提供给你完全透明的打开，编辑，保存你的喜爱程序的方式，甚至是这些文件存在于世界各地的服务器上。透明的意思是说你甚至都不会感觉到你是在操作一个远程服务器上的文件，它就像是在你的电脑上直接使用USB驱动一样。

26. info.xhead

你的生活中总是会存在一些你不想忘掉的信息。不论它是密码，帐号，愿望列表或是让你挣脱乏味工作的百万美元想法，info.xhead 可以储存所有的这一切，并且将他们归类放置。

27. Vector Designer

VectorDesigner是一款使用简单，直观并且功能强大的适量绘图软件。它可以让你创造出各种极具想象力的适量图，如海报，手册，招贴画，logo，网页图形，t-shirt等等。它有丰富的工具和智能图形：轻松创建矩形，椭圆，多边形，五角星，贝尔曲线，甚至还可以将位图转化成矢量图形。

28. Cuppa

Cuppa是Mac OS X上一款小巧的饮茶时间工具，它会告诉你什么时候你的茶可以喝了。

29. PlainView

Plainview是一款全屏幕的浏览器。

30. Silverback

Silverback是一款为设计师和开发人员设计的并不抢眼的实用测试工具。它可以捕捉屏幕动作，录制参与者的动作、声音，轻而易举的添加段落标记，用遥控器控制录制，导出到Quicktime。

[原文链接]

当我们使用photoshop“存储成网页格式”的选项时，我们可以将图片文件压缩的小一些。但是，你是否知道这些图片大小可以被压缩的更多而不降低图片质量呢？有个名叫Smush.It 的网站可以帮助你实现这一点。

学会擅用Snippets

许多的IDE是都提供”code snippet” 控制面板允许你存储一些代码以备后用。你是否发现自己经常会去lipsum.com获取一些常用本文呢？那为什么不试试使用snippet？在Dreamweaver中，按下”Shift+F9″键即可打开snippet标签。你可以将需要的snippet托拽到任何你需要的地方。这个方法将节省你的大量时间。

利用Console.log()进行调试

你或许下载了一个jQuery库，并且在试图掌握它的语法结构。同样，你可能遇到了一些困难并且意识到你无法确认变量的对应值。没关系，你可以这样做：

键入命令：

console.log($someVariable);

现在，打开Firefox（请确认你已安装了FireBug），然后点击F12。你将会看到你正在查找的变量所对应的值。

下载网页开发工具

这是一款由Chris Pederick 开发的，非常实用的Firefox扩展插件，具有很多选项。或许你们大多数看过我视频教程的人都会发现我非常喜欢使用”Edit CSS” 这个选项来实时调整我的样式表。该工具的其他功能包括：

• 轻松禁用Javascript
• 轻松禁用CSS
• 快速HTML/CSS验证链接
• 标尺
• 禁用cookies
• 还有其他一系列很多伟大的功能

Web Developer Toolbar

将Script标签放置到页面最底端

我们似乎很少这样做。虽然它并非总是适宜，但是你的确可以通过把script标签放到<body>标签后来提高网站速度很多倍。

....

大多数现代浏览器在同一台服务器上最多同时加载两个内容。但是，当你加载脚本文件的时候，其他的都不会被同时加载。因此，只要情况允许的话，最好将你的脚本文件移动到文件最底端，以便让服务器先加载其他内容（如图片，css等）。

压缩CSS和Javascript文件

如果网站的性能最你来说最重要的话，我强烈建议你考虑在展开之前压缩CSS和Javascript文件。在开发之前不要嫌它麻烦，这会对你非常有帮助的。

Javascript压缩服务

• Javascript Compressor
• JS Compressor

CSS压缩服务

• CSS Optimiser
• CSS Compressor
• Clean CSS

另外两个有用的JavaScript压缩工具是 YUI Compressor, 和 JSMin.

jQuery贴士集

不久前，tvidesign.co.uk的Jon Hobbs-Smith发表了一篇非常棒的文章详述了jQuery的25个实用技巧。请确保将该页面收藏了。这里列举了我非常喜欢用的一些技巧。

检查元素是否已经存在？

if ($(’#myDiv).length) {

// this code will only run if the div with an id of #myDiv exists.

}

使用Context

很多人都没有意识到这一点，当访问dom元素的时候，jQuery函数会接受第二个参数 – “context”。请往下看：

var myElement = $('#someElement');

该代码将命令jQuery越过整个dom。我们可以通过使用context作为第二个参数来加速网站。

var myElement = $('#someElement', $('.someContainer'));

现在我们将告诉jQuery仅搜索.someContainer 内的元素，并且或略所有该元素以外的东西。

使用ID代替Class

当用jQuery访问ID的时候，通常会使用传统的”getElementById”方式。但是，当访问class元素的时候，jQuery必须使用他自己的方式跨越整个dom，结果这样会花费更长的时间。

产看所有25个技巧!

尽可能使用$_GET代替 $_POST

如果在编写Ajax命令的时候，你可以在$_GET 或者$_POST之间选择的话，那么请选择前者。

” Yahoo! Mail团队发现，当使用XMLHttp请求的时候，POST在浏览器中会通过两个步骤实现：首先发送header，然后再发送数据。因此最好使用GET，它仅使用一个TCP数据分组（除非你有非常多的cookies）。” – Developer.Yahoo.com

请记住：不要轻率的使用$_GET。请先弄清楚你第一步要作什么。

适时使用Library和Framework

无论你使用PHP, ASP.NET, Mootools, jQuery，或他们中的多种，请考虑适时的使用架构。

例如:

• 如果我要在网站上运行一个简单的静态页面，仅需要一个小的Javascript来实现翻转效果，那么使用jQuery的话就不太合适了。
• 如果我的静态网站的大多数特性被放在一个XML文件中，我就不需要使用架构。否则，我将会网站额外的带宽付出许多费用。

但是，如果我正在建设一个负责的网站，需要一个完整的CMS系统和复杂的数据访问，那么我将会使用一些我常用的架构。

请记住：架构仅仅是在需要的时候才会为你服务，否则请慎用。

YSlow

YSlow是一款非常棒的工具可以帮助你检查网站的有效性。

这里有一个很好的 YSlow视频教程 来讲述该款工具的实用性。我强烈推荐你有机会看一看。

学会使用键盘快捷键

大多数有经验的设计师/开发人员都会同意我的观点，如果我要实现网站或者设计的一个变化我都要去工具栏里面寻找相应的菜单，那会浪费我很多时间。我已经使用快捷键很长时间了，以至于我根本不知道这些命令的正确菜单位置。我就知道”Shift + X” 可以打开我需要的面板。

我建议你可以在Google中搜索 “X 快捷键”（X代表软件的名字，比如Photoshop）。打印这些表单放在你垂手可得的地方。在接下来的几个星期中，试着尽可能用鼠标进行操作，渐渐地你就会养成习惯了。

建立一个 “New Website”模板

让我们来看看如何建立一个网站模板。并非所有的网站都需要大型而复杂的应用。有时候，我们仅仅需要一个可以展示我们简历的网站。这时，我们为何不建立一个简单的“模板”来包含你需要的任何东西呢？

在我的模板文件夹里面，我建立了名为”JS”和”CSS”的二级文件夹。

• 前者包含了我的“DD_belatedPNG.js” 文件 (支持IE6 PNG背景透明)。
• 后者包含了一个空白的”default.css” 文件以及我自己的自定义reset文件。

除此之外，我还有一个 “index.html(php)” 文件包含了一些我常用的代码片段。这些并没有什么特别之处，不过会节约我不少时间。

正如你所看到的，我引用了我自己的CSS 和Javascript文件,链接了Google上的 jQuery文件，创建了document.ready() jQuery函数，并且打开了一个标准的”container” div。

这看上去非常简单，但却节省了不少时间。

内联Vs.外联

总的来说，你的所有CSS和Javascript文件应该从页面上移走放入其各自的外部文件中。

为什么这么做?

• 清理代码
• 简报和内容分开很重要
• 使用外部文件，数据会被缓存以备后用。这将降低HTML文件大小而不会导致多余的HTTP请求。

如果你仅有几句简单的样式结构，还是可以有例外的。把他们放在HTML页面内或许还是有益的，但仅限此种情况而已。

使用PHP判定Javascript调本是否被调用

AJAX几乎应用到了现在所有的领域，多数是因为他的用户友好性，这些都要归功于Javascript 库。在有些情况下，你需要考虑是否需要使用Javascrip来调用你的脚本。这需要几天的时间来完成这项任务。

其中一个方法就是当发送POST命令的时候使用Javascript附加上一对独特的键值。然后你可以使用PHP来决定某个特殊的值是否存在。如果存在的话，我们就会知道Javascript被调用了。

一个最好的构建方式就是使用PHP的特性”HTTP_X_REQUESTED_WITH”。

if isset($_SERVER['HTTP_X_REQUESTED_WITH']) {

// write some code and rest assured that the Javascript is enabled.

} else {

// Do something different to compensate for users that have JS turned off.

}

连接到Google的CDN

不久前，Google主机开始存放一些流行的脚本库如jQuery等。如果你正在使用类似的库，我强烈建议你将它们链接到Google的CDN，而不是使用你自己的脚本。

AJAX Libraries API

使用Firefox扩展

我是Google Chrome的忠实用户。他打开的速度非常快，并且运行Javascript的速度也比其他浏览器快很多，至少到目前为止是这样的。但是，你会发现我并不会很快放弃使用Firefox的。它的一系列非常有用的浏览器插件是令人惊叹的。下面就是我最常用的一些：

• Web Developer Toolbar
• S3 Organizer
• Clippings
• Firebug
• IE Tab
• FireFTP
• DownThemAll
• YSlow

如果有用的话，可以使用IDE

现在痛恨微软似乎变得非常流行，攻击那些在开发的时候使用IDE的人似乎非常时髦。事实上，这样看来比较愚蠢。

在很多情况，使用高级的IDE应该还是首选，特别是当你在使用OOP语言工作的时候。现在，如果你仅仅是创建一个小巧的HTML模板，Notepad++和Coda这样的程序已经非常棒了。事实上，在这种情况下我还是建议使用这样的工具的，毕竟多余的功能对你来说没有任何用处。但是，当你开发一些高级程序的时候，还是充分利用IDE的优势吧。

[原文链接]

本文将向你介绍15款高质量的、免费的、简单的网页工具来帮助你详尽的了解一个网站。

1. Yahoo! Site Explorer

Site explorer 是一款基于search API的反向链接查询工具，人们可以通过它查看哪些URL已被Yahoo!搜索收录或是提交还没被收录的URL。该工具可以通过统计一个网站被链接的数量来显示该网站的流行程度。

2. Compete

Compete 是一款基于网页的分析工具，可以帮助你同时比较3个网站的通信量统计以及趋势。它可以评估一个网站的唯一访问者数量和页面浏览次数以及网站的流行度增长率。

3. Quantcast

Quantcast 不仅可以统计网站流量，pv值等，它能够提供一份更加完整的访问者报告，甚至可以统计访问者的性别，年龄和受教育程度。

4. Alexa

成立于1996年的Alexa是目前最流行的网站流量排名统计服务商。它能提供网站的流量统计，并通过这些数据进行一系列的排名。

5. Feed Compare

测试一个网站流行度的有效途径就是查看该网站的RSS的订阅量。如果一个网站使用FeedBurner（一款主流的RSS订阅服务商），你可以使用Feed Compare查看网含的订阅趋势并且同时对4个网站的订阅量增长率进行比较。

6. popuri.us

popuri.us 是一个提供网站流行度、网站综合信息在线检测查询服务的网站。使用非常简单，无需注册，只要输入你想检测的网址即可。帮助你查询出网站的RANK值(比如Google PR、Alexa Rank等)、在网络书签网站中的被收藏连接数(比如del.icio.us等)及RSS阅读器中的订阅数(比如Bloglines等)。另外，它还提供了一个Widget应用，可在你的网站上直接显示Google PR、Alexa Rank等值。

7. socialmeter

socialmeter是一个网页链接分析工具，通过输入一个网页地址就可以得知此网页在一些主要的社会性网站中的链接情况，如Digg、del.icio.us、Google、Technorati和Yahoo My Web等等共11个网站。可以用来查看自已在这些大型网站中的链接情况。

8. TweetVolume

另一种检测网站流行度的方式就是查看Twitter的人们是否在谈论该网站。TweetVolume 可以通过输入关键字和词来查看这些内容被多少Twitter使用者提及。

9. Quarkbase

Quarkbase 是一款综合的网络工具，可以显示一个网站的许多信息。它有一款“Social Popularity”标签可以显示一个网站在一些社会媒体网络如Digg, Stumbleupon以及Delicious上的流行度相关信息。

10. BlogPulse Profiles

如果你对一个博客网站的相关信息感兴趣，logPulse Profiles 这款工具可以帮助你。它是一个简单的网络应用，提供博客的排名，被其它博客提及的频率以及其它相关信息如该博客的文章发布频率，与其类似的博客等。

11. Technorati Blogging Central

Technorati是一款占有主要地位的博客搜索引擎。它的Blogger Central allows允许你查看一个流行博客在世界范围内的排名。Technorati是通过一个博客的反向链接来统计博客流行度的。

12. Statbrain.com

Statbrain.com 是一款十分简单的工具，用来统计每天的页面访问量。

13. Cubestat

Cubestat 也是一款简单的网络工具，提供一个网站的日访问量。不过它的一个独特的地方就是它有一个网站价值评估（美元），价值越高，说明网站越流行。

14. dnScoop

dnScoop 是一个网站相关信息，网站价值查询工具，能够查询的内容包括：域名年限，Google Pagerank，所有指向此域名的网页数，Alex信息，主机IP信息，还可以查看此IP上面其他停放的网站等。

15. WebsiteOutlook

WebsiteOutlook 通过对一个网站的估值、日浏览量以及网站收益等来判定网站的流行度。