<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>四眼天兔工作室 &#187; 实用工具</title>
	<atom:link href="http://www.4ebstudio.com/category/tips/tools/feed" rel="self" type="application/rss+xml" />
	<link>http://www.4ebstudio.com</link>
	<description>网站建设｜Joomla｜Wordpress｜PSD转HTML｜VI｜平面广告</description>
	<lastBuildDate>Tue, 29 Jun 2010 09:18:16 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>iPhone&#21644;iPad&#24320;&#21457;&#20837;&#38376;</title>
		<link>http://www.4ebstudio.com/web-development-for-the-iphone-and-ipad-getting-started.html</link>
		<comments>http://www.4ebstudio.com/web-development-for-the-iphone-and-ipad-getting-started.html#comments</comments>
		<pubDate>Mon, 31 May 2010 02:57:13 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[苹果新知]]></category>
		<category><![CDATA[apple]]></category>
		<category><![CDATA[Apps]]></category>
		<category><![CDATA[iPad]]></category>
		<category><![CDATA[iphone]]></category>
		<category><![CDATA[移动设备]]></category>
		<category><![CDATA[网络应用]]></category>
		<category><![CDATA[网页开发]]></category>

		<guid isPermaLink="false">http://www.4ebstudio.com/?p=1396</guid>
		<description><![CDATA[&#26681;&#25454;&#20840;&#29699;&#26368;&#22823;&#30340;&#25163;&#26426;&#32593;&#32476;&#24191;&#21578;AdMob&#26174;&#31034;&#65292;iPhone&#25805;&#20316;&#31995;&#32479;&#24050;&#32463;&#21344;&#25454;&#20840;&#29699;&#26234;&#33021;&#25163;&#26426;50&#65285;&#30340;&#24066;&#22330;&#20221;&#39069;&#65292;&#32039;&#25509;&#20854;&#21518;&#30340;&#26159;Android&#65292;&#21344;24&#65285;&#12290;&#32780;&#33529;&#26524;&#30340;iPad&#39318;&#24180;&#30340;&#38144;&#21806;&#35745;&#21010;&#26159;1&#33267;4&#19975;&#21488;&#12290;&#26080;&#35770;&#20320;&#21916;&#27426;&#19982;&#21542;&#65292;iPhone&#25805;&#20316;&#31995;&#32479;&#65292;&#29305;&#21035;&#26159;Safari&#65292;&#23545;&#20110;&#32593;&#39029;&#24320;&#21457;&#20154;&#21592;&#26469;&#35828;&#24050;&#32463;&#26159;&#19968;&#32929;&#19981;&#21487;&#24573;&#35270;&#30340;&#21147;&#37327;&#12290;&#22914;&#26524;&#20320;&#36824;&#27809;&#26377;&#20934;&#22791;&#22909;&#65292;&#37027;&#20040;&#29616;&#22312;&#24050;&#32463;&#26159;&#26102;&#20505;&#24320;&#22987;&#29087;&#24713;&#24182;&#28145;&#20837;&#30740;&#31350;&#36825;&#20010;&#25805;&#20316;&#31995;&#32479;&#20102;&#12290;
&#24184;&#36816;&#30340;&#26159;&#65292;iPhone&#25805;&#20316;&#31995;&#32479;&#19978;&#30340;Safari&#26159;&#19968;&#27454;&#21313;&#20998;&#24378;&#22823;&#30340;&#27983;&#35272;&#22120;&#12290;&#21644;&#26700;&#38754;&#31995;&#32479;&#30340;Safari4&#19968;&#26679;&#65292;&#21487;&#20197;&#23436;&#22909;&#30340;&#25903;&#25345;CSS3&#20197;&#21450;HTML5&#12290;&#21516;&#26102;Safari&#36824;&#25552;&#20379;&#20102;&#19968;&#20123;&#38543;&#25163;&#21487;&#29992;&#30340;&#28418;&#20142;&#30340;&#30028;&#38754;&#20803;&#32032;&#65292;&#26377;&#20123;&#22312;iPhone&#21644;iPad&#20043;&#38388;&#36824;&#20250;&#26377;&#25152;&#19981;&#21516;&#12290;&#26368;&#21518;&#35201;&#35828;&#30340;&#26159;&#65292;&#30001;&#20110;iPhone&#25805;&#20316;&#31995;&#32479;&#24050;&#32463;&#23384;&#22312;&#19968;&#27573;&#26102;&#38388;&#20102;&#65292;&#22240;&#27492;&#26377;&#24456;&#22810;&#36164;&#21487;&#20197;&#21033;&#29992;&#12290;
&#25105;&#30693;&#36947;&#22823;&#22810;&#25968;&#20851;&#20110;iPhone&#25805;&#20316;&#24179;&#21488;&#30340;&#35752;&#35770;&#37117;&#38598;&#20013;&#20110;&#21407;&#29983;&#24212;&#29992;&#31243;&#24207;&#12290;&#20294;&#26159;&#65292;&#20351;&#29992;HTML&#65292;JavaScript&#20197;&#21450;CSS&#21516;&#26679;&#21487;&#20197;&#21019;&#24314;&#24378;&#22823;&#30340;&#65292;&#20855;&#26377;&#21407;&#29983;&#22806;&#35266;&#30340;&#39029;&#38754;&#12290;&#26412;&#25991;&#35762;&#30528;&#37325;&#35752;&#35770;&#19977;&#20010;&#20851;&#20110;&#21019;&#24314;&#21644;&#20248;&#21270;&#20320;&#30340;&#32593;&#31449;&#30340;&#35789;&#27719;&#65306;&#35774;&#35745;&#65292;&#20195;&#30721;&#20197;&#21450;&#27979;&#35797;&#12290;

&#22312;&#24320;&#22987;&#35752;&#35770;&#20043;&#21069;&#65292;&#35753;&#25105;&#20204;&#20808;&#26469;&#30475;&#30475;&#29992;&#32593;&#32476;&#24212;&#29992;&#26367;&#20195;&#21407;&#29983;&#24212;&#29992;&#30340;&#20248;&#21183;&#19982;&#21155;&#21183;&#12290;
&#20248;&#21183;&#65306;

&#19981;&#38656;&#35201;&#32463;&#36807;&#33529;&#26524;&#30340;&#23457;&#25209;&#31243;&#24207;&#21644;&#32321;&#25991;&#32539;&#33410;&#65292;&#36825;&#19968;&#28857;&#23545;&#20110;&#29616;&#22312;&#33529;&#26524;&#20844;&#21496;&#27491;&#22312;&#25191;&#34892;&#30340;&#26497;&#20855;&#20105;&#35758;&#30340;&#26465;&#27454;&#26497;&#20854;&#37325;&#35201;&#12290;
&#23545;&#20110;&#22312;&#20854;&#20182;&#27969;&#34892;&#30340;&#25805;&#20316;&#24179;&#21488;&#65292;&#22914;Android&#20197;&#21450;Blackberry&#65292;&#20351;&#29992;&#30456;&#21516;&#30340;&#20195;&#30721;&#36827;&#34892;&#32593;&#32476;&#24212;&#29992;&#30340;&#20248;&#21270;&#20250;&#26356;&#20026;&#23481;&#26131;&#12290;
&#20320;&#19981;&#38656;&#35201;&#23398;&#20064;Objective-C&#12290;
&#22914;&#26524;&#20320;&#30340;&#24212;&#29992;&#31243;&#24207;&#26159;&#25910;&#36153;&#30340;&#65292;&#37027;&#20040;&#20320;&#19981;&#38656;&#35201;&#21644;&#33529;&#26524;&#20844;&#21496;&#36827;&#34892;&#25910;&#30410;&#20998;&#25104;&#12290;
&#20320;&#21487;&#20197;100&#65285;&#30340;&#25511;&#21046;&#20320;&#30340;&#25903;&#20184;&#26041;&#24335;&#65292;&#20419;&#38144;&#20197;&#21450;&#20998;&#38144;&#26041;&#24335;&#12290;&#24403;&#28982;&#65292;&#36825;&#20063;&#21487;&#33021;&#20250;&#25104;&#20026;&#36127;&#38754;&#24433;&#21709;&#65292;&#37027;&#35201;&#30475;&#20320;&#24590;&#20040;&#30475;&#24453;&#36825;&#20214;&#20107;&#20102;&#12290;

&#21155;&#21183;&#65306;

&#19981;&#20250;&#22312;App Store&#37324;&#38754;&#23637;&#31034;&#12290;
&#22312;&#35774;&#22791;&#19978;&#23433;&#35013;&#20250;&#27604;&#36739;&#40635;&#28902;&#12290;
&#26080;&#27861;&#23454;&#29616;iPhone&#25805;&#20316;&#31995;&#32479;&#30340;&#19968;&#20123;&#21407;&#29983;&#30340;&#21151;&#33021;&#65292;&#22914;&#25512;&#36865;&#21450;GUI&#25511;&#21046;&#12290;

&#35774;&#35745;
iPhone&#25805;&#20316;&#24179;&#21488;&#30340;&#32593;&#32476;&#24212;&#29992;&#35774;&#35745;&#21644;&#21407;&#29983;&#24212;&#29992;&#35774;&#35745;&#24456;&#30456;&#20284;&#65292;&#22240;&#27492;&#20320;&#38656;&#35201;&#20351;&#29992;&#19968;&#20123;&#24378;&#22823;&#30340;&#24037;&#20855;&#12290;&#26080;&#35770;&#20320;&#30340;&#32593;&#31449;&#26694;&#26550;&#35774;&#35745;&#24037;&#20855;&#26159;&#38085;&#31508;&#21644;&#32440;&#24352;&#36824;&#26159;&#26700;&#38754;&#36719;&#20214;&#65292;&#20840;&#37117;&#21487;&#20197;&#12290;
&#28789;&#24863;
&#27809;&#26377;&#22810;&#23569;&#20154;&#30693;&#36947;&#33529;&#26524;&#23448;&#32593;&#26377;&#19968;&#20010;&#21483;&#20570;&#8220;Web apps&#8221;&#30340;&#26639;&#30446;&#65292;&#35813;&#26639;&#30446;&#19987;&#38376;&#29992;&#26469;&#23637;&#31034;&#19968;&#20123;&#20248;&#21270;&#36807;&#30340;&#32593;&#31449;&#12290;

&#20197;&#19979;&#26159;&#20854;&#20182;&#19968;&#20123;&#38750;&#24120;&#22909;&#30340;&#31227;&#21160;&#35774;&#22791;&#32593;&#39029;&#35774;&#35745;&#36164;&#28304;&#65306;

Apple Web Apps Listing
Mobile Awesomeness Design Gallery
CSS iPhone Design Gallery
Well Placed Pixels
Apple App Store (&#34429;&#28982;&#36825;&#20123;&#37117;&#26159;&#21407;&#29983;&#30340;&#24212;&#29992;&#31243;&#24207;&#65292;&#19981;&#36807;&#20320;&#21487;&#20197;&#25214;&#21040;&#19968;&#20123;&#24456;&#22909;&#30340;&#35270;&#35273;&#35774;&#35745;&#28789;&#24863;)

&#32440;&#24352;
&#32440;&#24352;&#27169;&#22411;&#26159;&#25105;&#38271;&#26399;&#20197;&#26469;&#19968;&#30452;&#20351;&#29992;&#30340;&#35774;&#35745;&#32593;&#31449;&#26694;&#26550;&#32467;&#26500;&#30340;&#24037;&#20855;&#12290;&#20197;&#19979;&#26159;&#20960;&#27454;&#24120;&#29992;&#30340;&#24037;&#20855;&#65306;


Notepod: iPad and iPhone sketchbooks
App Sketchbook
PixelPads
UI Stencils sticky pads
Apress iPhone Application Sketch Book
Printable iPhone Wireframe Template (&#20813;&#36153;)

&#25968;&#23383;&#21270;
&#19968;&#26086;&#20320;&#24819;&#22909;&#20102;&#20320;&#30340;&#35774;&#35745;&#36208;&#39029;&#65292;&#25105;&#20204;&#38656;&#35201;&#23558;&#20182;&#20204;&#31227;&#21040;&#26700;&#38754;&#19978;&#20855;&#20307;&#21270;&#12290;&#25105;&#38750;&#24120;&#21916;&#27426;&#20351;&#29992;&#30340;&#32593;&#39029;&#26550;&#26500;&#35774;&#35745;&#24037;&#20855;&#26159;OmniGraffle&#65292;&#20294;&#26377;&#26102;&#20505;&#20063;&#20250;&#30452;&#25509;&#20351;&#29992;Photoshop&#36827;&#34892;&#12290;&#19981;&#36807;&#20351;&#29992;&#20160;&#20040;&#65292;&#20197;&#19979;&#36825;&#20123;&#24037;&#20855;&#37117;&#20250;&#23545;&#20320;&#26377;&#24456;&#22823;&#30340;&#24110;&#21161;&#65306;


iPhone GUI PSD 3.0 &#20197;&#21450;&#160;iPad GUI PSD (Photoshop)
Layered iPhone GUI elements (Photoshop)
PSD Vector Kit (Photoshop)
iPad and iPhone stencils; &#26356;&#22810;&#21487;&#20197;&#21442;&#30475;&#160;Graffletopia (OmniGraffle)
iPhone and iPad Development [...]]]></description>
			<content:encoded><![CDATA[<p>&#26681;&#25454;&#20840;&#29699;&#26368;&#22823;&#30340;&#25163;&#26426;&#32593;&#32476;&#24191;&#21578;AdMob&#26174;&#31034;&#65292;iPhone&#25805;&#20316;&#31995;&#32479;&#24050;&#32463;&#21344;&#25454;&#20840;&#29699;&#26234;&#33021;&#25163;&#26426;50&#65285;&#30340;&#24066;&#22330;&#20221;&#39069;&#65292;&#32039;&#25509;&#20854;&#21518;&#30340;&#26159;Android&#65292;&#21344;24&#65285;&#12290;&#32780;&#33529;&#26524;&#30340;iPad&#39318;&#24180;&#30340;&#38144;&#21806;&#35745;&#21010;&#26159;1&#33267;4&#19975;&#21488;&#12290;&#26080;&#35770;&#20320;&#21916;&#27426;&#19982;&#21542;&#65292;iPhone&#25805;&#20316;&#31995;&#32479;&#65292;&#29305;&#21035;&#26159;Safari&#65292;&#23545;&#20110;&#32593;&#39029;&#24320;&#21457;&#20154;&#21592;&#26469;&#35828;&#24050;&#32463;&#26159;&#19968;&#32929;&#19981;&#21487;&#24573;&#35270;&#30340;&#21147;&#37327;&#12290;&#22914;&#26524;&#20320;&#36824;&#27809;&#26377;&#20934;&#22791;&#22909;&#65292;&#37027;&#20040;&#29616;&#22312;&#24050;&#32463;&#26159;&#26102;&#20505;&#24320;&#22987;&#29087;&#24713;&#24182;&#28145;&#20837;&#30740;&#31350;&#36825;&#20010;&#25805;&#20316;&#31995;&#32479;&#20102;&#12290;</p>
<p>&#24184;&#36816;&#30340;&#26159;&#65292;iPhone&#25805;&#20316;&#31995;&#32479;&#19978;&#30340;Safari&#26159;&#19968;&#27454;&#21313;&#20998;&#24378;&#22823;&#30340;&#27983;&#35272;&#22120;&#12290;&#21644;&#26700;&#38754;&#31995;&#32479;&#30340;Safari4&#19968;&#26679;&#65292;&#21487;&#20197;&#23436;&#22909;&#30340;&#25903;&#25345;CSS3&#20197;&#21450;HTML5&#12290;&#21516;&#26102;Safari&#36824;&#25552;&#20379;&#20102;&#19968;&#20123;&#38543;&#25163;&#21487;&#29992;&#30340;&#28418;&#20142;&#30340;&#30028;&#38754;&#20803;&#32032;&#65292;&#26377;&#20123;&#22312;iPhone&#21644;iPad&#20043;&#38388;&#36824;&#20250;&#26377;&#25152;&#19981;&#21516;&#12290;&#26368;&#21518;&#35201;&#35828;&#30340;&#26159;&#65292;&#30001;&#20110;iPhone&#25805;&#20316;&#31995;&#32479;&#24050;&#32463;&#23384;&#22312;&#19968;&#27573;&#26102;&#38388;&#20102;&#65292;&#22240;&#27492;&#26377;&#24456;&#22810;&#36164;&#21487;&#20197;&#21033;&#29992;&#12290;</p>
<p>&#25105;&#30693;&#36947;&#22823;&#22810;&#25968;&#20851;&#20110;iPhone&#25805;&#20316;&#24179;&#21488;&#30340;&#35752;&#35770;&#37117;&#38598;&#20013;&#20110;&#21407;&#29983;&#24212;&#29992;&#31243;&#24207;&#12290;&#20294;&#26159;&#65292;&#20351;&#29992;HTML&#65292;JavaScript&#20197;&#21450;CSS&#21516;&#26679;&#21487;&#20197;&#21019;&#24314;&#24378;&#22823;&#30340;&#65292;&#20855;&#26377;&#21407;&#29983;&#22806;&#35266;&#30340;&#39029;&#38754;&#12290;&#26412;&#25991;&#35762;&#30528;&#37325;&#35752;&#35770;&#19977;&#20010;&#20851;&#20110;&#21019;&#24314;&#21644;&#20248;&#21270;&#20320;&#30340;&#32593;&#31449;&#30340;&#35789;&#27719;&#65306;<strong>&#35774;&#35745;&#65292;&#20195;&#30721;&#20197;&#21450;&#27979;&#35797;</strong>&#12290;</p>
<p><span id="more-1396"></span></p>
<p>&#22312;&#24320;&#22987;&#35752;&#35770;&#20043;&#21069;&#65292;&#35753;&#25105;&#20204;&#20808;&#26469;&#30475;&#30475;&#29992;&#32593;&#32476;&#24212;&#29992;&#26367;&#20195;&#21407;&#29983;&#24212;&#29992;&#30340;&#20248;&#21183;&#19982;&#21155;&#21183;&#12290;</p>
<p>&#20248;&#21183;&#65306;</p>
<ul>
<li>&#19981;&#38656;&#35201;&#32463;&#36807;&#33529;&#26524;&#30340;&#23457;&#25209;&#31243;&#24207;&#21644;&#32321;&#25991;&#32539;&#33410;&#65292;&#36825;&#19968;&#28857;&#23545;&#20110;&#29616;&#22312;&#33529;&#26524;&#20844;&#21496;&#27491;&#22312;&#25191;&#34892;&#30340;&#26497;&#20855;&#20105;&#35758;&#30340;&#26465;&#27454;&#26497;&#20854;&#37325;&#35201;&#12290;</li>
<li>&#23545;&#20110;&#22312;&#20854;&#20182;&#27969;&#34892;&#30340;&#25805;&#20316;&#24179;&#21488;&#65292;&#22914;Android&#20197;&#21450;Blackberry&#65292;&#20351;&#29992;&#30456;&#21516;&#30340;&#20195;&#30721;&#36827;&#34892;&#32593;&#32476;&#24212;&#29992;&#30340;&#20248;&#21270;&#20250;&#26356;&#20026;&#23481;&#26131;&#12290;</li>
<li>&#20320;&#19981;&#38656;&#35201;&#23398;&#20064;Objective-C&#12290;</li>
<li>&#22914;&#26524;&#20320;&#30340;&#24212;&#29992;&#31243;&#24207;&#26159;&#25910;&#36153;&#30340;&#65292;&#37027;&#20040;&#20320;&#19981;&#38656;&#35201;&#21644;&#33529;&#26524;&#20844;&#21496;&#36827;&#34892;&#25910;&#30410;&#20998;&#25104;&#12290;</li>
<li>&#20320;&#21487;&#20197;100&#65285;&#30340;&#25511;&#21046;&#20320;&#30340;&#25903;&#20184;&#26041;&#24335;&#65292;&#20419;&#38144;&#20197;&#21450;&#20998;&#38144;&#26041;&#24335;&#12290;&#24403;&#28982;&#65292;&#36825;&#20063;&#21487;&#33021;&#20250;&#25104;&#20026;&#36127;&#38754;&#24433;&#21709;&#65292;&#37027;&#35201;&#30475;&#20320;&#24590;&#20040;&#30475;&#24453;&#36825;&#20214;&#20107;&#20102;&#12290;</li>
</ul>
<p>&#21155;&#21183;&#65306;</p>
<ul>
<li>&#19981;&#20250;&#22312;App Store&#37324;&#38754;&#23637;&#31034;&#12290;</li>
<li>&#22312;&#35774;&#22791;&#19978;&#23433;&#35013;&#20250;&#27604;&#36739;&#40635;&#28902;&#12290;</li>
<li>&#26080;&#27861;&#23454;&#29616;iPhone&#25805;&#20316;&#31995;&#32479;&#30340;&#19968;&#20123;&#21407;&#29983;&#30340;&#21151;&#33021;&#65292;&#22914;&#25512;&#36865;&#21450;GUI&#25511;&#21046;&#12290;</li>
</ul>
<h2>&#35774;&#35745;</h2>
<p>iPhone&#25805;&#20316;&#24179;&#21488;&#30340;&#32593;&#32476;&#24212;&#29992;&#35774;&#35745;&#21644;&#21407;&#29983;&#24212;&#29992;&#35774;&#35745;&#24456;&#30456;&#20284;&#65292;&#22240;&#27492;&#20320;&#38656;&#35201;&#20351;&#29992;&#19968;&#20123;&#24378;&#22823;&#30340;&#24037;&#20855;&#12290;&#26080;&#35770;&#20320;&#30340;&#32593;&#31449;&#26694;&#26550;&#35774;&#35745;&#24037;&#20855;&#26159;&#38085;&#31508;&#21644;&#32440;&#24352;&#36824;&#26159;&#26700;&#38754;&#36719;&#20214;&#65292;&#20840;&#37117;&#21487;&#20197;&#12290;</p>
<h3>&#28789;&#24863;</h3>
<p>&#27809;&#26377;&#22810;&#23569;&#20154;&#30693;&#36947;&#33529;&#26524;&#23448;&#32593;&#26377;&#19968;&#20010;&#21483;&#20570;&ldquo;<a href="http://www.apple.com/webapps/" target="_blank">Web apps</a>&rdquo;&#30340;&#26639;&#30446;&#65292;&#35813;&#26639;&#30446;&#19987;&#38376;&#29992;&#26469;&#23637;&#31034;&#19968;&#20123;&#20248;&#21270;&#36807;&#30340;&#32593;&#31449;&#12290;</p>
<p><img class="alignleft size-full wp-image-1398" title="&#33529;&#26524;&#23448;&#32593;&#19978;&#30340;&#25512;&#33616;&#32593;&#32476;&#24212;&#29992;" src="http://www.4ebstudio.com/wp-content/uploads/2010/05/Getting-Started.png" alt="Web app on the Apple website" width="500" height="322" /></p>
<p>&#20197;&#19979;&#26159;&#20854;&#20182;&#19968;&#20123;&#38750;&#24120;&#22909;&#30340;&#31227;&#21160;&#35774;&#22791;&#32593;&#39029;&#35774;&#35745;&#36164;&#28304;&#65306;</p>
<ul>
<li><a title="Apple Web apps" href="http://www.apple.com/webapps/" target="_blank">Apple Web Apps Listing</a></li>
<li><a title="Mobile Awesomeness" href="http://www.mobileawesomeness.com" target="_blank">Mobile Awesomeness Design Gallery</a></li>
<li><a title="CSS iPhone" href="http://www.cssiphone.com" target="_blank">CSS iPhone Design Gallery</a></li>
<li><a href="http://wellplacedpixels.com/" target="_blank">Well Placed Pixels</a></li>
<li><a href="http://www.apple.com/iphone/apps-for-iphone/" target="_blank">Apple App Store</a> (&#34429;&#28982;&#36825;&#20123;&#37117;&#26159;&#21407;&#29983;&#30340;&#24212;&#29992;&#31243;&#24207;&#65292;&#19981;&#36807;&#20320;&#21487;&#20197;&#25214;&#21040;&#19968;&#20123;&#24456;&#22909;&#30340;&#35270;&#35273;&#35774;&#35745;&#28789;&#24863;)</li>
</ul>
<h3>&#32440;&#24352;</h3>
<p>&#32440;&#24352;&#27169;&#22411;&#26159;&#25105;&#38271;&#26399;&#20197;&#26469;&#19968;&#30452;&#20351;&#29992;&#30340;&#35774;&#35745;&#32593;&#31449;&#26694;&#26550;&#32467;&#26500;&#30340;&#24037;&#20855;&#12290;&#20197;&#19979;&#26159;&#20960;&#27454;&#24120;&#29992;&#30340;&#24037;&#20855;&#65306;</p>
<p><img class="alignleft size-full wp-image-1403" title="Notepod" src="http://www.4ebstudio.com/wp-content/uploads/2010/05/Getting-Started3.jpeg" alt="" width="500" height="375" /></p>
<ul>
<li><a title="Notepod" href="http://notepod.net/">Notepod: iPad and iPhone sketchbooks</a></li>
<li><a title="App Sketchbook" href="http://appsketchbook.com/">App Sketchbook</a></li>
<li><a title="PixelPads" href="http://www.pixelpads.com/PixelPads_I_Features.html">PixelPads</a></li>
<li><a href="http://www.uistencils.com/products/iphone-sticky-pad">UI Stencils sticky pads</a></li>
<li><a href="http://apress.com/book/view/9781430228233">Apress iPhone Application Sketch Book</a></li>
<li><a href="http://fullofdesign.com/posts/iphone-app-wireframe-template/">Printable iPhone Wireframe Template</a> (&#20813;&#36153;)</li>
</ul>
<h3>&#25968;&#23383;&#21270;</h3>
<p>&#19968;&#26086;&#20320;&#24819;&#22909;&#20102;&#20320;&#30340;&#35774;&#35745;&#36208;&#39029;&#65292;&#25105;&#20204;&#38656;&#35201;&#23558;&#20182;&#20204;&#31227;&#21040;&#26700;&#38754;&#19978;&#20855;&#20307;&#21270;&#12290;&#25105;&#38750;&#24120;&#21916;&#27426;&#20351;&#29992;&#30340;&#32593;&#39029;&#26550;&#26500;&#35774;&#35745;&#24037;&#20855;&#26159;<a title="OmniGraffle for Mac" href="http://www.omnigroup.com/products/omnigraffle/">OmniGraffle</a>&#65292;&#20294;&#26377;&#26102;&#20505;&#20063;&#20250;&#30452;&#25509;&#20351;&#29992;Photoshop&#36827;&#34892;&#12290;&#19981;&#36807;&#20351;&#29992;&#20160;&#20040;&#65292;&#20197;&#19979;&#36825;&#20123;&#24037;&#20855;&#37117;&#20250;&#23545;&#20320;&#26377;&#24456;&#22823;&#30340;&#24110;&#21161;&#65306;</p>
<p><img title="iPad GUI" src="http://www.4ebstudio.com/wp-content/uploads/2010/05/Getting-Started.jpeg" alt="iPad GUI" width="500" height="309" /></p>
<ul>
<li><a title="iPhone" href="http://www.teehanlax.com/blog/2009/06/18/iphone-gui-psd-30/">iPhone GUI PSD 3.0</a> &#20197;&#21450;&nbsp;<a title="iPad" href="http://www.teehanlax.com/blog/2010/02/01/ipad-gui-psd/">iPad GUI PSD</a> (Photoshop)</li>
<li><a href="http://www.designerstoolbox.com/designresources/iphone/">Layered iPhone GUI elements</a> (Photoshop)</li>
<li><a href="http://www.smashingmagazine.com/2008/11/26/iphone-psd-vector-kit/">PSD Vector Kit</a> (Photoshop)</li>
<li><a href="http://www.morford.org/iphoneosdesignstencil/">iPad and iPhone stencils</a>; &#26356;&#22810;&#21487;&#20197;&#21442;&#30475;&nbsp;<a title="Graffletopia" href="http://graffletopia.com/categories/iphone">Graffletopia</a> (OmniGraffle)</li>
<li><a href="http://speckyboy.com/2010/04/30/iphone-and-ipad-development-gui-kits-stencils-and-icons/">iPhone and iPad Development GUI Kits, Stencils and Icons</a></li>
</ul>
<h2>&#20195;&#30721;</h2>
<p>&#24403;&#20320;&#24320;&#22987;&#20026;iPhone&#25805;&#20316;&#31995;&#32479;&#19978;&#30340;Safari&#36827;&#34892;&#20195;&#30721;&#35774;&#35745;&#30340;&#26102;&#20505;&#65292;&#29702;&#35299;&#27983;&#35272;&#22120;&#30340;&#24037;&#20316;&#27169;&#24335;&#26159;&#38750;&#24120;&#37325;&#35201;&#30340;&#12290;&#21478;&#22806;&#65292;iPhone&#21644;iPad&#30340;&#27983;&#35272;&#22120;&#20250;&#26377;&#19968;&#20123;&#32454;&#24494;&#30340;&#24046;&#21035;&#65292;&#20363;&#22914;&#34920;&#21333;&#36873;&#25321;&#30340;&#30418;&#27169;&#22411;&#24037;&#20316;&#27169;&#24335;&#31561;&#12290;&#26368;&#37325;&#35201;&#30340;&#26159;&#65292;Safari&#21487;&#20197;&#24456;&#22909;&#30340;&#25903;&#25345;CSS3&#21644;HTML5&#65292;&#22240;&#27492;&#20320;&#21487;&#20197;&#25918;&#24515;&#20351;&#29992;&#20808;&#36827;&#30340;&#20195;&#30721;&#32780;&#19981;&#29992;&#25285;&#24515;&#36328;&#27983;&#35272;&#22120;&#30340;&#20860;&#23481;&#38382;&#39064;&#12290;</p>
<h3>&#30456;&#20851;&#30693;&#35782;</h3>
<p>&#20107;&#23454;&#19978;&#65292;&#33529;&#26524;&#20844;&#21496;&#23545;&#20110;iPhone&#25805;&#20316;&#31995;&#32479;&#30340;Safari&#35828;&#26126;&#25991;&#26723;&#24050;&#32463;&#36275;&#22815;&#35814;&#32454;&#20102;&#12290;&#21807;&#19968;&#19981;&#36275;&#30340;&#19968;&#28857;&#23601;&#26159;&#32570;&#23569;&#25805;&#20316;&#31995;&#32479;&#21644;&#27983;&#35272;&#22120;&#25506;&#27979;&#30340;&#20351;&#29992;&#24110;&#21161;&#12290;&#20197;&#19979;&#23601;&#26159;&#38024;&#23545;&#36825;&#28857;&#30340;&#30456;&#20851;&#20351;&#29992;&#35828;&#26126;&#65306;</p>
<p><strong><span style="text-decoration: underline;">iPhone &amp; iPod touch&#27983;&#35272;&#22120;&#25506;&#27979;</span></strong></p>
<p><em>The Javascript</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #000066; font-weight: bold;">if</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#40;</span>navigator.<span style="color: #660066;">userAgent</span>.<span style="color: #660066;">match</span><span style="color: #009900;">&#40;</span><span style="color: #009966; font-style: italic;">/iPhone/i</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">||</span> <span style="color: #009900;">&#40;</span>navigator.<span style="color: #660066;">userAgent</span>.<span style="color: #660066;">match</span><span style="color: #009900;">&#40;</span><span style="color: #009966; font-style: italic;">/iPod/i</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>2
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span>document.<span style="color: #660066;">cookie</span>.<span style="color: #660066;">indexOf</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;iphone_redirect=false&quot;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">==</span> <span style="color: #339933;">-</span><span style="color: #CC0000;">1</span><span style="color: #009900;">&#41;</span> window.<span style="color: #660066;">location</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;http://m.espn.go.com/wireless/?iphone&amp;amp;i=COMR&quot;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>3
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p><em>The PHP</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #b1b100;">if</span><span style="color: #009900;">&#40;</span><span style="color: #990000;">strstr</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$_SERVER</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'HTTP_USER_AGENT'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #0000ff;">'iPhone'</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">||</span> <span style="color: #990000;">strstr</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$_SERVER</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'HTTP_USER_AGENT'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #0000ff;">'iPod'</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>2
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #009900;">&#123;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>3
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #990000;">header</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'Location: http://yoursite.com/iphone'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>4
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #990000;">exit</span><span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>5
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #009900;">&#125;</span></pre></td></tr></table></div>

<p><strong><span style="text-decoration: underline;">iPad&#27983;&#35272;&#22120;&#25506;&#27979;</span></strong></p>
<p><em> The Javascript</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">var</span> isiPad <span style="color: #339933;">=</span> navigator.<span style="color: #660066;">userAgent</span>.<span style="color: #660066;">match</span><span style="color: #009900;">&#40;</span><span style="color: #009966; font-style: italic;">/iPad/i</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">!=</span> <span style="color: #003366; font-weight: bold;">null</span><span style="color: #339933;">;</span></pre></td></tr></table></div>

<p><em>The PHP</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000088;">$isiPad</span> <span style="color: #339933;">=</span> <span style="color: #009900;">&#40;</span>bool<span style="color: #009900;">&#41;</span> <span style="color: #990000;">strpos</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$_SERVER</span><span style="color: #009900;">&#91;</span><span style="color: #0000ff;">'HTTP_USER_AGENT'</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">,</span><span style="color: #0000ff;">'iPad'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>

<p><em>The .htaccess</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="txt" style="font-family:monospace;">RewriteCond %{HTTP_USER_AGENT} ^.*iPad.*$</pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>2
</pre></td><td class="code"><pre class="txt" style="font-family:monospace;">RewriteRule ^(.*)$ http://ipad.yourdomain.com [R=301]</pre></td></tr></table></div>

<p><strong><span style="text-decoration: underline;">iPhone &amp; iPod touch&#31383;&#21475;&#26041;&#21521;&#25506;&#27979;</span></strong></p>
<p><em>The Javascript</em></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #003366; font-weight: bold;">function</span> orient<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>2
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #009900;">&#123;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>3
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">    <span style="color: #000066; font-weight: bold;">switch</span><span style="color: #009900;">&#40;</span>window.<span style="color: #660066;">orientation</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#123;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>4
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">            <span style="color: #000066; font-weight: bold;">case</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">:</span> document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;orient_css&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">href</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;css/iphone_portrait.css&quot;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>5
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">            <span style="color: #000066; font-weight: bold;">break</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>6
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">            <span style="color: #000066; font-weight: bold;">case</span> <span style="color: #339933;">-</span><span style="color: #CC0000;">90</span><span style="color: #339933;">:</span> document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;orient_css&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">href</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;css/iphone_landscape.css&quot;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>7
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">            <span style="color: #000066; font-weight: bold;">break</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>8
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">&nbsp;</pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>9
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">            <span style="color: #000066; font-weight: bold;">case</span> <span style="color: #CC0000;">90</span><span style="color: #339933;">:</span> document.<span style="color: #660066;">getElementById</span><span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;orient_css&quot;</span><span style="color: #009900;">&#41;</span>.<span style="color: #660066;">href</span> <span style="color: #339933;">=</span> <span style="color: #3366CC;">&quot;css/iphone_landscape.css&quot;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>10
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">           <span style="color: #000066; font-weight: bold;">break</span><span style="color: #339933;">;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>11
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">&nbsp;</pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>12
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #009900;">&#125;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>13
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">&nbsp;</pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>14
</pre></td><td class="code"><pre class="javascript" style="font-family:monospace;">window.<span style="color: #000066;">onload</span> <span style="color: #339933;">=</span> orient<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></td></tr></table></div>

<p><strong><span style="text-decoration: underline;">iPad&#31383;&#21475;&#26041;&#21521;&#25506;&#27979;</span></strong></p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
</pre></td><td class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">link</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;stylesheet&quot;</span> <span style="color: #000066;">media</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;all and (orientation:portrait)&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;portrait.css&quot;</span>&gt;</span></pre></td></tr></table></div>


<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>2
</pre></td><td class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">link</span> <span style="color: #000066;">rel</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;stylesheet&quot;</span> <span style="color: #000066;">media</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;all and (orientation:landscape)&quot;</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;landscape.css&quot;</span>&gt;</span></pre></td></tr></table></div>

</pre>
</pre>
<h3>jQTouch&#31227;&#21160;&#35774;&#22791;&#26694;&#26550;</h3>
<p><img class="alignleft size-full wp-image-1400" title="jQTouch" src="http://www.4ebstudio.com/wp-content/uploads/2010/05/Getting-Started1.jpeg" alt="" width="500" height="315" /></p>
<p>iPhone&#25317;&#26377;&#20247;&#22810;&#24320;&#21457;&#26694;&#26550;&#65292;&#20854;&#20013;jQTouch&#26159;&#20348;&#20348;&#32773;&#12290;jQTouch&#25552;&#20379;&#20102;&#20840;&#26041;&#20301;&#30340;&#24037;&#20855;&#24110;&#21161;&#20320;&#30340;&#31227;&#21160;&#32593;&#32476;&#24212;&#29992;&#31243;&#24207;&#30475;&#19978;&#21435;&#26356;&#20687;&#21407;&#29983;&#30340;&#12290;&#20320;&#21487;&#20197;&#21040;&#36825;&#37324;<a href="http://jqtouch.com/" target="_blank">&#26597;&#30475;</a>&#35813;&#26694;&#26550;&#30340;&#32593;&#31449;&#65292;&#20063;&#21487;&#20197;&#20351;&#29992;&#20320;&#25163;&#20013;&#30340;iPhone&#36755;&#20837;<a href="http://jqtouch.com/preview/demos/main/" target="_blank">demo&#32593;&#22336;</a>&#26469;&#24863;&#21463;&#35813;&#26694;&#26550;&#24102;&#32473;&#20320;&#30340;&#26080;&#31351;&#39749;&#21147;&#12290;</p>
<h2>&#27979;&#35797;</h2>
<p>&#22312;iPhone&#25805;&#20316;&#31995;&#32479;&#19978;&#21019;&#24314;&#32593;&#31449;&#25110;&#32593;&#32476;&#24212;&#29992;&#31243;&#24207;&#30340;&#19968;&#20010;&#20851;&#38190;&#19988;&#26840;&#25163;&#30340;&#37096;&#20998;&#23601;&#26159;&#27979;&#35797;&#12290;&#21644;&#24120;&#35268;&#30340;&#32593;&#39029;&#27983;&#35272;&#22120;&#30456;&#27604;&#65292;&#35813;&#27979;&#35797;&#20250;&#30456;&#23545;&#22797;&#26434;&#19968;&#20123;&#12290;&#19981;&#36807;&#65292;&#22914;&#26524;&#20320;&#29087;&#24713;&#19968;&#20123;&#24037;&#20855;&#30340;&#20351;&#29992;&#30340;&#35805;&#65292;&#37027;&#20040;&#20250;&#20351;&#27979;&#35797;&#24037;&#20855;&#30456;&#23545;&#23481;&#26131;&#35768;&#22810;&#12290;</p>
<h3>Liveview</h3>
<p><img class="alignleft size-full wp-image-1401" title="liveview" src="http://www.4ebstudio.com/wp-content/uploads/2010/05/Getting-Started2.jpeg" alt="" width="200" height="183" /></p>
<p>Liveview&#26159;&#22312;&#20320;&#36827;&#34892;&#35774;&#35745;&#25110;&#32773;&#20195;&#30721;&#21046;&#20316;&#21021;&#22987;&#38454;&#27573;&#26102;&#30340;&#19968;&#27454;&#26234;&#33021;&#27979;&#35797;&#24037;&#20855;&#12290;&#23427;&#20801;&#35768;&#20320;&#23558;&#26700;&#38754;&#35774;&#35745;&#30340;&#22270;&#29255;&#30340;&#22270;&#29255;&#22312;&#20320;&#30340;&#31227;&#21160;&#35774;&#22791;&#19978;&#36827;&#34892;&#25773;&#25918;&#65292;&#20197;&#20415;&#30475;&#21040;&#35774;&#35745;&#22270;&#30340;&#23454;&#38469;&#25928;&#26524;&#12290;&#36825;&#23545;&#20110;&#33719;&#21462;&#23383;&#20307;&#22823;&#23567;&#20197;&#21450;&#35270;&#35273;&#32454;&#33410;&#26469;&#35828;&#38750;&#24120;&#26377;&#29992;&#65292;&#27605;&#31455;&#26377;&#20123;&#26102;&#20505;&#24819;&#20174;photoshop&#19978;&#25110;&#35768;&#26356;&#20026;&#36924;&#30495;&#30340;&#35270;&#35273;&#25928;&#26524;&#27604;&#36739;&#22256;&#38590;&#12290;</p>
<h3>&#20351;&#29992;iPhone&#27169;&#25311;&#22120;</h3>
<p>&#22312;&#25105;&#30475;&#26469;&#65292;&#27809;&#26377;&#20160;&#20040;&#27604;&#36739;&#22909;&#30340;iPhone&#25110;&#32773;iPad&#30340;&#20223;&#30495;&#22120;&#12290;&#30446;&#21069;&#20320;&#22312;&#32593;&#32476;&#19978;&#25214;&#21040;&#30340;&#37027;&#20123;&#20223;&#30495;&#22120;&#37117;&#26159;&#22312;&#28010;&#36153;&#20320;&#30340;&#26102;&#38388;&#12290;&#20320;&#26368;&#22909;&#21435;&#19979;&#36733;&#33529;&#26524;&#23448;&#26041;&#25552;&#20379;&#30340;iPhone&#25805;&#20316;&#31995;&#32479;&#27169;&#25311;&#22120;&#30340;<a href="https://daw.apple.com/cgi-bin/WebObjects/DSAuthWeb.woa/wa/login?appIdKey=D635F5C417E087A3B9864DAC5D25920C4E9442C9339FA9277951628F0291F620&amp;path=%2F%2Fiphone%2Findex.action" target="_blank">&#26368;&#26032;&#29256;&#26412;</a>&#65292;&#24403;&#28982;&#65292;&#23427;&#20063;&#25903;&#25345;iPad&#12290;</p>
<p>&#34429;&#28982;&#35774;&#32622;&#22909;SDK&#21644;&#26412;&#22320;&#27979;&#35797;&#29615;&#22659;&#38656;&#35201;&#33457;&#19978;&#19968;&#20123;&#21151;&#22827;&#65292;&#20294;&#26159;&#36825;&#20123;&#36824;&#26159;&#20540;&#24471;&#20320;&#21435;&#20570;&#30340;&#65292;&#24635;&#27604;&#20381;&#36182;&#20110;&#19968;&#20123;&#38750;&#23448;&#26041;&#19988;&#32463;&#24120;&#20250;&#20986;&#29616;&#19981;&#31934;&#30830;&#38169;&#35823;&#30340;&#20223;&#30495;&#22120;&#26469;&#35828;&#26356;&#22909;&#12290;</p>
<h2>PhoneGap: &#20004;&#20840;&#20854;&#32654;?</h2>
<p>PhoneGap&#26159;&#19968;&#27454;&#24320;&#28304;&#30340;&#65292;&#21487;&#20197;&#21019;&#24314;&#22810;&#31227;&#21160;&#24179;&#21488;&#30340;&#24320;&#21457;&#26694;&#26550;&#12290;&#22914;&#26524;&#20320;&#24819;&#20351;&#29992;HTML&#65292;CSS&#20197;&#21450;Javascript&#21019;&#24314;&#20320;&#30340;&#24212;&#29992;&#31243;&#24207;&#65292;&#21448;&#24819;&#35753;&#20182;&#20204;&#33021;&#22815;&#21407;&#29983;&#36816;&#34892;&#65292;&#24182;&#19988;&#21487;&#20197;&#20986;&#29616;&#22312;App Store&#19978;&#65292;&#37027;&#20040;<a href="http://phonegap.com/" target="_blank">PhoneGap</a>&#20415;&#26159;&#35299;&#20915;&#26041;&#26696;&#12290;&#23427;&#19981;&#20165;&#25903;&#25345;iPhone&#25805;&#20316;&#31995;&#32479;&#65292;&#36824;&#25903;&#25345;&#36816;&#34892;Android&#65292; Palm&#65292;Symbian&#65292;Windows&#65292;&#20197;&#21450;Blackberry&#25805;&#20316;&#31995;&#32479;&#30340;&#31227;&#21160;&#35774;&#22791;&#12290;</p>
<p><a href="http://www.phonegap.com/2010/04/14/phonegap-and-the-apple-developer-license-agreement/" target="_blank">PhoneGap&#21516;&#26679;&#25903;&#25345;</a>&#26368;&#36817;&#26497;&#20855;&#20105;&#35758;&#30340;3.3.1&#29256;&#26412;&#30340;&#33529;&#26524;&#26381;&#21153;&#26465;&#27454;&#12290;&#25442;&#21477;&#35805;&#35828;&#65292;&#21482;&#35201;&#20320;&#30340;&#24212;&#29992;&#31243;&#24207;&#25903;&#25345;PhoneGap&#65292;&#37027;&#20040;&#23427;&#20063;&#21516;&#26679;&#20250;&#34987;&#33529;&#26524;&#20844;&#21496;&#25152;&#25509;&#21463;&#12290;&#20320;&#21487;&#20197;&#26597;&#30475;&#19968;&#19979;&#20351;&#29992;PhoneGap&#21019;&#24314;&#30340;<a href="http://phonegap.com/projects" target="_blank">&#24212;&#29992;&#31243;&#24207;&#21015;&#34920;</a>&#26469;&#36827;&#19968;&#27493;&#35748;&#35782;&#36825;&#27454;&#24320;&#21457;&#26694;&#26550;&#12290;</p>
<p>&#65339;<a href="http://www.smashingmagazine.com/2010/05/28/web-development-for-the-iphone-and-ipad-getting-started/" target="_blank">&#21407;&#25991;&#38142;&#25509;</a>&#65341;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/web-development-for-the-iphone-and-ipad-getting-started.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>17款MySQL管理与开发工具综述</title>
		<link>http://www.4ebstudio.com/mysql-admin-and-development-tools-round-up.html</link>
		<comments>http://www.4ebstudio.com/mysql-admin-and-development-tools-round-up.html#comments</comments>
		<pubDate>Wed, 01 Apr 2009 09:27:41 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[mysql]]></category>
		<category><![CDATA[数据库]]></category>
		<category><![CDATA[网站开发]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=791</guid>
		<description><![CDATA[MySQL是一款目前最流行的开源数据库，快速，可靠以及易于上手。MySQL的一个主要特性就是它的跨平台支持，他几乎可以在任何操作系统中运行，包括Windows, OSX, Linux以及其他许多许多。因此，MySQL是最好的一款数据库，我们都在使用它。目前的问题就是最好的MySQL管理与开发工具是什么呢？
本文将向你介绍一些适用于初学者及专业人士的，可在Mac, Windows以及Linux上运行的，最实用且最流行的MySQL管理与开发工具。在这些工具中，我们认为最有特色的是phpMyAdmin, MySQL Workbench, HeidiSQL以及 SequelPro。
MySQL Workbench (Win, Linux, Mac)
MySQL Workbench
该软件是一款全能的，具有可视化数据设计的数据库软件，包括与MySQL数据库系统集成的数据库设计，建模，创建及维护功能。免费版属于公众版本，几乎可以满足你的所有需求。如果你觉得免费版使用起来不安全的话，可以使用它的商业版（标准版）。



帮助与支持
MySQL Workbench帮助
下载
选择你要下载的版本

HeidiSQL &#8211; MySQL made easy (Win, Linux)
Heidi SQL
Heidi SQL是一款轻量级的，具有灵活界面的软件。它允许你浏览和编辑你的数据库，管理数据表，查看和编辑记录，管理用户权限，从文本文件导入数据，运行SQL查询，在两个数据库之间进行数据表同步，导出 指定的数据表到其它的数据库或SQL脚本，所有的这些功能都集成在一个直观的Windows界面中。


帮助与支持
Heidi SQL 论坛
下载
jHeidi Alpha 4

你也可以在iPhone上下载一个名为jHeidi Mobi版的小软件，它仅提供Oracle以及MySQL的访问功能。
jHeidi Mobi下载页面
Aqua Data Studio (Win, Linux, OS X, Solaris)
Aqua Data Studio
这是一款完整的IDE，具有4个主要功能区：数据读取以及管理工具；数据库比较工具，源控以及文件系统；为Subversion (SVN) 以及CVS集成的源控；以及一个强大的数据库模型制造工具。Studio具有一个简单统一的界面，允许开发人员同时执行多项任务。


帮助与支持
Aqua Data Studio支持
下载
Aqua Data Studio下载页面

phpMyAdmin
phpMyAdmin
这是一款非常流行，功能丰富的免费工具，使用PHP开发，可以完整管理MySQL。它可以创建及删除数据库，创建/删除/改变数据表，删除/编辑/添加字段，执行任何SQL语句，管理用户及许可权限，以及管理字段的值。这款神奇的工具有一个非常独特的功能就是你可以下载和改变主题（虽然不是一个具有里程碑意义的功能，但是的确很独特），你可以从这里下载主题：phpMyAdmin Themes。


帮助与支持
phpMyAdmin支持
文档
phpMyAdmin文档
下载
phpMyAdmin下载页面

SQLyog MySQL GUI (Win)
SQLyog
SQLyog是另外一款非常流行的SQL管理工具，具有一系列实用功能，包括可视化模型设计工具，可视化读取创建工具，智能代码完成以及一个数据/结构同步工具。它支持HTTP / HTTPs / SSH数据封装以及SSL连接。你也可以指定一个工作管理，预设数据库备份时间表以及使用通知服务来提醒你工作的完成状态。该软件提供一个免费的公众版本以及一个付费的企业版本。你也可以使用MONyog，一个MySQL监视及指导工具。


帮助与支持
SQLyogl
问题解答
SQLyog FAQ
下载
SQLyog下载页面

MySQL-Front (Win)
MYSQL Front
这款软件为MySQL数据库提供了图解式的图形用户界面，是一款“真正”的应用工具。它可以提供比系统内置的更为精细的用户界面，响应迅速，可以毫无延迟的加载HTML页面。如果你的服务商允许的话，你可以直接连接到你的数据库。否则，你需要在你的网站上安装一个小的脚本。登录信息存储在你的硬盘上，因此无需再重新登录到不同的页面。


帮助与支持
MYSQL [...]]]></description>
			<content:encoded><![CDATA[<p>MySQL是一款目前最流行的开源数据库，快速，可靠以及易于上手。MySQL的一个主要特性就是它的跨平台支持，他几乎可以在任何操作系统中运行，包括Windows, OSX, Linux以及其他许多许多。因此，MySQL是最好的一款数据库，我们都在使用它。目前的问题就是最好的MySQL管理与开发工具是什么呢？</p>
<p>本文将向你介绍一些适用于初学者及专业人士的，可在Mac, Windows以及Linux上运行的，最实用且最流行的MySQL管理与开发工具。在这些工具中，我们认为最有特色的是phpMyAdmin, MySQL Workbench, HeidiSQL以及 SequelPro。</p>
<h3>MySQL Workbench (Win, Linux, Mac)</h3>
<p><a href="http://dev.mysql.com/workbench/">MySQL Workbench</a><br />
该软件是一款全能的，具有可视化数据设计的数据库软件，包括与MySQL数据库系统集成的数据库设计，建模，创建及维护功能。免费版属于公众版本，几乎可以满足你的所有需求。如果你觉得免费版使用起来不安全的话，可以使用它的商业版（标准版）。</p>
<p><img class="alignnone size-full wp-image-1179" title="mysqlscreen1" src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen1.jpg" alt="mysqlscreen1" /></p>
<p><span id="more-791"></span></p>
<ul>
<li>帮助与支持<br />
<a href="http://dev.mysql.com/workbench/?page_id=10">MySQL Workbench帮助</a></li>
<li>下载<br />
<a href="http://dev.mysql.com/downloads/workbench/5.1.html">选择你要下载的版本</a></li>
</ul>
<h3>HeidiSQL &#8211; MySQL made easy (Win, Linux)</h3>
<p><a href="http://www.heidisql.com/?&amp;">Heidi SQL</a><br />
Heidi SQL是一款轻量级的，具有灵活界面的软件。它允许你浏览和编辑你的数据库，管理数据表，查看和编辑记录，管理用户权限，从文本文件导入数据，运行SQL查询，在两个数据库之间进行数据表同步，导出 指定的数据表到其它的数据库或SQL脚本，所有的这些功能都集成在一个直观的Windows界面中。</p>
<p><a href="http://www.heidisql.com/?&amp;"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen2.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助与支持<br />
<a href="http://www.heidisql.com/support.php">Heidi SQL 论坛</a></li>
<li>下载<br />
<a href="http://www.heidisql.com/jheidi/">jHeidi Alpha 4</a></li>
</ul>
<p>你也可以在iPhone上下载一个名为jHeidi Mobi版的小软件，它仅提供Oracle以及MySQL的访问功能。</p>
<p><a href="http://www.heidisql.com/jheidi/">jHeidi Mobi下载页面</a></p>
<h3>Aqua Data Studio (Win, Linux, OS X, Solaris)</h3>
<p><a href="http://www.aquafold.com/">Aqua Data Studio</a></p>
<p>这是一款完整的IDE，具有4个主要功能区：数据读取以及管理工具；数据库比较工具，源控以及文件系统；为Subversion (SVN) 以及CVS集成的源控；以及一个强大的数据库模型制造工具。Studio具有一个简单统一的界面，允许开发人员同时执行多项任务。</p>
<p><a href="http://www.aquafold.com/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen3.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助与支持<br />
<a href="http://www.aquafold.com/support.html">Aqua Data Studio支持</a></li>
<li>下载<br />
<a href="http://www.aquafold.com/downloads.html">Aqua Data Studio下载页面</a></li>
</ul>
<h3>phpMyAdmin</h3>
<p><a href="http://www.phpmyadmin.net/home_page/index.php">phpMyAdmin</a></p>
<p>这是一款非常流行，功能丰富的免费工具，使用PHP开发，可以完整管理MySQL。它可以创建及删除数据库，创建/删除/改变数据表，删除/编辑/添加字段，执行任何SQL语句，管理用户及许可权限，以及管理字段的值。这款神奇的工具有一个非常独特的功能就是你可以下载和改变主题（虽然不是一个具有里程碑意义的功能，但是的确很独特），你可以从这里下载主题：<a href="http://www.phpmyadmin.net/home_page/themes.php">phpMyAdmin Themes</a>。</p>
<p><a href="http://www.phpmyadmin.net/home_page/index.php"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/phpmy.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助与支持<br />
<a href="http://www.phpmyadmin.net/home_page/support.php">phpMyAdmin支持</a></li>
<li>文档<br />
<a href="http://www.phpmyadmin.net/home_page/docs.php">phpMyAdmin文档</a></li>
<li>下载<br />
<a href="http://www.phpmyadmin.net/home_page/downloads.php">phpMyAdmin下载页面</a></li>
</ul>
<h3>SQLyog MySQL GUI (Win)</h3>
<p><a href="http://www.webyog.com/en/index.php">SQLyog</a></p>
<p>SQLyog是另外一款非常流行的SQL管理工具，具有一系列实用功能，包括可视化模型设计工具，可视化读取创建工具，智能代码完成以及一个数据/结构同步工具。它支持HTTP / HTTPs / SSH数据封装以及SSL连接。你也可以指定一个工作管理，预设数据库备份时间表以及使用通知服务来提醒你工作的完成状态。该软件提供一个免费的公众版本以及一个付费的企业版本。你也可以使用<a href="http://www.webyog.com/en/screenshots_monyog.php">MONyog</a>，一个MySQL监视及指导工具。</p>
<p><a href="http://www.webyog.com/en/index.php"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/yog.gif" alt="SQLyog MySQL GUI Screenshot" /></a></p>
<ul>
<li>帮助与支持<br />
<a href="http://www.webyog.com/forums/">SQLyogl</a></li>
<li>问题解答<br />
<a href="http://www.webyog.com/faq/">SQLyog FAQ</a></li>
<li>下载<br />
<a href="http://www.webyog.com/en/downloads.php#sqlyog">SQLyog下载</a>页面</li>
</ul>
<h3>MySQL-Front (Win)</h3>
<p><a href="http://www.mysqlfront.de/">MYSQL Front</a></p>
<p>这款软件为MySQL数据库提供了图解式的图形用户界面，是一款“真正”的应用工具。它可以提供比系统内置的更为精细的用户界面，响应迅速，可以毫无延迟的加载HTML页面。如果你的服务商允许的话，你可以直接连接到你的数据库。否则，你需要在你的网站上安装一个小的脚本。登录信息存储在你的硬盘上，因此无需再重新登录到不同的页面。</p>
<p><a href="http://www.mysqlfront.de/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen6.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助与支持<br />
<a href="http://www.mysqlfront.de/forum/">MYSQL Frontl论坛</a></li>
<li>Download<br />
<a href="http://www.mysqlfront.de/download.html">MYSQL Front下载页面</a></li>
</ul>
<h3>Sequel Pro (Mac OS X)</h3>
<p><a href="http://www.sequelpro.com/">Sequel Pro</a></p>
<p>这款MAC OSX下的数据库管理软件可以让你直接读取本地或者远程服务器上的数据库，提供了多种格式的文件导入导出功能，包括SQL, CSV以及XML。Sequel Pro是开源CocoaMySQL项目的一款派生程序。它自称为“Mac OS X下外观最好看的MySQL数据库管理程序”，看看下面的屏幕截图的确没错，界面非常漂亮也极酷。</p>
<p><a href="http://www.sequelpro.com/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/sequel.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助与支持<br />
<a href="http://www.sequelpro.com/support.html">Sequel Pro支持页面</a></li>
<li>下载<br />
<a href="http://www.sequelpro.com/download.html">Sequel Pro下载页面</a></li>
</ul>
<h3>SQL Buddy (Web-App)</h3>
<p><a href="http://www.sqlbuddy.com/">SQL Buddy</a></p>
<p>这款超酷的轻量级ajax数据库管理工具是一款令人震惊的工具。安装非常非常简单，解压文件包到你的服务器即可。如果需要升级的话，删除旧版本然后替换成新的版本。由于是基于Ajax的，因此对浏览器非常友好，可以使用标准的浏览器功能比如“书签”，“返回”以及“刷新”。该工具还提供一些有用的快捷键，你可以查看这里：<a href="http://www.sqlbuddy.com/help/">SQL Buddy Keyboard Sh快捷键</a>。</p>
<p><a href="http://www.sqlbuddy.com/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen8.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.sqlbuddy.com/help/">SQL Buddy Support</a></li>
<li>下载<br />
<a href="http://www.sqlbuddy.com/download/">SQL Buddy下载页面</a></li>
</ul>
<h3>EMS SQL Manager (Win)</h3>
<p><a href="http://www.sqlmanager.net/en/products/mysql/manager">EMS SQL Manager</a></p>
<p>EMS SQL Manager是一款高性能的数据库管理和开发工具。特性包括MySQL切换，查看，储存进程及功能，InnoDB外键（foreign key），允许你创建/编辑所有的MySQL数据库对象，设计数据库视觉样式，运行SQL脚本，导入和导出数据库数据，管理用户及权限以及其他的用户属性。该软件是一款是商业软件，不过他的免费版本已经足够强大了，可以提供很多特性。</p>
<p><a href="http://www.sqlmanager.net/en/products/mysql/manager"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen10.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.sqlmanager.net/products/mysql/manager/faq">EMS SQL Manager支持</a></li>
<li>下载<br />
<a href="http://www.sqlmanager.net/en/products/mysql/manager/download">EMS SQL Manager下载</a>页面</li>
</ul>
<h3>Navicat Lite MySQL Admin Tool (Win, OS X, Linux)</h3>
<p><a href="http://mysql.navicat.com/">Navicat Lite MySQL Admin Tool</a></p>
<p><a href="http://mysql.navicat.com/"></a>Navicat是一款快速，值得信赖并且流行的（已经被下载了上万次）数据库管理工具，旨在简化数据库管理以及降低管理成本。Navicat 迎合数据库管理人员，开发人员以及中小企业而设计的直观GUI（图形用户界面）可以让你以安全和简单的方式创建，组织，读取以及共享信息。Navicat Lite为非赢利性客户提供了免费下载。</p>
<p><a href="http://mysql.navicat.com/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen14.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://support.navicat.com/">Navicat支持</a></li>
<li>下载<br />
<a href="http://mysql.navicat.com/download.html">Navicat下载</a></li>
</ul>
<h3>DreamCoder for MySQL (Win)</h3>
<p><a href="http://www.sqldeveloper.net/index.php">DreamCoder for MySQL</a></p>
<p>DreamCoder支持3.23到6.0版本的MySQL，并且支持所有的MySQL特性，包括数据表，查看，进程，函数，切换，InnoDB Table，外键，UDFS，BLOB Type等。它还包括一些非常先进的选项来进行数据操作，视觉化创建查询，执行查询，脚本执行，生成报告，数据监控以及从一些流行的格式导入导出数据。DreamCoder对于MySQL的新手来说易于上手，对于专业人士来说功能足够强大。</p>
<p><a href="http://www.sqldeveloper.net/index.php"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen15.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.sqldeveloper.net/support.html">DreamCoder支持</a></li>
<li>下载<br />
<a href="http://www.sqldeveloper.net/download.html">DreamCoder下载页面</a></li>
</ul>
<h3>Toad MySQL (Win)</h3>
<p><a href="http://www.toadsoft.com/toadmysql/">Toad MySQL</a></p>
<p><a href="http://www.toadsoft.com/toadmysql/"></a>Toad MySQL 是一款数据库开发和管理工具，提供了高效率的特性来快速创建和执行访问以及管理复杂的数据库系统。它提供的工具可以进行比较，执行以及搜索数据对象，管理项目，导入导出数据。该软件使用了现今流行的“标签文档界面（Tabbed Document Interface）”，这意味着你无需不断的改变，重排或者平铺你的窗口就可以查看到一个完整的最大化的窗口。</p>
<p><a href="http://www.toadsoft.com/toadmysql/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen16.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.toadsoft.com/toadmysql/faq.htm">Toad MySQL 支持</a></li>
<li>下载<br />
<a href="http://www.toadsoft.com/toadmysql/FreewareDownload.htm">Toad MySQL下载页面</a></li>
</ul>
<h3>DB Tools Manager Professional (Win)</h3>
<p><a href="http://www.dbtools.com.br/EN/dbmanagerpro/">DB Tools Manager Professional</a></p>
<p>DBManager 是一款相当强大的数据库管理工具，内建MySQL, PostgreSQL, Interbase/Firebird, SQLite, DBF tables, MSAccess, MSSQL Server, Sybase, Oracle以及ODBC数据库引擎，使之成为一款非常高级的数据库应用程序。免费版本（标准版）具有一些小巧的特性可以为初级使用者提供基本的数据管理需求，你可以进行非商业化的使用。</p>
<p><a href="http://www.dbtools.com.br/EN/dbmanagerpro/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen17.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.dbtools.com.br/EN/forums">DB Tools Manager论坛</a></li>
<li>下载<br />
<a href="http://www.dbtools.com.br/EN/downloads">DB Tools Manager下载页面</a></li>
</ul>
<h3>MyCon &#8211; MySQL GUI (Win)</h3>
<p><a href="http://www.scibit.com/products/mycon/">MyCon &#8211; MySQL GUI</a></p>
<p>MyCon是一款非常强大的基于窗口的图形用户界面（MySQL GUI），可以进行MySQL服务器端的数据库管理。这款使用简单的MySQL GUI客户端包括所有的功能以及工具，满足你作为DBA，开发人员，管理人员，汇报人员或是普通的终端使用者的所有需求。</p>
<ul>
<li>帮助与支持<br />
<a href="http://forum.scibit.com/">MyCon &#8211; MySQL GUI论坛</a></li>
<li>下载<br />
<a href="http://www.scibit.com/products/mycon/">Free MyCon下载页面</a></li>
</ul>
<h3>MyDB Studio (Win)</h3>
<p><a href="http://www.mydb-studio.com/">MyDB Studio</a></p>
<p>MyDB Studio是MySQL服务器管理的工具套件。MyDB Studio（免费版）专为MySQL开发人员及管理人员设计，可以快速的进行管理，创建，执行访问以及有效的开发SQL和PHP代码。可以关注一下即将面试的Adobe Air版本的MyDB Studio，据说非常酷。</p>
<p><a href="http://www.mydb-studio.com/"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen18.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.mydb-studio.com/index.php?lang=en&amp;p=4">MyDB Studio FAQ</a></li>
<li>下载<br />
<a href="http://www.mydb-studio.com/index.php?lang=en&amp;p=3">MyDB Studio下载页面</a></li>
</ul>
<h3>MySQL Sidu (Win)</h3>
<p><a href="http://sidu.sourceforge.net/mysql-sidu.php">MySQL Sidu</a></p>
<p>MySQL Sidu是一款免费的MySQL客户端程序，通过你的浏览器进行工作，简单，直观并且 易于上手。Sidu并不具有和其他类似工具一样强大的功能，但是它捆绑的特性也足够用了。虽然功能有限，但是正如他的名字那样可以完成基本需求（Sidu由Select Insert Delete Update几个单词的首字母组成，意思是选择，插入，删除，更新）。你也可以使用Firefox的扩展插件在网页上进行工作。详细说明可以看这里：<a href="http://sidu.sourceforge.net/mysql-sidu-addon.php">Firefox addon for MySQL Sidu</a>。</p>
<p><a href="http://sidu.sourceforge.net/mysql-sidu.php"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen19.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://sidu.sourceforge.net/mysql-sidu-support.php">MySQL Sidu支持</a></li>
<li>下载<br />
<a href="http://sidu.sourceforge.net/download-mysql-client-free.php">MySQL Sidu下载页面</a></li>
</ul>
<h3>apache的朋友 &#8211; xampp (Win, Mac, Linux, Solaris)</h3>
<p><a href="http://sidu.sourceforge.net/mysql-sidu.php">xampp</a></p>
<p><a href="http://sidu.sourceforge.net/mysql-sidu.php"></a>安装Apache服务器并非容易的事情，如果你还想再添加MySQL, PHP以及Perl就更加困难了。XAMPP是一款包含了MySQL, PHP以及Perl的易于安装的Apache安装包。它的安装和使用相当简单，下载，解压，执行即可。</p>
<p><a href="http://www.apachefriends.org/en/xampp.html"><img src="http://4ebstudio.com/wp-content/uploads/2009/04/mysqlscreen20.jpg" alt="MySql Tools Screenshot" /></a></p>
<ul>
<li>帮助和支持<br />
<a href="http://www.apachefriends.org/en/contact.html">xampp支持</a></li>
<li>下载<br />
<a style="text-decoration: none;" href="http://www.apachefriends.org/en/xampp.html">xampp下载页面</a></li>
</ul>
<p>[<a href="http://www.smashingmagazine.com/2009/03/25/mysql-admin-and-development-tools-round-up/">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/mysql-admin-and-development-tools-round-up.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>13个加速WordPress并提高性能的技巧</title>
		<link>http://www.4ebstudio.com/13-great-wordpress-speed-tips-tricks-for-max-performance.html</link>
		<comments>http://www.4ebstudio.com/13-great-wordpress-speed-tips-tricks-for-max-performance.html#comments</comments>
		<pubDate>Tue, 24 Mar 2009 06:38:13 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[网站优化]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=101</guid>
		<description><![CDATA[对于一个成功的网站来说，性能是一个关键因素。如今WordPress已经越来越流行，但是它只有在某些情况下才能发挥出它的最佳效用。如果你觉得你的wordpress还没有发挥出最佳性能，并且你希望能够提高你网站的点击量或者发觉一些你所不知道的wordpress的隐藏功能，那么你可以试试以下的一些建议。
一些基本且简单的步骤
1. 升级到最新版本
WordPress 2.7相对之前的版本有很多性能上的提高，所以你最好升级到到最新的版本。
2. 移除不必要的插件，并更新现有的插件
移除任何你不使用的插件。禁用并且直接从你的服务器上将他们删除。禁用插件将会影响到网站的速度因为Wordpress会自动检测这些插件是启用了还是未启用。另外，你必须将你正在使用的插件升级到最新版本。开发人员之所以发布新的版本是因为他们修改了一些代码从而使插件能够更好的运行。

3. 最小化PHP以及数据库读取
我阅读了 Wpcandy’s simple ways to speed up WordPress 这篇非常好的技巧。它提供了许多建议来降低PHP和数据库读取。每当你的网站页面加载的时候，如果你的浏览器不得不执行任何PHP读取，它将增加页面的加载时间。如果你使用静态的HTML代替PHP读取，每次网页加载的时候，浏览器只读取HTML。
4. 从myPhpAdmin优化和修复你的数据库
每周或者定期你应该登录到你的myPhpAdmin对数据进行优化。打开你的Wordpress数据库图表，将所有选项全部选取，然后在选择框中选择“优化图表(Optimise Tables)”和“修复图表(Repair Tables)” 选项。你会惊奇的发现这个建议是多么的好，它将对现有数据库优化10%。

整理你的图片
5. 使用值得信赖的图片存储服务商
试着将网站上的图片，CSS，JavaScript和其他静态文件存放在Amazon S3存储空间上 ，你会发现你的服务器的CPU及内存的平均消耗数量会减少很多。具体请参考这里。

你也可以试试这个WordPress插件，WP-Offload将通过卸载你的静态内容如图片，文件以及多媒体等加速你的博客性能。这将大大降低你的宽带消耗以及HTTP请求数据。
6. 使用Shrink O’Matic优化你的图片
Shrink O’Matic是一款AIR软件可以轻松的批量修改你的图片大小。它可以处理JPGs, GIFs以及PNGs格式的图片。简单的拖拽图片，然后按照你的意思修改图片大小。你还以选择输出的大小，文件名称和格式。

提高性能的好建议
7.安装WP Super Cache插件
我猜你们大多数人都知道为什么我会坚持使用该插件。该插件可以从你的动态Wordpress博客上生成静态的html文件。当一个静态的html文件生成以后，你的服务器将不用再去读取那些极占资源的PHP脚本，并且不会去加载数据库中的任何内容，这样你的文章将会被加载的更快速。
8.PHP Speedy WP
PHP Speedy WP可以迅速且轻松的加速你的WordPress网站并且改善你的博客响应时间。CSS背景图片可以自动的转化为Data URI，这就十分有效的降低了HTTP请求的数量。另外更重要的是，它和IE浏览器器兼容，即使后者不支持Data URI。不幸的是，PHP speedy 存在一些漏洞需要修复：合并后的JavaScrip被放置在了页面头部，这样它就不能在WP Super Cache中工作。为了解决这个问题，你必须查看Prelovac提供的这篇文章，对这两个插件进行一些修改。

9.WP CSS
该插件可以备份压缩（GZIP）以及去除CSS文件中的空格。它可以让你自信的在CSS文件内使用@import而无需顾虑客户端的情况。它将查看你的style.css文件并且将任何@import文件置入其中。同时还会提供一个缓存修改时间。你还可以在指定的页面添加CSS文件或者将他们都放置在一个文件里面。
10.DB Cache
这个插件可以定期缓存你的每一个数据库。他的速度非常快而且仅使用了很少的空间。
11.通过使用AJAX Libraries API 加速访问你的常用架构
 AJAX Libraries API可以加速开发人员制作网页应用的速度，它仅仅是通过将一些非常流行的javascript库全都存放在了一起，这些库包括：

jQuery
prototype
script.aculo.us
MooTools
dojo

你可以直接添加这些链接：

&#60;script src=&#34;http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js&#34; type=&#34;text/javascript&#34;&#62;&#60;!--mce:0--&#62;&#60;/script&#62;




或者可以使用Google’s API:

&#60;script src=&#34;http://www.google.com/jsapi&#34; type=&#34;text/javascript&#34;&#62;&#60;!--mce:1--&#62;&#60;/script&#62;


&#60;script type=&#34;text/javascript&#34;&#62;&#60;!--mce:2--&#62;&#60;/script&#62;




通过使用 google.load()方式，你的应用程序速度将会提升很多。
12.显示页面加载时间和读取数量
这里有一个非常简单的代码可以插入到你的模板中来显示你的页面加载时间，或者有多少sql数据被执行了。这个技巧对于判定WordPress优化效果非常有用。

 queries in   [...]]]></description>
			<content:encoded><![CDATA[<p>对于一个成功的网站来说，性能是一个关键因素。如今WordPress已经越来越流行，但是它只有在某些情况下才能发挥出它的最佳效用。如果你觉得你的wordpress还没有发挥出最佳性能，并且你希望能够提高你网站的点击量或者发觉一些你所不知道的wordpress的隐藏功能，那么你可以试试以下的一些建议。</p>
<p><strong>一些基本且简单的步骤</strong></p>
<h4 class="title">1. 升级到最新版本</h4>
<p>WordPress 2.7相对之前的版本有很多性能上的提高，所以你最好<a href="http://wordpress.org/download/">升级到</a>到最新的版本。</p>
<h4 class="title">2. 移除不必要的插件，并更新现有的插件</h4>
<p>移除任何你不使用的插件。禁用并且直接从你的服务器上将他们删除。禁用插件将会影响到网站的速度因为Wordpress会自动检测这些插件是启用了还是未启用。另外，你必须将你正在使用的插件升级到最新版本。开发人员之所以发布新的版本是因为他们修改了一些代码从而使插件能够更好的运行。</p>
<p><span id="more-101"></span></p>
<h4 class="title">3. 最小化PHP以及数据库读取</h4>
<p>我阅读了 <a href="http://wpcandy.com/articles/tutorials/4-simple-ways-to-speed-up-wordpress.html">Wpcandy’s simple ways to speed up WordPress</a> 这篇非常好的技巧。它提供了许多建议来降低PHP和数据库读取。每当你的网站页面加载的时候，如果你的浏览器不得不执行任何PHP读取，它将增加页面的加载时间。如果你使用静态的HTML代替PHP读取，每次网页加载的时候，浏览器只读取HTML。</p>
<h4 class="title">4. 从myPhpAdmin优化和修复你的数据库</h4>
<p>每周或者定期你应该登录到你的myPhpAdmin对数据进行优化。打开你的Wordpress数据库图表，将所有选项全部选取，然后在选择框中选择“优化图表(Optimise Tables)”和“修复图表(Repair Tables)” 选项。你会惊奇的发现这个建议是多么的好，它将对现有数据库优化10%。</p>
<p class="img"><img class="alignnone size-full wp-image-807" title="wordpress_speed_5" src="http://4ebstudio.com/wp-content/uploads/2009/03/wordpress_speed_5.jpg" alt="wordpress_speed_5" width="500" height="172" /></p>
<h3 class="title">整理你的图片</h3>
<h4 class="title">5. 使用值得信赖的图片存储服务商</h4>
<p>试着将网站上的图片，CSS，JavaScript和其他静态文件存放在<a href="http://aws.amazon.com/s3/">Amazon S3存储空间上 </a>，你会发现你的服务器的CPU及内存的平均消耗数量会减少很多。具体请参考<a href="http://www.labnol.org/internet/host-images-files-on-amazon-s3-storage/4923/">这里</a>。</p>
<p class="img"><img class="alignnone size-full wp-image-808" title="wordpress_speed_6" src="http://4ebstudio.com/wp-content/uploads/2009/03/wordpress_speed_6.jpg" alt="wordpress_speed_6" width="495" height="230" /></p>
<p>你也可以试试这个<a href="http://wordpress.org/extend/plugins/wp-offload/">WordPress插件</a>，WP-Offload将通过卸载你的静态内容如图片，文件以及多媒体等加速你的博客性能。这将大大降低你的宽带消耗以及HTTP请求数据。</p>
<h4 class="title">6.<a href="http://toki-woki.net/p/Shrink-O-Matic/"> 使用Shrink O’Matic优化你的图片</a></h4>
<p>Shrink O’Matic是一款AIR软件可以轻松的批量修改你的图片大小。它可以处理JPGs, GIFs以及PNGs格式的图片。简单的拖拽图片，然后按照你的意思修改图片大小。你还以选择输出的大小，文件名称和格式。</p>
<p class="img"><img class="alignnone size-full wp-image-804" title="wordpress_speed_1" src="http://4ebstudio.com/wp-content/uploads/2009/03/wordpress_speed_1.jpg" alt="wordpress_speed_1" width="500" height="271" /></p>
<h3 class="title">提高性能的好建议</h3>
<h4 class="title">7.<a href="http://wordpress.org/extend/plugins/wp-super-cache/">安装WP Super Cache插件</a></h4>
<p>我猜你们大多数人都知道为什么我会坚持使用该插件。该插件可以从你的动态Wordpress博客上生成静态的html文件。当一个静态的html文件生成以后，你的服务器将不用再去读取那些极占资源的PHP脚本，并且不会去加载数据库中的任何内容，这样你的文章将会被加载的更快速。</p>
<h4 class="title">8.<a href="http://aciddrop.com/2008/12/11/php-speedy-wp-05-now-works-with-wordpress-27/">PHP Speedy WP</a></h4>
<p><a href="http://aciddrop.com/2008/12/11/php-speedy-wp-05-now-works-with-wordpress-27/">PHP Speedy WP</a>可以迅速且轻松的加速你的WordPress网站并且改善你的博客响应时间。CSS背景图片可以自动的转化为Data URI，这就十分有效的降低了HTTP请求的数量。另外更重要的是，它和IE浏览器器兼容，即使后者不支持Data URI。不幸的是，PHP speedy 存在一些漏洞需要修复：合并后的JavaScrip被放置在了页面头部，这样它就不能在WP Super Cache中工作。为了解决这个问题，你必须查看<a href="http://www.prelovac.com/vladimir/optimize-wordpress-page-loading-time-with-php-speedy-and-wp-super-cache">Prelovac</a><a href="http://www.prelovac.com/vladimir/optimize-wordpress-page-loading-time-with-php-speedy-and-wp-super-cache">提供的这篇文章</a>，对这两个插件进行一些修改。</p>
<p class="img"><img class="alignnone size-full wp-image-805" title="wordpress_speed_3" src="http://4ebstudio.com/wp-content/uploads/2009/03/wordpress_speed_3.jpg" alt="wordpress_speed_3" width="500" height="330" /></p>
<h4 class="title">9.<a href="http://wordpress.org/extend/plugins/wp-css/">WP CSS</a></h4>
<p>该插件可以备份压缩（GZIP）以及去除CSS文件中的空格。它可以让你自信的在CSS文件内使用@import而无需顾虑客户端的情况。它将查看你的style.css文件并且将任何@import文件置入其中。同时还会提供一个缓存修改时间。你还可以在指定的页面添加CSS文件或者将他们都放置在一个文件里面。</p>
<h4 class="title">10.<a href="http://wordpress.org/extend/plugins/db-cache/">DB Cache</a></h4>
<p>这个插件可以定期缓存你的每一个数据库。他的速度非常快而且仅使用了很少的空间。</p>
<h4 class="title">11.<a href="http://code.google.com/apis/ajaxlibs/">通过使用AJAX Libraries API</a><a href="http://code.google.com/apis/ajaxlibs/"> 加速访问你的常用架构</a></h4>
<p><a href="http://code.google.com/apis/ajaxlibs/"> AJAX Libraries API</a>可以加速开发人员制作网页应用的速度，它仅仅是通过将一些非常流行的javascript库全都存放在了一起，这些库包括：</p>
<ul>
<li><a href="http://code.google.com/apis/ajaxlibs/documentation/index.html#jquery">jQuery</a></li>
<li><a href="http://code.google.com/apis/ajaxlibs/documentation/index.html#prototype">prototype</a></li>
<li><a href="http://code.google.com/apis/ajaxlibs/documentation/index.html#script_aculo_us">script.aculo.us</a></li>
<li><a href="http://code.google.com/apis/ajaxlibs/documentation/index.html#mootools">MooTools</a></li>
<li><a href="http://code.google.com/apis/ajaxlibs/documentation/index.html#dojo">dojo</a></li>
</ul>
<p>你可以直接添加这些链接：</p>

<div class="wp_syntax"><div class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js&quot;</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--mce:0--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span></pre></div></div>

<table class="sortable" border="0">
<tbody></tbody>
</table>
<p>或者可以使用Google’s API:</p>

<div class="wp_syntax"><div class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">src</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;http://www.google.com/jsapi&quot;</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--mce:1--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span></pre></div></div>


<div class="wp_syntax"><div class="code"><pre class="html4strict" style="font-family:monospace;"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">script</span> <span style="color: #000066;">type</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;text/javascript&quot;</span>&gt;</span><span style="color: #808080; font-style: italic;">&lt;!--mce:2--&gt;</span><span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">script</span>&gt;</span></pre></div></div>

<table class="sortable" border="0">
<tbody></tbody>
</table>
<p>通过使用 google.load()方式，你的应用程序速度将会提升很多。</p>
<h4 class="title">12.<a href="http://www.wprecipes.com/how-to-display-page-loading-time-number-of-queries">显示页面加载时间和读取数量</a></h4>
<p>这里有一个非常简单的代码可以插入到你的模板中来显示你的页面加载时间，或者有多少sql数据被执行了。这个技巧对于判定WordPress优化效果非常有用。</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"> queries in   seconds<span style="color: #339933;">.</span></pre></div></div>

<table class="sortable" border="0">
<tbody></tbody>
</table>
<h4 class="title">13.<a href="http://yoast.com/wordpress/optimize-db/">优化数据库</a></h4>
<p>MySQL是一个非常棒的数据库，但是他自身不会进行清理工作。该插件运行一个优化表的命令，有效的清楚了数据碎片。这是一个非常有用的数据表插件并且更新非常块。界面非常简单：仅有一个按钮：立刻优化（Optimize Now）。</p>
<p class="img"><img class="alignnone size-full wp-image-806" title="wordpress_speed_4" src="http://4ebstudio.com/wp-content/uploads/2009/03/wordpress_speed_4.jpg" alt="wordpress_speed_4" width="500" height="117" /></p>
<p class="img">
<p class="img">[<a href="http://www.noupe.com/wordpress/13-great-wordpress-speed-tips-tricks-for-max-performance.html">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/13-great-wordpress-speed-tips-tricks-for-max-performance.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>读者精选: 30款必用的mac网页设计软件</title>
		<link>http://www.4ebstudio.com/readers-pick-30-incredibly-useful-mac-apps-for-web-design.html</link>
		<comments>http://www.4ebstudio.com/readers-pick-30-incredibly-useful-mac-apps-for-web-design.html#comments</comments>
		<pubDate>Thu, 05 Feb 2009 09:21:27 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[苹果新知]]></category>
		<category><![CDATA[mac]]></category>
		<category><![CDATA[开发软件]]></category>
		<category><![CDATA[绘图软件]]></category>
		<category><![CDATA[网站工具]]></category>
		<category><![CDATA[设计软件]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=782</guid>
		<description><![CDATA[上周我们发表了一篇名为 “15款网页设计师必备的mac应用程序“的文章，我请我们的读者说说他们最喜欢的mac应用软件以及原因。
本文我们将列举读者们建议的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。
[原文链接]
]]></description>
			<content:encoded><![CDATA[<p>上周我们发表了一篇名为 “<a href="http://4ebstudio.com/15款网页设计师必用的mac应用程序.html">15款网页设计师必备的mac应用程序</a>“的文章，我请我们的读者说说他们最喜欢的mac应用软件以及原因。</p>
<p>本文我们将列举读者们建议的<strong style="font-weight: bold;">30款网页设计师和开发人员必备的mac应用程序</strong>，这些程序或能节省网页或程序开发的时间，或能帮助他们有效实施工作计划。</p>
<h3 style="font-size: 1.17em;">1. <a href="http://www.panic.com/transmit/">Transmit</a></h3>
<p><img style="border: 0px initial initial;" title="mac-apps17jpg" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps17jpg.jpeg" alt="mac-apps17jpg" width="500" height="215" /></p>
<p>功能丰富的FTP / SFTP / WebDAV客户端软件：获取iDisk, FTP, SFTP, 或者TLS/SSL上的文件。可以使用各种程序编辑远程文件，甚至是图形文件。具有拖拽功能和自动同步功能。</p>
<p><span id="more-782"></span></p>
<h3 style="font-size: 1.17em;">2. <a href="http://macromates.com/">TextMate</a></h3>
<p><a href="http://macromates.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps18jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>无论你是一名程序开发人员还是设计师，编写代码都是一件非常辛苦的事情，TextMate可以让你工作起来游刃有余，降低脑力负荷，并让常规的手写工作交由电脑来完成。TextMate被我们的读者评选为最有用的和极具扩展功能的文本编辑器，特别是使用Subversion的用户。<a href="http://www.456bereastreet.com/archive/200811/textmate_productivity_tips/">TextMate产品贴士</a>，是一篇非常有用的文章，提供了12个技巧帮助你更有效的使用TextMate。</p>
<h3 style="font-size: 1.17em;">3. <a href="http://anxietyapp.com/">Anxiety</a></h3>
<p><a href="http://anxietyapp.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps19jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Anxiety是Mac OS X Leopard下的一款轻量级的To-do工具，可以和iCal以及Mail同步。Anxiety提供了一个简介而紧凑的界面，可以添加和查看你的任务清单，并且可以以各种方式集合在桌面背景上。</p>
<h3 style="font-size: 1.17em;">4. <a href="http://www.barebones.com/products/bbedit/">BBEdit</a></h3>
<p><a href="http://www.barebones.com/products/bbedit/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps20jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>BBEdit是一款专业的Mac平台下的HTML及文本编辑工具，提供了对文本进行编辑，查找和管理的各种高性能。智能界面可以让你轻松使用BBEdit的各种特性，包括检索目标模式匹配，多文件查找替换（甚至是没有打开的文件以远程服务器上的文件），项目定义工具，功能导览以及针对不同代码语言的语法颜色标识，代码折叠，FTP和SFTP模式打开、保存文件，AppleScript，Mac OS X Unix脚本支持，文本和代码自动完成，当然还有一系列的HTML工具。</p>
<h3 style="font-size: 1.17em;">5. <a href="http://www.tumultco.com/HyperEdit/">HyperEdit</a></h3>
<p><a href="http://www.tumultco.com/HyperEdit/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps21jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Tumult HyperEdit 是一款轻量级的HTML编辑器，它提供了一个预览窗口来实时显示页面。HyperEdit打破了冗长乏味的代码书写模式：写html，保存，在浏览器中加载及预览。它实现了撰写，修改与预览的同步进行，加快了整个页面设计的进程。W3C验证会将错误的语法用红色的下划线标记出来。它内嵌了与Safari相同的渲染引擎，因此不仅符合标准而且速度还非常快。</p>
<h3 style="font-size: 1.17em;">6. <a href="http://versionsapp.com/">Versions</a></h3>
<p><a href="http://versionsapp.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps22jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Versions提供了在mac上用Subversion工作的一个非常好的方式。无论你是一个Subversion高手，还是新手，Versions都会帮你优化你的工作流程。</p>
<h3 style="font-size: 1.17em;">7. <a href="http://skitch.com/">Skitch</a></h3>
<p><a href="http://skitch.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps23jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>skitch不仅允许你快速创建并编辑截屏，而且还提供给你一个服务器空间和平台来储存这些图片方面你在skitch页面上进行浏览。skitch特性包括：网页快照，捕捉对话瞬间，应用程序截屏，iSight捕捉，快速建立想法草图，连接到iPhoto库。</p>
<h3 style="font-size: 1.17em;">8. <a href="http://www.obdev.at/products/launchbar/beta.html">LaunchBar</a></h3>
<p><a href="http://www.obdev.at/products/launchbar/beta.html"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps24jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>LaunchBar是一款获奖的工具软件，提供了快速接口进入你的应用程序，文件，联系人以及书签，iTunes资源库，以及搜索引擎等，所有这些仅需输入你要查找的项目名称的缩写即可。</p>
<h3 style="font-size: 1.17em;">9. <a href="http://docs.blacktree.com/quicksilver/what_is_quicksilver">Quicksilver</a></h3>
<p><a href="http://docs.blacktree.com/quicksilver/what_is_quicksilver"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps26jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>当打开Quicksilver的时候，它会创建一个经常使用的文件夹和文件的目录。激活它以后，你可以快速查找和打开目录中的任意一项。Quicksilver可以基于先前的经验来查找哪个项目是你正在查找的。他也支持缩写功能，因此你可以输入整个字符或者片段即可。</p>
<h3 style="font-size: 1.17em;">10. <a href="http://www.realmacsoftware.com/littlesnapper/">Littlesnapper</a></h3>
<p><a href="http://www.realmacsoftware.com/littlesnapper/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps25jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>LittleSnapper是一款截屏和网页快照应用程序。特性包括：完整页面捕捉，元素捕捉（意味着你将不再需要使用十字线），突出显示指定区域，内建文本标注，与客户共享快照等。</p>
<h3 style="font-size: 1.17em;">11. <a href="http://www.aptana.com/">Aptana</a></h3>
<p><a href="http://www.aptana.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps27jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Aptana Studio是一款完整的网页开发环境，整合了一系列强大的写作工具以及协作服务帮助你和你的团队实现轻松的工作。创建，调试，测试以及配置可扩展的PHP解决方案。支持jQuery, prototype, dojo, YUI, ExtJS, MooTools及其他 Ajax库。停放和扩展你的PHP及Jaxer 应用，使用Aptana RadRails快速开发Ruby及Rails应用。使用你的Ajax和JavaScript技巧创建服务器端应用等。</p>
<h3 style="font-size: 1.17em;">12. <a href="http://binarynights.com/">ForkLift</a></h3>
<p><a href="http://binarynights.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps28jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>强大而快速的FTP应用程序。</p>
<h3 style="font-size: 1.17em;">13. <a href="http://journler.com/">journler</a></h3>
<p><a href="http://journler.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps29jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Journler是一款日记及信息记录软件。与iLife整合，语音和视频接口，文件导入和即时搜索与过滤，不仅集成Mail, iWeb以及Address Book，而且还支持博客，AppleScript以及Spotlight 。</p>
<h3 style="font-size: 1.17em;">14. <a href="http://evernote.com/">Evernote</a></h3>
<p><a href="http://evernote.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps30jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Evernote允许你在任何环境下使用任何工具或平台来捕获信息，并且在任何时候任何地点均可查看这些信息。</p>
<h3 style="font-size: 1.17em;">15. <a href="http://www.mediaatelier.com/TimeLog4/">TimeLog</a></h3>
<p><a href="http://www.mediaatelier.com/TimeLog4/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps31jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>跟踪项目时间，界面类似iTunes™，任何一个Mac使用者都会对TimeLog感觉非常熟悉。TimeLog可以跟踪你正在使用的软件，并且显示时间线。这对于跟踪你的工作非常容易，甚至是你忘记了开始的时间。</p>
<h3 style="font-size: 1.17em;">16. <a href="http://purgatorydesign.com/Intaglio/">Intaglio</a></h3>
<p><a href="http://purgatorydesign.com/Intaglio/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps32jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Intaglio是Macintosh下的一款传统的绘画绘图软件。仿照原始的Macintosh绘图工具，Intaglio更倾向于初级使用者以及传统的Macintosh使用者。Intaglio创建2D图形，文字，颜色和适用于Mac OS X的脚本来提供作为一款廉价的绘图软件创建出的前所未有的力量和灵活性。Intaglio并不适用于Mac OS X，它起初的目的就是为了探索该平台为绘图工作实现理想化的能力。</p>
<h3 style="font-size: 1.17em;">17. <a href="http://www.mcubedsw.com/software/codecollectorpro">Code Collector Pro</a></h3>
<p><a href="http://www.mcubedsw.com/software/codecollectorpro"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps33jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Code Collector Pro提供了组织，实用以及共享代码 片段的最好解决方案。</p>
<h3 style="font-size: 1.17em;">18. <a href="http://www.realmacsoftware.com/rapidweaver/">Rapidweaver</a></h3>
<p><a href="http://www.mcubedsw.com/software/codecollectorpro"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps34jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>RapidWeaver是Mac OS X下的一款强大的网页设计应用程序。它基于标准的代码，并且能发不到任何ftp服务器上或是.Mac及MobileMe。</p>
<h3 style="font-size: 1.17em;">19. <a href="http://derailer.org/paparazzi/">Paparazzi</a></h3>
<p>Paparazzi是一款小型的Mac OS X工具用来制作网页快照。</p>
<h3 style="font-size: 1.17em;">20. <a href="http://growl.info/">Growl</a></h3>
<p><a href="http://growl.info/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps36jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Growl是Mac上的一款通知系统。它提供你正在使用的软件的一些提示信息，而无需进行程序切换。</p>
<h3 style="font-size: 1.17em;">21. <a href="http://filezilla-project.org/">Filezilla</a></h3>
<p><a href="http://filezilla-project.org/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps37jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>另一款免费的FTP应用程序。</p>
<h3 style="font-size: 1.17em;">22. <a href="http://www.mamp.info/en/mamp.html">Mamp</a></h3>
<p><a href="http://www.mamp.info/en/mamp.html"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps38jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>MAMP可以在你的Mac OS X电脑上安装一个服务器环境。只需点几下鼠标，你就可以为Mac OS X安装Apache, PHP以及MySQL。</p>
<h3 style="font-size: 1.17em;">23. <a href="http://www.billingsapp.com/index.html">Billings</a></h3>
<p><a href="http://www.billingsapp.com/index.html"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps39jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Billings可以在任何地方生成专业模式的发票，并且它还内建了30款模板供选择。</p>
<h3 style="font-size: 1.17em;">24. <a href="http://www.colorschemer.com/osx_info.php">ColorSchemer</a></h3>
<p><a href="http://www.colorschemer.com/osx_info.php"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps40jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>ColorSchemer是一款针对爱好者或者高级人士的专业配色程序。通过使用一个动态视觉色轮，可以即可观察各匹配颜色之间的关系，甚至可以让ColorSchemer智能提供给你一些配色建议。</p>
<h3 style="font-size: 1.17em;">25. <a href="http://www.expandrive.com/expandrive">ExpanDrive</a></h3>
<p><a href="http://www.expandrive.com/expandrive"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps41jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>ExpanDrive提供给你完全透明的打开，编辑，保存你的喜爱程序的方式，甚至是这些文件存在于世界各地的服务器上。透明的意思是说你甚至都不会感觉到你是在操作一个远程服务器上的文件，它就像是在你的电脑上直接使用USB驱动一样。</p>
<h3 style="font-size: 1.17em;">26. <a href="http://www.xheadsoftware.com/info_xhead.asp">info.xhead</a></h3>
<p><a href="http://www.xheadsoftware.com/info_xhead.asp"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps42jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>你的生活中总是会存在一些你不想忘掉的信息。不论它是密码，帐号，愿望列表或是让你挣脱乏味工作的百万美元想法，info.xhead 可以储存所有的这一切，并且将他们归类放置。</p>
<h3 style="font-size: 1.17em;">27. <a href="http://www.tweakersoft.com/vectordesigner/">Vector Designer</a></h3>
<p><a href="http://www.tweakersoft.com/vectordesigner/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps43jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>VectorDesigner是一款使用简单，直观并且功能强大的适量绘图软件。它可以让你创造出各种极具想象力的适量图，如海报，手册，招贴画，logo，网页图形，t-shirt等等。它有丰富的工具和智能图形：轻松创建矩形，椭圆，多边形，五角星，贝尔曲线，甚至还可以将位图转化成矢量图形。</p>
<h3 style="font-size: 1.17em;">28. <a href="http://www.nathanatos.com/software/">Cuppa</a></h3>
<p><a href="http://www.nathanatos.com/software/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps44jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Cuppa是Mac OS X上一款小巧的饮茶时间工具，它会告诉你什么时候你的茶可以喝了。</p>
<h3 style="font-size: 1.17em;">29. <a href="http://www.barbariangroup.com/software/plainview_app_1_0">PlainView</a></h3>
<p><a href="http://www.barbariangroup.com/software/plainview_app_1_0"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps45jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Plainview是一款全屏幕的浏览器。</p>
<h3 style="font-size: 1.17em;">30. <a href="http://silverbackapp.com/">Silverback</a></h3>
<p><a href="http://silverbackapp.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps46jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Silverback是一款为设计师和开发人员设计的并不抢眼的实用测试工具。它可以捕捉屏幕动作，录制参与者的动作、声音，轻而易举的添加段落标记，用遥控器控制录制，导出到Quicktime。</p>
<p>[<a href="http://www.noupe.com/tools/readers-pick-30-incredibly-useful-mac-apps-for-web-design.html">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/readers-pick-30-incredibly-useful-mac-apps-for-web-design.html/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>15款网页设计师必用的mac应用程序</title>
		<link>http://www.4ebstudio.com/15-incredible-mac-apps-for-freelance-web-designers.html</link>
		<comments>http://www.4ebstudio.com/15-incredible-mac-apps-for-freelance-web-designers.html#comments</comments>
		<pubDate>Thu, 29 Jan 2009 09:19:43 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[苹果新知]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=778</guid>
		<description><![CDATA[1. Espresso

Espresso是由CSSEdit 的开发人员开发的一款非常强大的网页工具。提供了强大的编辑，项目管理，实时预览，实时发布及同步功能。Espresso具有一个无比强大的基于规则的语法引擎CoreSyntax，它可以将你的文本文件转化成语义结构。Espresso还具有一个可扩展的，可以和CSSEdit样式表单列表相媲美的导引。

2. CSSEdit

CSSEdit是专注于样式表单的一款工具，它提供了相当广泛的特性。选择器构建，高级视觉编辑器，实时预览，智能源码环境以及一个强大的X-Ray网页侦测器进行CSS调试。
3. Pixelmator

Pixelmator，Mac OS X上的一款设计漂亮，易于上手，快速且功能强大的图像编辑器，可以让你创建，编辑，增强你的图片效果。Pixelmator 是一款基于图层结构的图像编辑器，你可以从你的照片，其他图像，所选图形甚至是iSigh快速创建图形。 Pixelmator 可以直接从你的Mac上的小照相机添加层到你的作品上。通过Pixelmator强大，像素精确化收集的选择工具，你可以快速而轻松的选择你图像上的任一部位进行编辑及应用特殊效果来增强你的图片效果。
4. Coda

Panic Coda是一款伟大的一体化网页开发环境工具，在不同的标签上显示你经常使用的工具。这些工具包括：文本编辑器，CSS编辑器，文件传输，svn，终端和智能拼写检查。支持常见的语言，包括：CSS, HTML, Javascript, Java, Perl, PHP, Python, Ruby, SQL, XML, 以及纯文本。
5. Lineform

Lineform是一款理想的矢量艺术，图表以及插图工具。Lineform具有所有的最流行的工具，包括从手画多边形到合成特效等任何功能，可以让你不必实用多余的功能就能创建你想要的设计。
6. Fontcase

Fontcase是一款字体管理软件，提供了一个简洁而且功能强大的工具流程来帮助你管理安装在系统中的字体。类似iTunes的界面风格，Fontcase 具有一个强大的标记系统，用来让你像控制你的音乐一样来控制你的字体。
7. Deep- Image Search

Deep通过分析像素和计算最流行的颜色来计算你的图像中所使用的色彩范围。这就是Deep中的调色板的强大之处，你可以查找具有相同色彩的图像，特别是当你正在寻找最适合你网页的图像的时候尤其有用。事实上，你只要把任何图像拽到Deep中，它就会查找并排列你电脑中所有类似的图像。
8. Cyberduck

Cyberduck是为Mac设计的一款开源的FTP, SFTP, WebDAV, Mosso Cloud Files以及Amazon S3浏览器工具。它具有一个使用简单的，可以通过标签进行链接的界面。
9. Flow

Flow是另一款开始流行的文件传输软件。Flow可以将Mac上最好的传输到你的服务器文件和文件夹。简而言之，Flow可以让你像在本地工作一样进行远程工作。使用Flow，你可以直接在你的服务器上编辑文件，连接到FTP, SFTP, Amazon S3, WebDAV, 以及MobileMe iDisk服务器，无须用户接口和其他功能即可快速上传。
10. Sequel Pro

Sequel Pro是一款Mac OS X上的MySQL数据库管理软件。Sequel Pro可以让你在本地或远程直接进入你的MySQL数据库，支持各种流行格式包括SQL, CSV及 XML等的数据导入与导出。
11. Things

任务管理从来没有如此简单过。通过Responsibility中的Projects和Areas菜单管理你的 To-do项。特性包括：智能今日事件列表，可以自动收集所有你今天需要注意的事件；重复事件；任何条目均可轻松的通过日期进行存放；iPhone 同步及其他许多功能。
12. xscope

xScope是一款功能强大的套装工具，旨在测量，校准以及检测屏幕上的图形和布局。通过Mac OS X的菜单栏快速选择，xScope的灵活工具可以在桌面窗口以及UI元素上浮动，从而使测量工作轻而易举。
13. KeyCue

KeyCue让你实时预览任何应用程序的所有功能，并且可以让你通过使用菜单快捷方式更有有效的自动开始工作。
14. TextExpander

TextExpander通过对你经常使用的字符串、代码片段以及图像设置自定义的缩写来节省你无数的键盘敲击次数。
15. OnTheJob

On The Job拥有许多强大的功能但是最具声望的就是它是Mac OS X最简单的时间和花费跟踪解决方案。On The Job提供了灵活的发票创建功能。为特殊的时间范围，单一工作或生成多项工作创建发票。
其他你可能感兴趣的Mac应用程序
- TextMate
- Billings
- Littlesnapper
- MAMP
- Inkscape
- Picturesque
- Layers
[原文链接]
]]></description>
			<content:encoded><![CDATA[<h3 style="font-size: 1.17em;">1. <a href="http://macrabbit.com/espresso/">Espresso</a></h3>
<p><a href="http://macrabbit.com/espresso/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps1jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Espresso是由<a href="http://macrabbit.com/cssedit/">CSSEdit</a> 的开发人员开发的一款非常强大的网页工具。提供了强大的编辑，项目管理，实时预览，实时发布及同步功能。Espresso具有一个无比强大的基于规则的语法引擎CoreSyntax，它可以将你的文本文件转化成语义结构。Espresso还具有一个可扩展的，可以和<a href="http://macrabbit.com/cssedit/">CSSEdit</a>样式表单列表相媲美的导引。</p>
<p><span id="more-778"></span></p>
<p><strong style="font-weight: bold;">2. <a href="http://macrabbit.com/cssedit/">CSSEdit</a></strong></p>
<p><a href="http://macrabbit.com/cssedit/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps2jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>CSSEdit是专注于样式表单的一款工具，它提供了相当广泛的特性。选择器构建，高级视觉编辑器，实时预览，智能源码环境以及一个强大的X-Ray网页侦测器进行CSS调试。</p>
<h3 style="font-size: 1.17em;">3. <a href="http://www.pixelmator.com/">Pixelmator</a></h3>
<p><a href="http://www.pixelmator.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps3jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Pixelmator，Mac OS X上的一款设计漂亮，易于上手，快速且功能强大的图像编辑器，可以让你创建，编辑，增强你的图片效果。Pixelmator 是一款基于图层结构的图像编辑器，你可以从你的照片，其他图像，所选图形甚至是iSigh快速创建图形。 Pixelmator 可以直接从你的Mac上的小照相机添加层到你的作品上。通过Pixelmator强大，像素精确化收集的选择工具，你可以快速而轻松的选择你图像上的任一部位进行编辑及应用特殊效果来增强你的图片效果。</p>
<h3 style="font-size: 1.17em;">4. <a href="http://www.panic.com/coda/">Coda</a></h3>
<p><a href="http://www.panic.com/coda/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps4jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Panic Coda是一款伟大的一体化网页开发环境工具，在不同的标签上显示你经常使用的工具。这些工具包括：文本编辑器，CSS编辑器，文件传输，svn，终端和智能拼写检查。支持常见的语言，包括：CSS, HTML, Javascript, Java, Perl, PHP, Python, Ruby, SQL, XML, 以及纯文本。</p>
<h3 style="font-size: 1.17em;">5. <a href="http://www.freeverse.com/apps/app/?id=6020">Lineform</a></h3>
<p><a href="http://www.freeverse.com/apps/app/?id=6020"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps5jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Lineform是一款理想的矢量艺术，图表以及插图工具。Lineform具有所有的最流行的工具，包括从手画多边形到合成特效等任何功能，可以让你不必实用多余的功能就能创建你想要的设计。</p>
<h3 style="font-size: 1.17em;">6. <a href="http://www.bohemiancoding.com/?Fontcase">Fontcase</a></h3>
<p><a href="http://www.bohemiancoding.com/?Fontcase"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps6jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Fontcase是一款字体管理软件，提供了一个简洁而且功能强大的工具流程来帮助你管理安装在系统中的字体。类似iTunes的界面风格，Fontcase 具有一个强大的标记系统，用来让你像控制你的音乐一样来控制你的字体。</p>
<h3 style="font-size: 1.17em;">7. <a href="http://www.ironicsoftware.com/deep/index.html">Deep- Image Search</a></h3>
<p><a href="http://www.ironicsoftware.com/deep/index.html"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps7jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Deep通过分析像素和计算最流行的颜色来计算你的图像中所使用的色彩范围。这就是Deep中的调色板的强大之处，你可以查找具有相同色彩的图像，特别是当你正在寻找最适合你网页的图像的时候尤其有用。事实上，你只要把任何图像拽到Deep中，它就会查找并排列你电脑中所有类似的图像。</p>
<h3 style="font-size: 1.17em;">8. <a href="http://cyberduck.ch/">Cyberduck</a></h3>
<p><a href="http://cyberduck.ch/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps8jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Cyberduck是为Mac设计的一款开源的FTP, SFTP, WebDAV, Mosso Cloud Files以及Amazon S3浏览器工具。它具有一个使用简单的，可以通过标签进行链接的界面。</p>
<h3 style="font-size: 1.17em;">9. <a href="http://extendmac.com/flow/index.php">Flow</a></h3>
<p><a href="http://extendmac.com/flow/index.php"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps9jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Flow是另一款开始流行的文件传输软件。Flow可以将Mac上最好的传输到你的服务器文件和文件夹。简而言之，Flow可以让你像在本地工作一样进行远程工作。使用Flow，你可以直接在你的服务器上编辑文件，连接到FTP, SFTP, Amazon S3, WebDAV, 以及MobileMe iDisk服务器，无须用户接口和其他功能即可快速上传。</p>
<h3 style="font-size: 1.17em;">10. <a href="http://www.sequelpro.com/">Sequel Pro</a></h3>
<p><a href="http://www.sequelpro.com/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps10jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>Sequel Pro是一款Mac OS X上的MySQL数据库管理软件。Sequel Pro可以让你在本地或远程直接进入你的MySQL数据库，支持各种流行格式包括SQL, CSV及 XML等的数据导入与导出。</p>
<h3 style="font-size: 1.17em;">11. <a href="http://www.culturedcode.com/things/">Things</a></h3>
<p><a href="http://www.culturedcode.com/things/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps11jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>任务管理从来没有如此简单过。通过Responsibility中的Projects和Areas菜单管理你的 To-do项。特性包括：智能今日事件列表，可以自动收集所有你今天需要注意的事件；重复事件；任何条目均可轻松的通过日期进行存放；iPhone 同步及其他许多功能。</p>
<h3 style="font-size: 1.17em;">12. <a href="http://iconfactory.com/software/xscope">xscope</a></h3>
<p><a href="http://iconfactory.com/software/xscope"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps12jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>xScope是一款功能强大的套装工具，旨在测量，校准以及检测屏幕上的图形和布局。通过Mac OS X的菜单栏快速选择，xScope的灵活工具可以在桌面窗口以及UI元素上浮动，从而使测量工作轻而易举。</p>
<h3 style="font-size: 1.17em;">13. <a href="http://www.ergonis.com/products/keycue/">KeyCue</a></h3>
<p><a href="http://www.ergonis.com/products/keycue/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps13jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>KeyCue让你实时预览任何应用程序的所有功能，并且可以让你通过使用菜单快捷方式更有有效的自动开始工作。</p>
<h3 style="font-size: 1.17em;">14. <a href="http://www.smileonmymac.com/TextExpander/">TextExpander</a></h3>
<p><a href="http://www.smileonmymac.com/TextExpander/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps14jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>TextExpander通过对你经常使用的字符串、代码片段以及图像设置自定义的缩写来节省你无数的键盘敲击次数。</p>
<h3 style="font-size: 1.17em;">15. <a href="http://stuntsoftware.com/OnTheJob/">OnTheJob</a></h3>
<p><a href="http://stuntsoftware.com/OnTheJob/"><img style="border: 0px initial initial;" src="http://4ebstudio.com/wp-content/uploads/2009/02/mac-apps15jpg.jpeg" alt="Mac Apps For Web &amp; Graphic Designers" /></a></p>
<p>On The Job拥有许多强大的功能但是最具声望的就是它是Mac OS X最简单的时间和花费跟踪解决方案。On The Job提供了灵活的发票创建功能。为特殊的时间范围，单一工作或生成多项工作创建发票。</p>
<h3 style="font-size: 1.17em;">其他你可能感兴趣的Mac应用程序</h3>
<h5 style="font-size: 0.83em;">- <a href="http://macromates.com/">TextMate</a></h5>
<h5 style="font-size: 0.83em;">- <a href="http://www.billingsapp.com/index.html">Billings</a></h5>
<h5 style="font-size: 0.83em;">- <a href="http://www.realmacsoftware.com/littlesnapper/">Littlesnapper</a></h5>
<h5 style="font-size: 0.83em;">- <a href="http://www.mamp.info/en/mamp.html">MAMP</a></h5>
<h5 style="font-size: 0.83em;">- <a href="http://www.inkscape.org/">Inkscape</a></h5>
<h5 style="font-size: 0.83em;">- <a href="http://www.acqualia.com/picturesque/">Picturesque</a></h5>
<h5 style="font-size: 0.83em;">- <a href="http://layersapp.com/">Layers</a></h5>
<p>[<a href="http://www.noupe.com/tools/15-incredible-mac-apps-for-freelance-web-designers.html">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/15-incredible-mac-apps-for-freelance-web-designers.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>15个网站加速，代码优化的技巧</title>
		<link>http://www.4ebstudio.com/15-tips-to-speed-up-your-website-and-optimize-your-code.html</link>
		<comments>http://www.4ebstudio.com/15-tips-to-speed-up-your-website-and-optimize-your-code.html#comments</comments>
		<pubDate>Tue, 27 Jan 2009 05:50:12 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[Javascript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[网站工具]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=78</guid>
		<description><![CDATA[将图片压缩到最小

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

学会擅用Snippets

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

你或许下载了一个jQuery库，并且在试图掌握它的语法结构。同样，你可能遇到了一些困难并且意识到你无法确认变量的对应值。没关系，你可以这样做：
键入命令：
console.log($someVariable);
现在，打开Firefox（请确认你已安装了FireBug），然后点击F12。你将会看到你正在查找的变量所对应的值。
下载网页开发工具

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

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

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

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





大多数现代浏览器在同一台服务器上最多同时加载两个内容。但是，当你加载脚本文件的时候，其他的都不会被同时加载。因此，只要情况允许的话，最好将你的脚本文件移动到文件最底端，以便让服务器先加载其他内容（如图片，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函数会接受第二个参数 &#8211; &#8220;context&#8221;。请往下看：
var myElement = $('#someElement');



该代码将命令jQuery越过整个dom。我们可以通过使用context作为第二个参数来加速网站。
var myElement = $('#someElement', $('.someContainer'));



现在我们将告诉jQuery仅搜索.someContainer 内的元素，并且或略所有该元素以外的东西。
使用ID代替Class
当用jQuery访问ID的时候，通常会使用传统的&#8221;getElementById&#8221;方式。但是，当访问class元素的时候，jQuery必须使用他自己的方式跨越整个dom，结果这样会花费更长的时间。
产看所有25个技巧!
尽可能使用$_GET代替 $_POST

如果在编写Ajax命令的时候，你可以在$_GET 或者$_POST之间选择的话，那么请选择前者。
&#8221; Yahoo! Mail团队发现，当使用XMLHttp请求的时候，POST在浏览器中会通过两个步骤实现：首先发送header，然后再发送数据。因此最好使用GET，它仅使用一个TCP数据分组（除非你有非常多的cookies）。&#8221; &#8211; Developer.Yahoo.com
请记住：不要轻率的使用$_GET。请先弄清楚你第一步要作什么。
适时使用Library和Framework

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

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

但是，如果我正在建设一个负责的网站，需要一个完整的CMS系统和复杂的数据访问，那么我将会使用一些我常用的架构。
请记住：架构仅仅是在需要的时候才会为你服务，否则请慎用。
YSlow

YSlow是一款非常棒的工具可以帮助你检查网站的有效性。
这里有一个很好的 YSlow视频教程 来讲述该款工具的实用性。我强烈推荐你有机会看一看。

学会使用键盘快捷键

大多数有经验的设计师/开发人员都会同意我的观点，如果我要实现网站或者设计的一个变化我都要去工具栏里面寻找相应的菜单，那会浪费我很多时间。我已经使用快捷键很长时间了，以至于我根本不知道这些命令的正确菜单位置。我就知道&#8221;Shift + [...]]]></description>
			<content:encoded><![CDATA[<h3 style="font-size: 1.17em;">将图片压缩到最小</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/smushIT.png" alt="compress images" /></div>
<p>当我们使用photoshop“存储成网页格式”的选项时，我们可以将图片文件压缩的小一些。但是，你是否知道这些图片大小可以被压缩的更多而不降低图片质量呢？有个名叫<a href="http://www.smush.it/">Smush.It</a> 的网站可以帮助你实现这一点。</p>
<p><span id="more-78"></span></p>
<h3 style="font-size: 1.17em;">学会擅用Snippets</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/dreamweaverSnippets.png" alt="snippets" /></div>
<p>许多的IDE是都提供&#8221;code snippet&#8221; 控制面板允许你存储一些代码以备后用。你是否发现自己经常会去lipsum.com获取一些常用本文呢？那为什么不试试使用snippet？在Dreamweaver中，按下&#8221;Shift+F9&#8243;键即可打开snippet标签。你可以将需要的snippet托拽到任何你需要的地方。这个方法将节省你的大量时间。</p>
<h3 style="font-size: 1.17em;">利用Console.log()进行调试</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/consoleLog.png" alt="console.log" /></div>
<p>你或许下载了一个jQuery库，并且在试图掌握它的语法结构。同样，你可能遇到了一些困难并且意识到你无法确认变量的对应值。没关系，你可以这样做：</p>
<p>键入命令：</p>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="javascript">console.log($someVariable);</pre>
<p>现在，打开Firefox（请确认你已安装了<a href="https://addons.mozilla.org/firefox/addon/1843">FireBug</a>），然后点击F12。你将会看到你正在查找的变量所对应的值。</p>
<h3 style="font-size: 1.17em;">下载网页开发工具</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/webdevelopertollbar.png" alt="web developer toolbar" /></div>
<p>这是一款由<a href="http://chrispederick.com/">Chris Pederick</a> 开发的，非常实用的Firefox扩展插件，具有很多选项。或许你们大多数看过我视频教程的人都会发现我非常喜欢使用&#8221;Edit CSS&#8221; 这个选项来实时调整我的样式表。该工具的其他功能包括：</p>
<ul>
<li>轻松禁用Javascript</li>
<li>轻松禁用CSS</li>
<li>快速HTML/CSS验证链接</li>
<li>标尺</li>
<li>禁用cookies</li>
<li>还有其他一系列很多伟大的功能</li>
</ul>
<p><a href="https://addons.mozilla.org/firefox/addon/60">Web Developer Toolbar</a></p>
<h3 style="font-size: 1.17em;">将Script标签放置到页面最底端</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/scriptTagsBottom.png" alt="snippets" /></div>
<p>我们似乎很少这样做。虽然它并非总是适宜，但是你的确可以通过把script标签放到&lt;body&gt;标签后来提高网站速度很多倍。</p>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="html4strict">....</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="html4strict"><script src="someScript.js" type="text/javascript"><!--mce:0--></script></pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="html4strict"><script src="anotherScript.js" type="text/javascript"><!--mce:1--></script></pre>
<table style="cursor: default; border: 1px dashed #bbbbbb;" border="0">
<tbody></tbody>
</table>
<h4 style="font-size: 1em;"><span style="font-weight: normal;">大多数现代浏览器在同一台服务器上最多同时加载两个内容。但是，当你加载脚本文件的时候，其他的都不会被同时加载。因此，只要情况允许的话，最好将你的脚本文件移动到文件最底端，以便让服务器先加载其他内容（如图片，css等）。</span></h4>
<h3 style="font-size: 1.17em;">压缩CSS和Javascript文件</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/javascriptCompress.png" alt="compress files" /></div>
<p>如果网站的性能最你来说最重要的话，我强烈建议你考虑在展开之前压缩CSS和Javascript文件。在开发之前不要嫌它麻烦，这会对你非常有帮助的。</p>
<h4 style="font-size: 1em;">Javascript压缩服务</h4>
<ul>
<li><a href="http://javascriptcompressor.com/">Javascript Compressor</a></li>
<li><a href="http://www.xmlforasp.net/JSCompressor.aspx">JS Compressor</a></li>
</ul>
<h4 style="font-size: 1em;">CSS压缩服务</h4>
<ul>
<li><a href="http://www.cssoptimiser.com/">CSS Optimiser</a></li>
<li><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Compressor</a></li>
<li><a href="http://www.cleancss.com/">Clean CSS</a></li>
</ul>
<p>另外两个有用的JavaScript压缩工具是 <a href="http://developer.yahoo.com/yui/compressor/">YUI Compressor</a>, 和 <a href="http://crockford.com/javascript/jsmin">JSMin</a>.</p>
<h3 style="font-size: 1.17em;">jQuery贴士集</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/jQuery.png" alt="jQuery Tips" /></div>
<p>不久前，<a href="http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx">tvidesign.co.uk</a>的Jon Hobbs-Smith发表了一篇非常棒的文章详述了jQuery的25个实用技巧。请确保将该页面收藏了。这里列举了我非常喜欢用的一些技巧。</p>
<h4 style="font-size: 1em;">检查元素是否已经存在？</h4>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="javascript">if ($(’#myDiv).length) {</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="javascript">// this code will only run if the div with an id of #myDiv exists.</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="javascript">}</pre>
<table style="cursor: default; border: 1px dashed #bbbbbb;" border="0">
<tbody></tbody>
</table>
<h4 style="font-size: 1em;">使用Context</h4>
<p>很多人都没有意识到这一点，当访问dom元素的时候，jQuery函数会接受第二个参数 &#8211; &#8220;context&#8221;。请往下看：</p>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="javascript">var myElement = $('#someElement');</pre>
<table style="cursor: default; border: 1px dashed #bbbbbb;" border="0">
<tbody></tbody>
</table>
<p>该代码将命令jQuery越过整个dom。我们可以通过使用context作为第二个参数来加速网站。</p>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="javascript">var myElement = $('#someElement', $('.someContainer'));</pre>
<table style="cursor: default; border: 1px dashed #bbbbbb;" border="0">
<tbody></tbody>
</table>
<p>现在我们将告诉jQuery仅搜索.someContainer 内的元素，并且或略所有该元素以外的东西。</p>
<h4 style="font-size: 1em;">使用ID代替Class</h4>
<p>当用jQuery访问ID的时候，通常会使用传统的&#8221;getElementById&#8221;方式。但是，当访问class元素的时候，jQuery必须使用他自己的方式跨越整个dom，结果这样会花费更长的时间。</p>
<p><a href="http://www.tvidesign.co.uk/blog/improve-your-jquery-25-excellent-tips.aspx">产看所有25个技巧!</a></p>
<h3 style="font-size: 1.17em;">尽可能使用$_GET代替 $_POST</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/querystrings.png" alt="querystrings" /></div>
<p>如果在编写Ajax命令的时候，你可以在$_GET 或者$_POST之间选择的话，那么请选择前者。</p>
<blockquote><p>&#8221; Yahoo! Mail团队发现，当使用XMLHttp请求的时候，POST在浏览器中会通过两个步骤实现：首先发送header，然后再发送数据。因此最好使用GET，它仅使用一个TCP数据分组（除非你有非常多的cookies）。&#8221; &#8211; Developer.Yahoo.com</p></blockquote>
<p>请记住：不要轻率的使用$_GET。请先弄清楚你第一步要作什么。</p>
<h3 style="font-size: 1.17em;">适时使用Library和Framework</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/frameworks.png" alt="use frameworks" /></div>
<p>无论你使用PHP, ASP.NET, Mootools, jQuery，或他们中的多种，请考虑适时的使用架构。</p>
<p>例如:</p>
<ul>
<li>如果我要在网站上运行一个简单的静态页面，仅需要一个小的Javascript来实现翻转效果，那么使用jQuery的话就不太合适了。</li>
<li>如果我的静态网站的大多数特性被放在一个XML文件中，我就不需要使用架构。否则，我将会网站额外的带宽付出许多费用。</li>
</ul>
<p>但是，如果我正在建设一个负责的网站，需要一个完整的CMS系统和复杂的数据访问，那么我将会使用一些我常用的架构。</p>
<p>请记住：架构仅仅是在需要的时候才会为你服务，否则请慎用。</p>
<h3 style="font-size: 1.17em;">YSlow</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/ySlowWebsite.png" alt="ySlow" /></div>
<p>YSlow是一款非常棒的工具可以帮助你检查网站的有效性。</p>
<p>这里有一个很好的 <a href="http://developer.yahoo.net/blog/archives/2007/08/yslow-podcast-screencast.html">YSlow视频教程</a> 来讲述该款工具的实用性。我强烈推荐你有机会看一看。</p>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/yslowDebug.png" alt="ySlow" /></div>
<h3 style="font-size: 1.17em;">学会使用键盘快捷键</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/keyboard.jpg" alt="template" /></div>
<p>大多数有经验的设计师/开发人员都会同意我的观点，如果我要实现网站或者设计的一个变化我都要去工具栏里面寻找相应的菜单，那会浪费我很多时间。我已经使用快捷键很长时间了，以至于我根本不知道这些命令的正确菜单位置。我就知道&#8221;Shift + X&#8221; 可以打开我需要的面板。</p>
<p>我建议你可以在Google中搜索 &#8220;X 快捷键&#8221;（X代表软件的名字，比如Photoshop）。打印这些表单放在你垂手可得的地方。在接下来的几个星期中，试着尽可能用鼠标进行操作，渐渐地你就会养成习惯了。</p>
<h3 style="font-size: 1.17em;">建立一个 &#8220;New Website&#8221;模板</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/template.png" alt="template" /></div>
<p>让我们来看看如何建立一个网站模板。并非所有的网站都需要大型而复杂的应用。有时候，我们仅仅需要一个可以展示我们简历的网站。这时，我们为何不建立一个简单的“模板”来包含你需要的任何东西呢？</p>
<p>在我的模板文件夹里面，我建立了名为&#8221;JS&#8221;和&#8221;CSS&#8221;的二级文件夹。</p>
<ul>
<li>前者包含了我的<a href="http://nettuts.com/videos/screencasts/5-easy-ways-to-tackle-ie6s-transparency-issues/">&#8220;DD_belatedPNG.js&#8221;</a> 文件 (支持IE6 PNG背景透明)。</li>
<li>后者包含了一个空白的&#8221;default.css&#8221; 文件以及我自己的自定义reset文件。</li>
</ul>
<p>除此之外，我还有一个 &#8220;index.html(php)&#8221; 文件包含了一些我常用的代码片段。这些并没有什么特别之处，不过会节约我不少时间。</p>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="html4strict"><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"><!--mce:2--></script></pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="html4strict"><script type="text/javascript"><!--mce:3--></script></pre>
<table style="cursor: default; border: 1px dashed #bbbbbb;" border="0">
<tbody></tbody>
</table>
<p>正如你所看到的，我引用了我自己的CSS 和Javascript文件,链接了Google上的 jQuery文件，创建了document.ready() jQuery函数，并且打开了一个标准的&#8221;container&#8221; div。</p>
<p>这看上去非常简单，但却节省了不少时间。</p>
<h3 style="font-size: 1.17em;">内联Vs.外联</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/inline.jpg" alt="inline and external" /></div>
<p>总的来说，你的所有CSS和Javascript文件应该从页面上移走放入其各自的外部文件中。</p>
<h4 style="font-size: 1em;">为什么这么做?</h4>
<ul>
<li>清理代码</li>
<li>简报和内容分开很重要</li>
<li>使用外部文件，数据会被缓存以备后用。这将降低HTML文件大小而不会导致多余的HTTP请求。</li>
</ul>
<p>如果你仅有几句简单的样式结构，还是可以有例外的。把他们放在HTML页面内或许还是有益的，但仅限此种情况而已。</p>
<h3 style="font-size: 1.17em;">使用PHP判定Javascript调本是否被调用</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/requestedWith.png" alt="inline and external" /></div>
<p>AJAX几乎应用到了现在所有的领域，多数是因为他的用户友好性，这些都要归功于Javascript 库。在有些情况下，你需要考虑是否需要使用Javascrip来调用你的脚本。这需要几天的时间来完成这项任务。</p>
<p>其中一个方法就是当发送POST命令的时候使用Javascript附加上一对独特的键值。然后你可以使用PHP来决定某个特殊的值是否存在。如果存在的话，我们就会知道Javascript被调用了。</p>
<p>一个最好的构建方式就是使用PHP的特性&#8221;HTTP_X_REQUESTED_WITH&#8221;。</p>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="php">if isset($_SERVER['HTTP_X_REQUESTED_WITH']) {</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="php">// write some code and rest assured that the Javascript is enabled.</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="php">} else {</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="php">// Do something different to compensate for users that have JS turned off.</pre>
<pre style="font: normal normal normal 12px/18px Consolas, Monaco, 'Courier New', Courier, monospace;" lang="php">}</pre>
<table style="cursor: default; border: 1px dashed #bbbbbb;" border="0">
<tbody></tbody>
</table>
<h3 style="font-size: 1.17em;">连接到Google的CDN</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/linkToGoogle.png" alt="link to google" /></div>
<p>不久前，Google主机开始存放一些流行的脚本库如jQuery等。如果你正在使用类似的库，我强烈建议你将它们链接到Google的CDN，而不是使用你自己的脚本。</p>
<p><a style="text-decoration: none;" href="http://code.google.com/apis/ajaxlibs/">AJAX Libraries API</a></p>
<h3 style="font-size: 1.17em;">使用Firefox扩展</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/firefoxExtensions.png" alt="embrace firefox extensions" /></div>
<p>我是Google Chrome的忠实用户。他打开的速度非常快，并且运行Javascript的速度也比其他浏览器快很多，至少到目前为止是这样的。但是，你会发现我并不会很快放弃使用Firefox的。它的一系列非常有用的浏览器插件是令人惊叹的。下面就是我最常用的一些：</p>
<ul>
<li><a href="https://addons.mozilla.org/firefox/addon/60"><strong>Web Developer Toolbar</strong></a></li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/3247"><strong>S3 Organizer</strong></a></li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/1347"><strong>Clippings</strong></a></li>
<li><a href="https://addons.mozilla.org/firefox/addon/1843"><strong>Firebug</strong></a></li>
<li><a href="https://addons.mozilla.org/firefox/addon/1419"><strong>IE Tab</strong></a></li>
<li><a href="http://fireftp.mozdev.org/"><strong>FireFTP</strong></a></li>
<li><a href="https://addons.mozilla.org/en-US/firefox/addon/201"><strong>DownThemAll</strong></a></li>
<li><a href="https://addons.mozilla.org/firefox/addon/5369"><strong>YSlow</strong></a></li>
</ul>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/firefoxEnxtensionZOOMED.png" alt="embrace firefox extensions" /></div>
<h3 style="font-size: 1.17em;">如果有用的话，可以使用IDE</h3>
<div><img style="border: 0px initial initial;" src="http://nettuts.s3.amazonaws.com/180_efficientcode/ide.png" alt="use an ide" /></div>
<p>现在痛恨微软似乎变得非常流行，攻击那些在开发的时候使用IDE的人似乎非常时髦。事实上，这样看来比较愚蠢。</p>
<p>在很多情况，使用高级的IDE应该还是首选，特别是当你在使用OOP语言工作的时候。现在，如果你仅仅是创建一个小巧的HTML模板，<a href="http://notepad-plus.sourceforge.net/uk/site.htm">Notepad++</a>和<a href="http://www.panic.com/coda/">Coda</a>这样的程序已经非常棒了。事实上，在这种情况下我还是建议使用这样的工具的，毕竟多余的功能对你来说没有任何用处。但是，当你开发一些高级程序的时候，还是充分利用IDE的优势吧。</p>
<p>[<a href="http://net.tutsplus.com/articles/general/15-tips-to-speed-up-your-website-and-optimize-your-code/">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/15-tips-to-speed-up-your-website-and-optimize-your-code.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>30款实用的开源网页设计工具</title>
		<link>http://www.4ebstudio.com/30-useful-open-source-apps-for-web-designers.html</link>
		<comments>http://www.4ebstudio.com/30-useful-open-source-apps-for-web-designers.html#comments</comments>
		<pubDate>Sun, 25 Jan 2009 08:41:27 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[免费资源]]></category>
		<category><![CDATA[图形图像]]></category>
		<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[App]]></category>
		<category><![CDATA[wysiwyg]]></category>
		<category><![CDATA[图像]]></category>
		<category><![CDATA[工具]]></category>
		<category><![CDATA[开源]]></category>
		<category><![CDATA[编辑]]></category>
		<category><![CDATA[网页]]></category>
		<category><![CDATA[设计]]></category>
		<category><![CDATA[软件]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=715</guid>
		<description><![CDATA[本文将向你介绍30款非常具有特色且十分有用的开源的网页设计工具。这些工具涉及了源码，WYSIWYG，图像编辑，以及一些可以帮助你改善工作流程的软件。
源码及WYSIWYG编辑工具
KompoZer

KompoZer 是一款极具特色的网页设计系统，集成了FTP客户端，直观的用户界，并且支持许多主流的操作系统。

Bluefish Editor

Bluefish Editor 是一款面向网页设计师和开发人员的轻量级快速编辑工具。它提供了一个非常实用的HTML文件向导，强大的项目管理，以及查找替换功能。
Quanta Plus

Quanta Plus 是一款功能强大的网页开发IDE。它具有很强的扩展能力，并且可以运行自定义的脚本。它还具有一个可视化的CSS编辑器，并且具有语法提示和自动完成功能。
Amaya

Amaya 是一款由W3C开发的免费，开源的网页编辑器及浏览器。它开始仅仅是一款HTML/CSS编辑器，现在已经成为了许多基于XML系统的编辑工具，如SVG 和MathML。
CSSED

CSSED 是一款功能丰富，基于GTK-2 的CSS编辑器，并且具有强大的扩展功能。
OPEN BEXI HTML Builder

Open BEXI HTML Builder 是一款基于网页的，创建HTML页面的开源工具。它具有一个CSS颜色拾取器以及一个非常简单的项目管理选项。
NOTEPAD++

NOTEPAD++ 是windows下的一款非常流行的开源文本编辑工具。虽然从严格意义上来讲它不是专门针对网页设计师的，但是它拥有一个非常棒的源码编辑器，支持HTML, XML, CSS,以及 JavaScript。
jEdit

jEdit 是一款为程序开发人员设计的文本编辑器。它可以在Mac, Windows以及Linux操作系统上运行，支持HTML, XML, CSS, JavaScript 以及其他语言的语法高亮功能。
SeaMonkey
SeaMonkey, Mozilla Foundation开发的一款 &#8221;all-in-one&#8221; 浏览器，具有简单却功能强大的HTML编辑器，可实现在浏览器中直接编辑页面源码。
图形图像编辑器
GIMP

GIMP, 是一款非常流行的，功能丰富的开源图形图像编辑器。如果你喜欢Photoshop的界面，可以安装Gimpshop扩展来实现。
Inkscape

Inkscape 是一款占据主导地位的开源矢量图形编辑器，和Adobe Illustrator 及 CorelDRAW及其类似。
Krita

Krita 是一款为KOffice 设计的油画及图像编辑软件。
Karbon14

Karbon14 是一款可伸缩的适量绘图软件，它是KOffice project 的一部分。
Kivio

作为一个网页设计师，你经常需要制作设计模型或是流程图。Kivio就是一款非常出色的图标编辑器，可以帮助你设计出各种模型，图表和示意图等。
Dia

Dia 是另一款非常出色的图表绘制工具。
Skencil

Skencil 是一款非常棒的制作插图和图表的适量绘图软件。你可以将作品存储成大多数矢量软件均可识别的EPS格式。
OpenOffice Draw

OpenOffice Draw 是一款简单但是功能强大的绘图及图表制作工具，它是OpenOffice 的一部分。
mtPaint

mtPaint 是一款简单的绘图工具，由 Mark Tyler (mt)开发而成。
FontForge

如果你需要在设计中编辑字体，可以试试FontForge，一款易于使用的开源字体编辑工具。
ImageMagick
ImageMagick 是一款功能丰富的图形编辑包，可以让你创作位图格式的图像。它可以打开并保存上百种格式，包括非常流行的GIF, JPG, SVG以及 PDF格式。
GraphicsMagick
GraphicsMagick 被称作“图像处理的瑞士军刀”。它支持非常多的图像格式，具体可以查看这里。
有用的工具
HTML [...]]]></description>
			<content:encoded><![CDATA[<p>本文将向你介绍30款非常具有特色且十分有用的开源的网页设计工具。这些工具涉及了源码，WYSIWYG，图像编辑，以及一些可以帮助你改善工作流程的软件。</p>
<h3 style="font-size: 1.17em;">源码及WYSIWYG编辑工具</h3>
<h3 style="font-size: 1.17em;"><a href="http://kompozer.net/">KompoZer</a></h3>
<p><a href="http://kompozer.net/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-01_kompozer.png" alt="KompoZer - screen shot." width="550" height="240" /></a></p>
<p><em>KompoZer</em> 是一款极具特色的网页设计系统，集成了FTP客户端，直观的用户界，并且支持许多主流的操作系统。</p>
<p><span id="more-715"></span></p>
<p><img style="border-top-width: 1px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; border-top-style: dotted; border-top-color: #cccccc; display: block; width: 603px; height: 12px; margin-top: 15px; background-image: url(http://192.168.0.169/4eb/wp-includes/js/tinymce/plugins/wordpress/img/more_bug.gif); background-repeat: no-repeat; background-attachment: initial; -webkit-background-clip: initial; -webkit-background-origin: initial; background-color: #ffffff; background-position: 100% 0%;" title="更多..." src="http://192.168.0.169/4eb/wp-includes/js/tinymce/plugins/wordpress/img/trans.gif" alt="" /><strong><a href="http://bluefish.openoffice.nl/">Bluefish Editor</a></strong></p>
<p><a href="http://bluefish.openoffice.nl/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-02_bluefish.png" alt="Bluefish Editor - screen shot." width="550" height="240" /></a></p>
<p><em>Bluefish Editor</em> 是一款面向网页设计师和开发人员的轻量级快速编辑工具。它提供了一个非常实用的HTML文件向导，强大的项目管理，以及查找替换功能。</p>
<h3 style="font-size: 1.17em;"><a href="http://quanta.kdewebdev.org/">Quanta Plus</a></h3>
<p><a href="http://quanta.kdewebdev.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-03_quanta_plus.png" alt="Quanta Plus - screen shot." width="550" height="240" /></a></p>
<p><em>Quanta Plus</em> 是一款功能强大的网页开发IDE。它具有很强的扩展能力，并且可以运行自定义的脚本。它还具有一个可视化的CSS编辑器，并且具有语法提示和自动完成功能。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.w3.org/Amaya/">Amaya</a></h3>
<p><a href="http://www.w3.org/Amaya/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-04_amaya.png" alt="Amaya - screen shot." width="550" height="240" /></a></p>
<p><em>Amaya</em> 是一款由W3C开发的免费，开源的网页编辑器及浏览器。它开始仅仅是一款HTML/CSS编辑器，现在已经成为了许多基于XML系统的编辑工具，如SVG 和MathML。</p>
<h3 style="font-size: 1.17em;"><a href="http://cssed.sourceforge.net/">CSSED</a></h3>
<p><a href="http://cssed.sourceforge.net/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-05_cssed.png" alt="CSSED - screen shot." width="550" height="240" /></a></p>
<p><em>CSSED</em> 是一款功能丰富，基于GTK-2 的CSS编辑器，并且具有强大的扩展功能。</p>
<h3 style="font-size: 1.17em;"><a href="http://sourceforge.net/projects/ob-htmlbuilder/">OPEN BEXI HTML Builder</a></h3>
<p><a href="http://sourceforge.net/projects/ob-htmlbuilder/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-06_openbexi.jpg" alt="OPEN BEXI HTML Builder - screen shot." width="550" height="240" /></a></p>
<p><em>Open BEXI HTML Builder</em> 是一款基于网页的，创建HTML页面的开源工具。它具有一个CSS颜色拾取器以及一个非常简单的项目管理选项。</p>
<h3 style="font-size: 1.17em;"><a href="http://notepad-plus.sourceforge.net/uk/site.htm">NOTEPAD++</a></h3>
<p><a href="http://notepad-plus.sourceforge.net/uk/site.htm"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-07_notepad_plus_plus.png" alt="NOTEPAD++ - screen shot." width="550" height="240" /></a></p>
<p><em>NOTEPAD++</em> 是windows下的一款非常流行的开源文本编辑工具。虽然从严格意义上来讲它不是专门针对网页设计师的，但是它拥有一个非常棒的源码编辑器，支持HTML, XML, CSS,以及 JavaScript。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.jedit.org/">jEdit</a></h3>
<p><a href="http://www.jedit.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-08_jedit.png" alt="jEdit - screen shot." width="550" height="240" /></a></p>
<p><em>jEdit</em> 是一款为程序开发人员设计的文本编辑器。它可以在Mac, Windows以及Linux操作系统上运行，支持HTML, XML, CSS, JavaScript 以及其他语言的语法高亮功能。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.seamonkey-project.org/">SeaMonkey</a></h3>
<p><em>SeaMonkey</em>, <a href="http://www.mozilla.org/foundation/">Mozilla Foundation</a>开发的一款 &#8221;all-in-one&#8221; 浏览器，具有简单却功能强大的HTML编辑器，可实现在浏览器中直接编辑页面源码。</p>
<h3 style="font-size: 1.17em;">图形图像编辑器</h3>
<h3 style="font-size: 1.17em;"><a href="http://gimp.org/">GIMP</a></h3>
<p><a href="http://gimp.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-09_gimp.jpg" alt="GIMP - screen shot.," width="550" height="240" /></a></p>
<p><em>GIMP</em>, 是一款非常流行的，功能丰富的开源图形图像编辑器。如果你喜欢Photoshop的界面，可以安装<a href="http://plasticbugs.com/?page_id=294">Gimpshop</a>扩展来实现。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.inkscape.org/">Inkscape</a></h3>
<p><a href="http://www.inkscape.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-10_inkscape.jpg" alt="Inkscape - screen shot." width="550" height="240" /></a></p>
<p><em>Inkscape</em> 是一款占据主导地位的开源矢量图形编辑器，和<a href="http://www.adobe.com/products/illustrator/">Adobe Illustrator</a> 及 <a href="http://www.corel.com/servlet/Satellite/us/en/Product/1150981051301">CorelDRAW</a>及其类似。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.koffice.org/krita/">Krita</a></h3>
<p><a href="http://www.koffice.org/krita/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-11_krita.jpg" alt="Krita - screen shot." width="550" height="240" /></a></p>
<p><em>Krita</em> 是一款为<a href="http://www.koffice.org/">KOffice</a> 设计的油画及图像编辑软件。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.koffice.org/karbon/">Karbon14</a></h3>
<p><a href="http://www.koffice.org/karbon/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-12_karbon14.png" alt="Karbon14 - screen shot." width="550" height="240" /></a></p>
<p><em>Karbon14</em> 是一款可伸缩的适量绘图软件，它是<a href="http://www.koffice.org/">KOffice project</a> 的一部分。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.koffice.org/kivio/">Kivio</a></h3>
<p><a href="http://www.koffice.org/kivio/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-13_kivio.png" alt="Kivio - screen shot." width="550" height="240" /></a></p>
<p>作为一个网页设计师，你经常需要制作设计模型或是流程图。Kivio就是一款非常出色的图标编辑器，可以帮助你设计出各种模型，图表和示意图等。</p>
<h3 style="font-size: 1.17em;"><a href="http://live.gnome.org/Dia">Dia</a></h3>
<p><a href="http://live.gnome.org/Dia"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-14_dia.png" alt="Dia - screen shot." width="550" height="240" /></a></p>
<p><em>Dia</em> 是另一款非常出色的图表绘制工具。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.skencil.org/">Skencil</a></h3>
<p><a href="http://www.skencil.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-15_skencil.png" alt="Skencil - screen shot." width="550" height="240" /></a></p>
<p><em>Skencil</em> 是一款非常棒的制作插图和图表的适量绘图软件。你可以将作品存储成大多数矢量软件均可识别的EPS格式。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.openoffice.org/product/draw.html">OpenOffice Draw</a></h3>
<p><a href="http://www.openoffice.org/product/draw.html"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-16_draw.png" alt="OpenOffice Draw - screen shot." width="550" height="240" /></a></p>
<p><em>OpenOffice Draw</em> 是一款简单但是功能强大的绘图及图表制作工具，它是<a title="OpenOffice home page." href="http://www.openoffice.org/">OpenOffice</a> 的一部分。</p>
<h3 style="font-size: 1.17em;"><a href="http://mtpaint.sourceforge.net/">mtPaint</a></h3>
<p><a href="http://mtpaint.sourceforge.net/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-17_mtpaint.png" alt="mtPaint - screen shot." width="550" height="240" /></a></p>
<p><em>mtPaint</em> 是一款简单的绘图工具，由 Mark Tyler (mt)开发而成。</p>
<h3 style="font-size: 1.17em;"><a href="http://fontforge.sourceforge.net/">FontForge</a></h3>
<p><a href="http://fontforge.sourceforge.net/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-18_fontforge.png" alt="FontForge - screen shot." width="550" height="240" /></a></p>
<p>如果你需要在设计中编辑字体，可以试试FontForge，一款易于使用的开源字体编辑工具。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.imagemagick.org/script/index.php">ImageMagick</a></h3>
<p><em>ImageMagick</em> 是一款功能丰富的图形编辑包，可以让你创作位图格式的图像。它可以打开并保存上百种格式，包括非常流行的GIF, JPG, SVG以及 PDF格式。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.graphicsmagick.org/">GraphicsMagick</a></h3>
<p><em>GraphicsMagick</em> 被称作“图像处理的瑞士军刀”。它支持非常多的图像格式，具体可以查看<a title="GraphicsMagick Formats" href="http://www.graphicsmagick.org/formats.html">这里</a>。</p>
<h3 style="font-size: 1.17em;">有用的工具</h3>
<h3 style="font-size: 1.17em;"><a href="http://www.w3.org/People/Raggett/tidy/">HTML TIDY</a></h3>
<p><em>HTML TIDY</em> 是一款免费，开源的工具，用来修复和优化HTML语法。</p>
<h3 style="font-size: 1.17em;"><a href="http://cyberduck.ch/">Cyberduck</a></h3>
<p><a href="http://cyberduck.ch/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-19_cyberduck.jpg" alt="Cyberduck - screen shot." width="550" height="240" /></a></p>
<p><em>Cyberduck</em> 是Mac OS上一款非常出色的开源FTP客户端软件。它内建支持<a href="http://www.mosso.com/cloudfiles.jsp">Mosso Cloud</a> 文件以及<a href="http://aws.amazon.com/s3/">Amazon S3</a> 浏览器使它成为网页设计师和页面开发程序人员的首选。</p>
<h3 style="font-size: 1.17em;"><a href="http://filezilla-project.org/">FileZilla</a></h3>
<p><a href="http://filezilla-project.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-20_filezilla.png" alt="FileZilla - screen shot." width="550" height="240" /></a></p>
<p><em>FileZilla</em> 是一款非常流行的开源FTP客户端软件。它支持许多平台（包括Linux, Mac, 以及Windows），并且可以通过很多种模式进行文件传输。</p>
<h3 style="font-size: 1.17em;"><a href="http://winscp.net/eng/index.php">WinSCP</a></h3>
<p><a href="http://winscp.net/eng/index.php"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-21_winscp.png" alt="WinSCP - screen shot." width="550" height="240" /></a></p>
<p><em>WinSCP</em> 是一款windows操作平台下的FTP客户端软件，可以进行本地和远程文件的传输。它有一个非常简单的文件管理功能帮助你操作和组织文件。</p>
<h3 style="font-size: 1.17em;"><a href="http://camstudio.org/">CamStudio</a></h3>
<p><a href="http://camstudio.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-22_camstudio.jpg" alt="CamStudio - screen shot." width="550" height="240" /></a></p>
<p>当你的项目经理或者客户要求你设计一款计算机模拟内容（例如网站服务的电子教程）的时候，你可能需要一款屏幕录制软件。这时你可以试试CamStudio，一款功能丰富的开源屏幕录制工具。</p>
<h3 style="font-size: 1.17em;"><a href="http://greenshot.sourceforge.net/">Greenshot</a></h3>
<p><a href="http://greenshot.sourceforge.net/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-23_greenshot.jpg" alt="Greenshot - screen shot." width="550" height="240" /></a></p>
<p>网页设计经常需要进行抓屏工作来进行设计展示说明。Greenshot是一款非常出色的且功能丰富的抓屏软件，免费而且开源。</p>
<h3 style="font-size: 1.17em;"><a href="http://brandonz.net/projects/zscreen/index.html">ZScreen</a></h3>
<p><a href="http://brandonz.net/projects/zscreen/index.html"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-24_zscreen.jpg" alt="ZScreen - screen shot." width="550" height="240" /></a></p>
<p><em>ZScreen</em> 是一款杰出且实用的抓屏工具，它可以实现全屏、可视区域及指定区域的抓屏工作。你可以安装自动FTP截屏功能，从而轻松实现图片的共享和归档。</p>
<h3 style="font-size: 1.17em;"><a href="http://xournal.sourceforge.net/">Xournal</a></h3>
<p><a href="http://xournal.sourceforge.net/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-25_xournal.png" alt="Xournal - screen shot." width="550" height="240" /></a></p>
<p><em>Xournal</em> 是一款简单的笔记及草图工具，可以将你的笔记本作为你的输入工具。它和<a title="Wikipedia entry on Windows Journal." href="http://en.wikipedia.org/wiki/Windows_Journal">Windows Journal</a> 的工作原理相似。</p>
<h3 style="font-size: 1.17em;"><a href="http://getfirebug.com/">Firebug</a></h3>
<p><a href="http://getfirebug.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-26_firebug.png" alt="Firebug - screen shot." width="550" height="240" /></a></p>
<p><em>Firebug</em> 是一款相当实用的页面调试工具。你可以使用它获取和探测HTML及CSS源码。</p>
<h3 style="font-size: 1.17em;"><a href="http://sourceforge.net/projects/gallery/">Gallery</a></h3>
<p><a href="http://sourceforge.net/projects/gallery/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/23-27_gallery.jpg" alt="Gallery - screen shot." width="550" height="240" /></a></p>
<p><em>使用Gallery</em>, 你可以随心所欲的控制你的图片。Gallery 是一款基于网页的图库工具，你可以用它在线储存、管理以及访问图像。</p>
<p>[<a href="http://sixrevisions.com/tools/30-useful-open-source-apps-for-web-designers/">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/30-useful-open-source-apps-for-web-designers.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>12款针对设计师的实用网络工具</title>
		<link>http://www.4ebstudio.com/12-useful-web-tools-for-designers.html</link>
		<comments>http://www.4ebstudio.com/12-useful-web-tools-for-designers.html#comments</comments>
		<pubDate>Thu, 15 Jan 2009 08:56:35 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[图形图像]]></category>
		<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[字体]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[网页设计]]></category>
		<category><![CDATA[网络工具，平面设计，网页设计]]></category>
		<category><![CDATA[设计]]></category>
		<category><![CDATA[软件]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=740</guid>
		<description><![CDATA[当进行设计的时候，有很多基于网页的免费工具可以帮你完成诸多任务，如调色板选择，创造独特的字体，编辑图像，测试印刷版面等。
本文将向你介绍一些实用的在线设计工具。
kuler Create

kuler 是Adobe公司开发的一款基于网页的，帮你创建和共享色彩主题的工具。你可以使用user-submitted color themes 提供的主题样式，也可以通过kuler Create 网页工具自己创建色彩主题。

pixlr

pixlr 是一款基于网页的，界面类似photoshop的图像编辑工具。它具有类似于photoshop的图层，滤镜，甚至克隆图章工具。

Wellstyled Color Scheme Generator

Wellstyled’s Color Scheme Generator 是一款简单的基于网页的色彩主题创建工具。它具有一个直观的界面，并且可以将色彩主题加入书签中。
FontStruct

FontStruct 是由字体零售商FontShop 创建的一款基于网页的字体创建，编辑以及共享工具。FontStructor是一款极具创新意义的字体编辑工具，可以让设计师们创建各种漂亮的字体样式。你需要免费注册一个帐号来使用该工具。
Typetester

Typetester 允许你测试以及比较屏幕字体。它有非常多的字样，包括网页安全字体如Arial和Verdana，并且它也可以实用你自己的字体。
TypeNavigator

TypeNavigator 是一款非常精巧的网页工具可以帮助设计师识别字体。它可以很轻松的帮你找到你想在你的设计中使用的字体。
Dummy Text Generator

Dummy Text Generator 是一款多功能的随机文本生成网络工具。尽管该工具宣称是专为网页设计师定制的，但是对于做印刷排版的设计师来说也是派的上用场的。
BGPatterns

BGPatterns 是一款制作平铺图案的网络工具，它的界面直观且功能丰富，你可以批量进行图案的编辑和修改尺寸工作。
Dabbleboard

Dabbleboard 是一款方便的，基于网页的绘图软件，并提供给设计师一个良好的协作功能。你可以通过该软件于其他设计伙伴们共同创制作页面布局，设计用户界面，或是手绘图形。
PicMarkr

PicMarkr 是一款基于网页的水印制作工具，用来保护你的图片版权。该软件对在线批量添加水印并发布来说是相当棒的。
favicon.cc

favicon.cc 是一款favicon设计工具。通过favicon.cc在线工具，你可以自己设计favicon或者从本地上传图片文件转换成favicon文件。
templatr

templatr 是一款便捷的制作网页模板的网络工具。他的界面非常简单，内嵌一款非常棒的工具来快速生成页面布局，不过代码相对冗乱。
[原文链接]
]]></description>
			<content:encoded><![CDATA[<p>当进行设计的时候，有很多基于网页的免费工具可以帮你完成诸多任务，如调色板选择，创造独特的字体，编辑图像，测试印刷版面等。</p>
<p>本文将向你介绍一些实用的在线设计工具。</p>
<h3 style="font-size: 1.17em;"><a href="http://kuler.adobe.com/#create/fromacolor">kuler Create</a></h3>
<p><a href="http://kuler.adobe.com/#create/fromacolor"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-01_kuler.png" alt="kuler Create - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">kuler</em> 是Adobe公司开发的一款基于网页的，帮你创建和共享色彩主题的工具。你可以使用<a href="http://kuler.adobe.com/#themes/rating?time=0">user-submitted color themes</a> 提供的主题样式，也可以通过<a href="http://kuler.adobe.com/#create/fromacolor">kuler Create</a> 网页工具自己创建色彩主题。</p>
<p><span id="more-740"></span></p>
<h3 style="font-size: 1.17em;"><a href="http://www.pixlr.com/editor/">pixlr</a></h3>
<p><a href="http://www.pixlr.com/editor/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-02_pixlr.png" alt="pixlr - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">pixlr</em> 是一款基于网页的，界面类似photoshop的图像编辑工具。它具有类似于photoshop的图层，滤镜，甚至克隆图章工具。</p>
<p><img style="border-top-width: 1px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; border-top-style: dotted; border-top-color: #cccccc; display: block; width: 603px; height: 12px; margin-top: 15px; background-image: url(http://192.168.0.169/4eb/wp-includes/js/tinymce/plugins/wordpress/img/more_bug.gif); background-repeat: no-repeat; background-attachment: initial; -webkit-background-clip: initial; -webkit-background-origin: initial; background-color: #ffffff; background-position: 100% 0%;" title="更多..." src="http://192.168.0.169/4eb/wp-includes/js/tinymce/plugins/wordpress/img/trans.gif" alt="" /></p>
<h3 style="font-size: 1.17em;"><a href="http://wellstyled.com/tools/colorscheme2/index-en.html">Wellstyled Color Scheme Generator</a></h3>
<p><a href="http://wellstyled.com/tools/colorscheme2/index-en.html"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-03_ws_color_schemer.png" alt="Wellstyled Color Scheme Generator - screen shot." width="500" height="250" /></a></p>
<p>Wellstyled’s <em style="font-style: italic;">Color Scheme Generator</em> 是一款简单的基于网页的色彩主题创建工具。它具有一个直观的界面，并且可以将色彩主题加入书签中。</p>
<h3 style="font-size: 1.17em;"><a href="http://fontstruct.fontshop.com/">FontStruct</a></h3>
<p><a href="http://fontstruct.fontshop.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-04_fontstructor.png" alt="FontStruct - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">FontStruct</em> 是由字体零售商<a title="About FontShop." href="http://www.fontshop.com/about/">FontShop</a> 创建的一款基于网页的字体创建，编辑以及共享工具。<a href="http://fontstruct.fontshop.com/sign_in/fontstructor">FontStructor</a>是一款极具创新意义的字体编辑工具，可以让设计师们创建各种漂亮的字体样式。你需要免费注册一个帐号来使用该工具。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.typetester.org/">Typetester</a></h3>
<p><a href="http://www.typetester.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-05_typetester.png" alt="Typetester - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">Typetester</em> 允许你测试以及比较屏幕字体。它有非常多的字样，包括网页安全字体如Arial和Verdana，并且它也可以实用你自己的字体。</p>
<h3 style="font-size: 1.17em;"><a href="http://typenav.fontshop.com/">TypeNavigator</a></h3>
<p><a href="http://typenav.fontshop.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-06_typenavigator.png" alt="TypeNavigator - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">TypeNavigator</em> 是一款非常精巧的网页工具可以帮助设计师识别字体。它可以很轻松的帮你找到你想在你的设计中使用的字体。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.blindtextgenerator.com/">Dummy Text Generator</a></h3>
<p><a href="http://www.blindtextgenerator.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-07_dummy_text_generator.png" alt="Dummy Text Generator - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">Dummy Text Generator</em> 是一款多功能的随机文本生成网络工具。尽管该工具宣称是专为网页设计师定制的，但是对于做印刷排版的设计师来说也是派的上用场的。</p>
<h3 style="font-size: 1.17em;"><a href="http://bgpatterns.com/">BGPatterns</a></h3>
<p><a href="http://bgpatterns.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-08_bgpatterns.png" alt="BGPatterns - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">BGPatterns</em> 是一款制作平铺图案的网络工具，它的界面直观且功能丰富，你可以批量进行图案的编辑和修改尺寸工作。</p>
<h3 style="font-size: 1.17em;"><a href="http://dabbleboard.com/draw">Dabbleboard</a></h3>
<p><a href="http://dabbleboard.com/draw"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-09_dabbleboard.png" alt="Dabbleboard - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">Dabbleboard</em> 是一款方便的，基于网页的绘图软件，并提供给设计师一个良好的协作功能。你可以通过该软件于其他设计伙伴们共同创制作页面布局，设计用户界面，或是手绘图形。</p>
<h3 style="font-size: 1.17em;"><a href="http://picmarkr.com/">PicMarkr</a></h3>
<p><a href="http://picmarkr.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-10_picmarkr.jpg" alt="PicMarkr - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">PicMarkr</em> 是一款基于网页的水印制作工具，用来保护你的图片版权。该软件对在线批量添加水印并发布来说是相当棒的。</p>
<h3 style="font-size: 1.17em;"><a href="http://www.favicon.cc/">favicon.cc</a></h3>
<p><a href="http://www.favicon.cc/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-11_faviconcc.png" alt="favicon.cc - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">favicon.cc</em> 是一款favicon设计工具。通过favicon.cc在线工具，你可以自己设计favicon或者从本地上传图片文件转换成favicon文件。</p>
<h3 style="font-size: 1.17em;"><a href="http://templatr.cc/">templatr</a></h3>
<p><a href="http://templatr.cc/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2009/01/15-12_templatr.png" alt="templatr - screen shot." width="500" height="250" /></a></p>
<p><em style="font-style: italic;">templatr</em> 是一款便捷的制作网页模板的网络工具。他的界面非常简单，内嵌一款非常棒的工具来快速生成页面布局，不过代码相对冗乱。</p>
<p>[<a href="http://sixrevisions.com/graphics-design/12-useful-web-tools-for-designers/">原文链接</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/12-useful-web-tools-for-designers.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>介绍14款免费的基于网页的协作工具</title>
		<link>http://www.4ebstudio.com/14-free-tools-for-web-based-collaboration.html</link>
		<comments>http://www.4ebstudio.com/14-free-tools-for-web-based-collaboration.html#comments</comments>
		<pubDate>Sat, 01 Nov 2008 08:43:57 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[免费资源]]></category>
		<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=718</guid>
		<description><![CDATA[现在都在讲协同合作，对于一名设计师或开发人员来说这样的工作模式非常重要。尽管一些像Basecamp和Zimbra的付费或注册服务已经成为主流，但是对于囊中羞涩的个人来说，还是可以找到有很多相似的免费服务，并且这些服务仍旧提供了很多类似的功能。
本文将介绍14款免费的远程、基于网络的在线协作工具。无论你是需要一款最基本的白板工具，或是进行头脑风暴的工具，还是一个全方位的项目管理工具，你都会从中找到一两款适合你的。
Google Docs



Google Docs 是一款非常出色的在线办公工具。你可以共享文件和表单，并且和你的团队或客户进行实时交流。作为一款基于浏览器的软件，软件运行所占用的资源非常小。在线办公意味你在任何有互联网接入的地方均可以使用。可以前往Google Docs的帮助页获取相关使用说明。
Stixy

Stixy是一款非常灵活的在线电子公告牌。它没有固定的结构，完全基于用户的需要而创建个性化的界面，是一款非常棒的白版工具。stixy比较直观的将便签、文件、照片、日历发布在一个类似公告板一样的页面上，你可以自由编排这些文件的布局然后通过邮件发送链接的方式与别人共享。整个界面实用又美观，每个用户可以创建多个这样的公告板方便与不同的人分享不同的文件。
Project2Manage

Project2Manage 是一款功能齐全，免费的项目管理和协作托管工具（和Basecamp类似）。你可以建立不同的角色和权限给每个团队成员。该款工具可以管理无限量的项目。
bubbl.us

bubbl.us 是一款免费的，基于网页的头脑风暴协作工具。你可以创建漂亮的思维地图，并且和你的团队成员分享。你可以保存、发邮件并且打印你的思维地图，甚至可以直接将它们嵌入你的网页中。
Dabbleboard

Dabbleboard 是一款功能强大、易于使用的线白板工具。使用Dabbleboard可以创建个人用户界面的线框图，图表以及网络图等。你可以创建许多工具包（一套可重复使用的绘图对象）或者使用预置的工具包。
Protonotes

Protonotes 是一款网页注释服务，可以让你在浏览网页的同时高亮显示团队用户对网页中出现的关键词的评价以及意见；你可以订阅团队的注释RSS。你可以将你的数据导出成CSV文件，并用像Google Spreadsheets、Excel这样的电子表格工具打开，你还可以用MySQL数据库储存你的数据。
ProjectPier

ProjectPier 是一个自托管、开源、基于PHP的项目管理工具。可以在一个界面下同时管理你的任务、团队成员和项目。使用界面非常简单，虽然没有一些独特的功能，但是对于进行项目管理和协作已经足够了。
Twiddla

Twiddla 是一款功能强大、内容丰富的在线协助工具，用户只需要分享出某一项目的URL地址，即可邀请团队其他成员进来进行实时的共创作交流，简单到一切只需要通过Web浏览器，甚至无需下载安装任何插件和软件！Twiddla 的用户体验也是十分的良好，它可全面支持文字形式以及语音功能的即时通讯和多种方式的绘制工具等。
Wetpaint

Wetpaint 具有wiki、博客、论坛和社区的功能，是一款自由的协作工具。因为它使用简单，不需要任何专业技术，成为了一款非常出色的可以随意编排自己内容的平台。
Thinkature

Thinkature 是一款出色的协作工具。你可以通过聊天、画图或直接抓取网页来创建一个工具区进行视频交流。使用起来非常灵活。
Spicebird

如果你想使用桌面工具来空远程或基于网页的协作工具，可以使用Spicebird，一款自建服务器的、开源的满足所有协作需要的平台。它有一个内建的即时通信系统，一个群组日历，一个地址簿以及更多。
Mindquarry DO

Mindquarry DO 是一款用Java(J2EE)编写的开源协作工具。它是Mindquarry的在线版本，同时也提供下载。
Vyew

Vyew 是一款网络会议工具，可以免费提供20个参与者进来。你可以共享你的桌面，使用内建的抓屏工具保存会议内容，添加公司logo个性化你的Vyew，使用一些插件如DiagramVyew来创建图形与参会人员共享等等。
Writeboard

Writeboard 是由37Signals开发的一款简单的，基于网页的免费文本协作工具。你可以从创建你自己的写字板开始，邀请团队成员，然后开始书写文本。团队中的人可以实时看到你的更新，编辑以及任何变化。你可以保存，修改，创建版本，以及返回先前的任何版本。
]]></description>
			<content:encoded><![CDATA[<p>现在都在讲协同合作，对于一名设计师或开发人员来说这样的工作模式非常重要。尽管一些像<a style="color: #006699; text-decoration: none;" href="http://www.basecamphq.com/">Basecamp</a>和<a style="color: #006699; text-decoration: none;" href="http://www.zimbra.com/">Zimbra</a>的付费或注册服务已经成为主流，但是对于囊中羞涩的个人来说，还是可以找到有很多相似的免费服务，并且这些服务仍旧提供了很多类似的功能。</p>
<p>本文将介绍14款免费的远程、基于网络的在线协作工具。无论你是需要一款最基本的白板工具，或是进行头脑风暴的工具，还是一个全方位的项目管理工具，你都会从中找到一两款适合你的。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.google.com/google-d-s/tour1.html">Google Docs</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.google.com/google-d-s/tour1.html"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-01_google_docs.png" alt="Google Docs - screen shot." width="550" height="250" /></a></p>
<p><img style="border-top-width: 1px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-style: initial; border-color: initial; border-top-style: dotted; border-top-color: #cccccc; display: block; width: 603px; height: 12px; margin-top: 15px; background-image: url(http://192.168.0.169/4eb/wp-includes/js/tinymce/plugins/wordpress/img/more_bug.gif); background-repeat: no-repeat; background-attachment: initial; -webkit-background-clip: initial; -webkit-background-origin: initial; background-color: #ffffff; background-position: 100% 0%;" title="更多..." src="http://192.168.0.169/4eb/wp-includes/js/tinymce/plugins/wordpress/img/trans.gif" alt="" /></p>
<p><span id="more-718"></span></p>
<p><em style="font-style: italic;">Google Docs</em> 是一款非常出色的在线办公工具。你可以共享文件和表单，并且和你的团队或客户进行实时交流。作为一款基于浏览器的软件，软件运行所占用的资源非常小。在线办公意味你在任何有互联网接入的地方均可以使用。可以前往Google Docs的<a href="http://www.google.com/google-d-s/intl/zh-CN/tour1.html" target="_blank">帮助页</a>获取相关使用说明。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.stixy.com/">Stixy</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.stixy.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-02_stixy.png" alt="Stixy - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Stixy</em>是一款非常灵活的在线电子公告牌。它没有固定的结构，完全基于用户的需要而创建个性化的界面，是一款非常棒的白版工具。stixy比较直观的将便签、文件、照片、日历发布在一个类似公告板一样的页面上，你可以自由编排这些文件的布局然后通过邮件发送链接的方式与别人共享。整个界面实用又美观，每个用户可以创建多个这样的公告板方便与不同的人分享不同的文件。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.project2manage.com/">Project2Manage</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.project2manage.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-03_project2manage.jpg" alt="Project2Manage - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Project2Manage</em> 是一款功能齐全，免费的项目管理和协作托管工具（和Basecamp类似）。你可以建立不同的角色和权限给每个团队成员。该款工具可以管理无限量的项目。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.bubbl.us/index">bubbl.us</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.bubbl.us/index"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-04_bubbleus.jpg" alt="bubbl.us - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">bubbl.us</em> 是一款免费的，基于网页的头脑风暴协作工具。你可以创建漂亮的思维地图，并且和你的团队成员分享。你可以保存、发邮件并且打印你的思维地图，甚至可以直接将它们嵌入你的网页中。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.dabbleboard.com/">Dabbleboard</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.dabbleboard.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-05_dabbleboard.png" alt="Dabbleboard - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Dabbleboard</em> 是一款功能强大、易于使用的线白板工具。使用Dabbleboard可以创建个人用户界面的线框图，图表以及网络图等。你可以创建许多工具包（一套可重复使用的绘图对象）或者使用预置的工具包。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.protonotes.com/">Protonotes</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.protonotes.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-06_protonote.jpg" alt="Protonotes - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Protonotes</em> 是一款网页注释服务，可以让你在浏览网页的同时高亮显示团队用户对网页中出现的关键词的评价以及意见；你可以订阅团队的注释RSS。你可以将你的数据导出成CSV文件，并用像Google Spreadsheets、Excel这样的电子表格工具打开，你还可以用MySQL数据库储存你的数据。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://projectpier.org/">ProjectPier</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://projectpier.org/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-07_projectpier.png" alt="ProjectPier - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">ProjectPier</em> 是一个自托管、开源、基于PHP的项目管理工具。可以在一个界面下同时管理你的任务、团队成员和项目。使用界面非常简单，虽然没有一些独特的功能，但是对于进行项目管理和协作已经足够了。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.twiddla.com/">Twiddla</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.twiddla.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-08_twiddla.png" alt="Twiddla - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Twiddla</em> 是一款功能强大、内容丰富的在线协助工具，用户只需要分享出某一项目的URL地址，即可邀请团队其他成员进来进行实时的共创作交流，简单到一切只需要通过Web浏览器，甚至无需下载安装任何插件和软件！Twiddla 的用户体验也是十分的良好，它可全面支持文字形式以及语音功能的即时通讯和多种方式的绘制工具等。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.wetpaint.com/">Wetpaint</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.wetpaint.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-09_wetpaint.png" alt="Wetpaint - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Wetpaint</em> 具有wiki、博客、论坛和社区的功能，是一款自由的协作工具。因为它使用简单，不需要任何专业技术，成为了一款非常出色的可以随意编排自己内容的平台。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://thinkature.com/">Thinkature</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://thinkature.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-11_thinkature.jpg" alt="Thinkature - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Thinkature</em> 是一款出色的协作工具。你可以通过聊天、画图或直接抓取网页来创建一个工具区进行视频交流。使用起来非常灵活。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.spicebird.com/">Spicebird</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.spicebird.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-12_spicebird.jpg" alt="Spicebird - screen shot." width="550" height="250" /></a></p>
<p>如果你想使用桌面工具来空远程或基于网页的协作工具，可以使用<em style="font-style: italic;">Spicebird</em>，一款自建服务器的、开源的满足所有协作需要的平台。它有一个内建的即时通信系统，一个群组日历，一个地址簿以及更多。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://www.mindquarry.com/do">Mindquarry DO</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.mindquarry.com/do"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-13_mindquarry.jpg" alt="Mindquarry DO -screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Mindquarry DO</em> 是一款用Java(J2EE)编写的开源协作工具。它是Mindquarry的在线版本，同时也提供下载。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://vyew.com/site/">Vyew</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://vyew.com/site/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-14_vyew.png" alt="Vyew - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Vyew</em> 是一款网络会议工具，可以免费提供20个参与者进来。你可以共享你的桌面，使用内建的抓屏工具保存会议内容，添加公司logo个性化你的Vyew，使用一些插件如DiagramVyew来创建图形与参会人员共享等等。</p>
<h3 style="font-size: 1.17em;"><a style="color: #006699; text-decoration: none;" href="http://writeboard.com/">Writeboard</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://writeboard.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/31-15_writeboard.png" alt="Writeboard - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Writeboard</em> 是由37Signals开发的一款简单的，基于网页的免费文本协作工具。你可以从创建你自己的写字板开始，邀请团队成员，然后开始书写文本。团队中的人可以实时看到你的更新，编辑以及任何变化。你可以保存，修改，创建版本，以及返回先前的任何版本。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/14-free-tools-for-web-based-collaboration.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>15款检测网站流行度的工具</title>
		<link>http://www.4ebstudio.com/tools_monitoring_website_popularity.html</link>
		<comments>http://www.4ebstudio.com/tools_monitoring_website_popularity.html#comments</comments>
		<pubDate>Tue, 14 Oct 2008 08:45:17 +0000</pubDate>
		<dc:creator>4EB Studio</dc:creator>
				<category><![CDATA[免费资源]]></category>
		<category><![CDATA[天兔贴士]]></category>
		<category><![CDATA[实用工具]]></category>
		<category><![CDATA[seo]]></category>
		<category><![CDATA[搜索引擎]]></category>
		<category><![CDATA[站长工具]]></category>
		<category><![CDATA[网站工具]]></category>
		<category><![CDATA[网站开发]]></category>

		<guid isPermaLink="false">http://4ebstudio.com/?p=720</guid>
		<description><![CDATA[作为一个网页设计师或开发人员，当你正在建设网站的时候，首先应该对类似的网站加以分析来帮助你对设计和开发策略做决定。清楚的了解类似网站的运作情况将会对你的设计元素，网站特性以及网站内容提供参考和灵感。
本文将向你介绍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 通过对一个网站的估值、日浏览量以及网站收益等来判定网站的流行度。
]]></description>
			<content:encoded><![CDATA[<p>作为一个网页设计师或开发人员，当你正在建设网站的时候，首先应该对类似的网站加以分析来帮助你对设计和开发策略做决定。清楚的了解类似网站的运作情况将会对你的设计元素，网站特性以及网站内容提供参考和灵感。</p>
<p>本文将向你介绍15款高质量的、免费的、简单的网页工具来帮助你详尽的了解一个网站。</p>
<p>1. <a style="color: #006699; text-decoration: none;" title="Yahoo! Site Explorer" href="https://siteexplorer.search.yahoo.com/">Yahoo! Site Explorer</a></p>
<p><a style="color: #006699; text-decoration: none;" href="https://siteexplorer.search.yahoo.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-01_yahoo_site_explorer.png" alt="Yahoo! Site Explorer - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Site explorer</em> 是一款基于search API的反向链接查询工具，人们可以通过它查看哪些URL已被Yahoo!搜索收录或是提交还没被收录的URL。该工具可以通过统计一个网站被链接的数量来显示该网站的流行程度。</p>
<p><span id="more-720"></span></p>
<p>2. <a style="color: #006699; text-decoration: none;" title="Compete" href="http://compete.com/">Compete</a></p>
<p><a style="color: #006699; text-decoration: none;" href="http://compete.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-10_compete.png" alt="Compete - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Compete</em> 是一款基于网页的分析工具，可以帮助你同时比较3个网站的通信量统计以及趋势。它可以评估一个网站的唯一访问者数量和页面浏览次数以及网站的流行度增长率。</p>
<p>3. <a style="color: #006699; text-decoration: none;" title="Quantcast" href="http://www.quantcast.com/">Quantcast</a></p>
<p><a style="color: #006699; text-decoration: none;" href="http://www.quantcast.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-11_quantcast.png" alt="Quantcast - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Quantcast</em> 不仅可以统计网站流量，pv值等，它能够提供一份更加完整的访问者报告，甚至可以统计访问者的性别，年龄和受教育程度。</p>
<p>4. <a style="color: #006699; text-decoration: none;" title="Alexa the Web Information Company" href="http://www.alexa.com/">Alexa</a></p>
<p><a style="color: #006699; text-decoration: none;" href="http://www.alexa.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-12_alexa.png" alt="Alexa - screen shot." width="550" height="250" /></a></p>
<p>成立于1996年的<em style="font-style: italic;">Alexa</em>是目前最流行的网站流量排名统计服务商。它能提供网站的流量统计，并通过这些数据进行一系列的排名。</p>
<p>5. <a style="color: #006699; text-decoration: none;" title="Feed Compare" href="http://www.feedcompare.com/">Feed Compare</a></p>
<p><a style="color: #006699; text-decoration: none;" href="http://www.feedcompare.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-04_feed_compare.png" alt="Feed Compare - screen shot." width="550" height="250" /></a></p>
<p>测试一个网站流行度的有效途径就是查看该网站的RSS的订阅量。如果一个网站使用<a style="color: #006699; text-decoration: none;" title="FeedBurner" href="http://www.feedburner.com/">FeedBurner（</a>一款主流的RSS订阅服务商），你可以使用<em style="font-style: italic;">Feed Compare</em>查看网含的订阅趋势并且同时对4个网站的订阅量增长率进行比较。</p>
<h3 style="font-size: 1.17em;">6. <a style="color: #006699; text-decoration: none;" title="popuri.us" href="http://popuri.us/">popuri.us</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://popuri.us/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-02_popurius.png" alt="popuri.us - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">popuri.us</em> 是一个提供网站流行度、网站综合信息在线检测查询服务的网站。使用非常简单，无需注册，只要输入你想检测的网址即可。帮助你查询出网站的RANK值(比如Google PR、Alexa Rank等)、在网络书签网站中的被收藏连接数(比如del.icio.us等)及RSS阅读器中的订阅数(比如Bloglines等)。另外，它还提供了一个Widget应用，可在你的网站上直接显示Google PR、Alexa Rank等值。</p>
<h3 style="font-size: 1.17em;">7. <a style="color: #006699; text-decoration: none;" title="socialmeter" href="http://www.socialmeter.com/">socialmeter</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.socialmeter.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-03_socialmeter.png" alt="socialmeter - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">socialmeter</em>是一个网页链接分析工具，通过输入一个网页地址就可以得知此网页在一些主要的社会性网站中的链接情况，如Digg、del.icio.us、Google、Technorati和Yahoo My Web等等共11个网站。可以用来查看自已在这些大型网站中的链接情况。</p>
<h3 style="font-size: 1.17em;">8. <a style="color: #006699; text-decoration: none;" title="TweetVolume" href="http://www.tweetvolume.com/">TweetVolume</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.tweetvolume.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-05_tweetvolume.png" alt="TweetVolume - screen shot." width="550" height="250" /></a></p>
<p>另一种检测网站流行度的方式就是查看Twitter的人们是否在谈论该网站。<em style="font-style: italic;">TweetVolume</em> 可以通过输入关键字和词来查看这些内容被多少Twitter使用者提及。</p>
<h3 style="font-size: 1.17em;">9. <a style="color: #006699; text-decoration: none;" title="Quarkbase" href="http://www.quarkbase.com/">Quarkbase</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.quarkbase.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-06_quarkbase.png" alt="Quarkbase - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">Quarkbase</em> 是一款综合的网络工具，可以显示一个网站的许多信息。它有一款“Social Popularity”标签可以显示一个网站在一些社会媒体网络如Digg, Stumbleupon以及Delicious上的流行度相关信息。</p>
<h3 style="font-size: 1.17em;">10. <a style="color: #006699; text-decoration: none;" title="BlogPulse Profiles" href="http://www.blogpulse.com/profile">BlogPulse Profiles</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.blogpulse.com/profile"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-07_blogpulse_profiles.png" alt="BlogPulse Profiles - screen shot." width="550" height="250" /></a></p>
<p>如果你对一个博客网站的相关信息感兴趣，<em style="font-style: italic;">logPulse Profiles <span style="font-style: normal;">这款工具可以帮助你。它是一个简单的网络应用，提供博客的排名，被其它博客提及的频率以及其它相关信息如该博客的文章发布频率，与其类似的博客等。</span></em></p>
<h3 style="font-size: 1.17em;">11. <a style="color: #006699; text-decoration: none;" title="Technorati: Blogger Central" href="http://technorati.com/blogging/">Technorati Blogging Central</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://technorati.com/blogging/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-08_technorati_blogger_central.png" alt="Technorati Blogging Central - screen shot.," width="550" height="250" /></a></p>
<p>Technorati是一款占有主要地位的博客搜索引擎。它的<em style="font-style: italic;">Blogger Central</em> allows允许你查看一个流行博客在世界范围内的排名。Technorati是通过一个博客的反向链接来统计博客流行度的。</p>
<h3 style="font-size: 1.17em;">12. <a style="color: #006699; text-decoration: none;" title="Statbrain.com" href="http://statbrain.com/">Statbrain.com</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://statbrain.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-09_statsbrain.png" alt="Statbrain.com - screen shot." width="550" height="250" /></a><em style="font-style: italic;"> </em></p>
<p><em style="font-style: italic;">Statbrain.com</em> 是一款十分简单的工具，用来统计每天的页面访问量。</p>
<h3 style="font-size: 1.17em;">13. <a style="color: #006699; text-decoration: none;" title="Cubestat - Website Value Calculator" href="http://www.cubestat.com/">Cubestat</a><span style="font-size: 16px; font-weight: normal;"><a style="color: #006699; text-decoration: none;" href="http://www.cubestat.com/"></a></span></h3>
<h3 style="font-size: 1.17em;"><span style="font-size: 16px; font-weight: normal;"><a style="color: #006699; text-decoration: none;" href="http://www.cubestat.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-13_cubestat.png" alt="Cubestat - screen shot." width="550" height="250" /></a></span></h3>
<p><em style="font-style: italic;">Cubestat</em> 也是一款简单的网络工具，提供一个网站的日访问量。不过它的一个独特的地方就是它有一个网站价值评估（美元），价值越高，说明网站越流行。</p>
<h3 style="font-size: 1.17em;">14. <a style="color: #006699; text-decoration: none;" title="dnScoop - Domain Name Value, History, Stats Tool and Forums" href="http://www.dnscoop.com/">dnScoop</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.dnscoop.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-14_dnscoop.png" alt="dnScoop - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">dnScoop</em> 是一个网站相关信息，网站价值查询工具，能够查询的内容包括：域名年限，Google Pagerank，所有指向此域名的网页数，Alex信息，主机IP信息，还可以查看此IP上面其他停放的网站等。</p>
<h3 style="font-size: 1.17em;">15. <a style="color: #006699; text-decoration: none;" title="WebsiteOutlook.com - Website value calculator and web information" href="http://www.websiteoutlook.com/">WebsiteOutlook</a></h3>
<p><a style="color: #006699; text-decoration: none;" href="http://www.websiteoutlook.com/"><img style="border: 0px initial initial;" src="http://images.sixrevisions.com/2008/10/10-15_websiteoutlook.png" alt="WebsiteOutlook - screen shot." width="550" height="250" /></a></p>
<p><em style="font-style: italic;">WebsiteOutlook</em> 通过对一个网站的估值、日浏览量以及网站收益等来判定网站的流行度。</p>
]]></content:encoded>
			<wfw:commentRss>http://www.4ebstudio.com/tools_monitoring_website_popularity.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>
