<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
<channel>
<title><![CDATA[≈忘了￠怎么◆cry◆≈]]></title>
<link>http://www.7crystal.com/blog/</link>
<description><![CDATA[遍躰麟傷·.才訆薸亮]]></description>
<language>zh-cn</language>
<copyright><![CDATA[Copyright 2005 PBlog2 v2.4]]></copyright>
<webMaster><![CDATA[7crystal@7crystal.com(七彩Crystal)]]></webMaster>
<generator>PBlog2 v2.4</generator> 
<image>
	<title>≈忘了￠怎么◆cry◆≈</title> 
	<url>http://www.7crystal.com/blog/images/logos.gif</url> 
	<link>http://www.7crystal.com/blog/</link> 
	<description>≈忘了￠怎么◆cry◆≈</description> 
</image>

			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=49</link>
			<title><![CDATA[用户名和密码输入框的一种设计by Dofy ]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[XHTML+CSS]]></category>
			<pubDate>Tue,26 Aug 2008 11:18:00 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=49</guid>	
		<description><![CDATA[登陆框在站点中的应用应该算最多的了, 设计中有很多种方案, 近日应用到一种输入框前面没有 label 的.<br/>如果单纯去掉 label 将没有任何说明, 用户很可能不知道两个文本框是干嘛用的, 所以还要有提示, 怎么提示呢?<br/>最先想到的一种方法是设置 input 的默认 value 属性, 然后在输入框获得焦点后清空 value, 失去焦点且 value 为空时恢复默认 value, 这种设计很容易实现, 但有几个弊病:<br/><br/>需要判断用户输入值是否与默认值相同, 不相同则失去焦点后不能清除 value; <br/>这样带来另一个问题, 如果用户名,尤其是密码刚好与默认值相同怎么办? <br/>还有个问题就是密码输入框的type属性, 如果用文字提示, 显示文字的时候密码输入框的 type 就不能是 password, 否则提示文字也会变成掩码, 那么就带来了额外的工作, 就是要转换输入框的type属性, 在我测试中貌似有兼容问题, 有的浏览器不能修改这个属性. <br/>于是想到另外一个解决方案 —— 背景图, 就是把提示文本做成背景, 通过控制输入框的样式来实现提示的显示与隐藏:<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/html.gif" style="margin:0px 2px -3px 0px"> HTML代码</div><div class="UBBContent"><TEXTAREA rows="8" id="temp28596">
<script type=&#34;text/javascript&#34;>
function setbg(obj, cname){
  if(obj.value != ''){
    obj.className = '';
  }else{
    obj.className = cname;
  }
}
</script>
<style type=&#34;text/css&#34;>
input {
  font: 12px &#34;Courier New&#34;, Courier, monospace;
  border: 1px solid #666666;
  padding: 3px;
  height: 23px;
}
.un_bg {
  background: url(/upload/2008-08-26/input_background.png) no-repeat 0px 0px;
}
.pw_bg {
  background: url(/upload/2008-08-26/input_background.png) no-repeat 0px -30px;
}
</style>
<form>
    <p>
        <input type=&#34;text&#34; class=&#34;un_bg&#34; onfocus=&#34;setbg(this, '');&#34; onblur=&#34;setbg(this, 'un_bg');&#34; />
    </p>
    <p>
        <input type=&#34;password&#34; class=&#34;pw_bg&#34; onfocus=&#34;setbg(this, '');&#34; onblur=&#34;setbg(this, 'pw_bg');&#34; />
    </p>
</form>
</TEXTAREA><br/><INPUT onclick="runEx('temp28596')"  type="button" value="运行此代码"/> <INPUT onclick="doCopy('temp28596')"  type="button" value="复制此代码"/><br/> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</div></div><br/><br/>扩展一下, 获得更好的效果<br/><br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/html.gif" style="margin:0px 2px -3px 0px"> HTML代码</div><div class="UBBContent"><TEXTAREA rows="8" id="temp20310">
<script type=&#34;text/javascript&#34;>
function setbg(obj, cname, isfocus){
  if(obj.value != ''){
    obj.className = isfocus?'fc_bg':'';
  }else{
    obj.className = cname;
  }
}
</script>
<style type=&#34;text/css&#34;>
input {
  font: 12px &#34;Courier New&#34;, Courier, monospace;
  border: 1px solid #666666;
  padding: 3px;
  height: 23px;
}
.un_bg {
  background: url(/upload/2008-08-26/input_background.png) no-repeat 0px 0px;
}
.pw_bg {
  background: url(/upload/2008-08-26/input_background.png) no-repeat 0px -30px;
}
.fc_bg {
  background: url(/upload/2008-08-26/input_background.png) repeat-x 0px -60px;
}
</style>
<form>
    <p>
        <input type=&#34;text&#34; class=&#34;un_bg&#34; onfocus=&#34;setbg(this, 'fc_bg', 1);&#34; onblur=&#34;setbg(this, 'un_bg', 0);&#34; />
    </p>
    <p>
        <input type=&#34;password&#34; class=&#34;pw_bg&#34; onfocus=&#34;setbg(this, 'fc_bg', 1);&#34; onblur=&#34;setbg(this, 'pw_bg', 0);&#34; />
    </p>
</form>
</TEXTAREA><br/><INPUT onclick="runEx('temp20310')"  type="button" value="运行此代码"/> <INPUT onclick="doCopy('temp20310')"  type="button" value="复制此代码"/><br/> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]</div></div>]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=48</link>
			<title><![CDATA[PHPMYADMIN安装教程[phpMyAdmin-2.11.8.1-all-languages-]]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[PHP+Apache+MySql]]></category>
			<pubDate>Thu,14 Aug 2008 15:19:59 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=48</guid>	
		<description><![CDATA[1.先到网上下载phpmyadmin，再解压到可以访问的web目录下（如果是虚拟空间，可以解压后通过ftp等上传到web目录下），当然您可以修改解压后该文件的名称。<br/><br/>2.配置config文件<br/>&nbsp;&nbsp;打开libraries下的config.default.php文件，依次找到下面各项，按照说明配置即可：<br/>A.访问网址<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/quote.gif" style="margin:0px 2px -3px 0px" alt="引用内容"/> 引用内容</div><div class="UBBContent">$cfg[&#39;PmaAbsoluteUri&#39;] = &#39;&#39;;这里填写phpmyadmin的访问网址</div></div><br/>B.mysql主机信息<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/quote.gif" style="margin:0px 2px -3px 0px" alt="引用内容"/> 引用内容</div><div class="UBBContent">$cfg[&#39;Servers&#39;][$i][&#39;host&#39;] = &#39;localhost&#39;; // MySQL hostname o&#114; IP address<br/>&nbsp;&nbsp;&nbsp;&nbsp;填写localhost或mysql所在服务器的ip地址，如果mysql和该phpmyadmin在同一服务器，则按默认localhost<br/>&nbsp;&nbsp;&nbsp;&nbsp;$cfg[&#39;Servers&#39;][$i][&#39;port&#39;] = &#39;&#39;; // MySQL port - leave blank for default port<br/>&nbsp;&nbsp;&nbsp;&nbsp;mysql端口，如果是默认3306，保留为空即可<br/></div></div><br/>C.mysql用户名和密码<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/quote.gif" style="margin:0px 2px -3px 0px" alt="引用内容"/> 引用内容</div><div class="UBBContent">$cfg[&#39;Servers&#39;][$i][&#39;user&#39;] = &#39;root&#39;; // MySQL user 访问phpmyadmin使用的mysql用户名<br/>&nbsp;&nbsp;&nbsp;&nbsp;fg[&#39;Servers&#39;][$i][&#39;password&#39;] = &#39;&#39;; // MySQL password (only needed对应上述mysql用户名的密码<br/></div></div><br/>D.认证方法<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/quote.gif" style="margin:0px 2px -3px 0px" alt="引用内容"/> 引用内容</div><div class="UBBContent">$cfg[&#39;Servers&#39;][$i][&#39;auth_type&#39;] = &#39;cookie&#39;;</div></div><br/>在此有四种模式可供选择，cookie，http，HTTP，config<br/>&nbsp;&nbsp; config方式即输入phpmyadmin的访问网址即可直接进入，无需输入用户名和密码，是不安全的，不推荐使用。<br/>&nbsp;&nbsp; 当该项设置为cookie，http或HTTP时，登录phpmyadmin需要数据用户名和密码进行验证，,具体如下：<br/>&nbsp;&nbsp; PHP安装模式为Apache，可以使用http和cookie；<br/>&nbsp;&nbsp; PHP安装模式为CGI，可以使用cookie<br/><br/>E.短语密码(blowfish_secret)的设置<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/quote.gif" style="margin:0px 2px -3px 0px" alt="引用内容"/> 引用内容</div><div class="UBBContent">$cfg[&#39;blowfish_secret&#39;] = &#39;&#39;;</div></div><br/>如果认证方法设置为cookie，就需要设置短语密码，置于设置为什么密码，由您自己决定，但是不能留空，否则会在登录phpmyadmin时提示错误好了，到此为止，您已经成功安装了phpmyadmin，简单吧 ，赶快登录体验下吧<br/>]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=47</link>
			<title><![CDATA[一个电脑白痴和黑客的对话(转载)]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[IT-NET]]></category>
			<pubDate>Thu,14 Aug 2008 09:32:42 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=47</guid>	
		<description><![CDATA[闲的无聊呵呵：）<br/><br/>黑客：我控制了你的电脑&nbsp;&nbsp;<br/>小白：怎么控制的？&nbsp;&nbsp;<br/>黑客：用木马&nbsp;&nbsp;<br/>小白：。。。。。。在哪里？我没看不见&nbsp;&nbsp;<br/>黑客：打开你的任务管理器&nbsp;&nbsp;<br/>小白：。。。。。。。任务管理器在哪？&nbsp;&nbsp;<br/>黑客：。。。。。你的电脑下面！！&nbsp;&nbsp;<br/>小白：&#34;我的电脑&#34;里面没有啊&nbsp;&nbsp;<br/>黑客：算了，当我什么也没做过&nbsp;&nbsp;<br/><br/><br/>黑客：我已经控制了你的电脑&nbsp;&nbsp;<br/>小白：哦&nbsp;&nbsp;<br/>黑客：害怕了吧？！嘿嘿&nbsp;&nbsp;<br/>小白：来的正好，帮我杀杀毒吧，最近我的机子毛病很多耶&nbsp;&nbsp;<br/>黑客：。。。。。。&nbsp;&nbsp;<br/><br/><br/>小白：你怎么总是在我电脑里随便进进出出&nbsp;&nbsp;<br/>黑客：你可以装防火墙&nbsp;&nbsp;<br/>小白：装防火墙，你就不能进入了吗？&nbsp;&nbsp;<br/>黑客：不啊，我只是想增加点趣味性，这样控制你的电脑让我觉得很白痴耶&nbsp;&nbsp;<br/><br/><br/>小白：听说你会制造&#34;病毒&#34;？！&nbsp;&nbsp;<br/>黑客：嗯&nbsp;&nbsp;<br/>小白：你可以控制别人的电脑？！&nbsp;&nbsp;<br/>黑客：一般是的&nbsp;&nbsp;<br/>小白：那你可以黑掉那些网站吗？&nbsp;&nbsp;<br/>黑客：当然，没听到人家叫我&#34;黑客&#34;吗？&nbsp;&nbsp;<br/>小白：。。。。哦~~~`我还以为那是因为你长得很黑。。。。。&nbsp;&nbsp;<br/>&#34;咣~~&#34;&nbsp;&nbsp;<br/><br/><br/>黑客：我又来了！！&nbsp;&nbsp;<br/>小白：你天天进来，不觉得很烦吗？&nbsp;&nbsp;<br/>黑客：是很烦，你的机子是我见过的最烂的一台了&nbsp;&nbsp;<br/>小白：不是吧，这可是名牌&nbsp;&nbsp;<br/>黑客：我是说你的机子里除了弱智游戏就只有病毒了&nbsp;&nbsp;<br/>小白：哦~~那你看到我的&#34;连连看&#34;了吗，不记得装在哪，找了好久了耶&nbsp;&nbsp;<br/>黑客：。。。。。再见&nbsp;&nbsp;<br/><br/><br/>黑客：嗨~~~我来了！&nbsp;&nbsp;<br/>小白：好几天不见你，被我的防火墙挡住啦？&nbsp;&nbsp;<br/>黑客：哈哈，笑话，上你的机子比我自己的还容易，不是想我了吧&nbsp;&nbsp;<br/>小白：我是想请你帮一个忙 <br/>黑客：什么事？&nbsp;&nbsp;<br/>小白：你能不能进入电力系统修改一点数据&nbsp;&nbsp;<br/>黑客：。。。。。。你想干嘛！！&nbsp;&nbsp;<br/>小白：求求你，帮我把我家这个月的电费消了吧。。。。。。&nbsp;&nbsp;<br/>黑客：去死！！&nbsp;&nbsp;<br/><br/><br/>黑客：你死哪去了？！！！&nbsp;&nbsp;<br/>小白：。。。。出去玩了几天啊，找我干嘛&nbsp;&nbsp;<br/>黑客：我要找点东西&nbsp;&nbsp;<br/>小白：在我这儿找什么东西？&nbsp;&nbsp;<br/>黑客：病毒，找一条前几年的老病毒，只有你的机子上病毒保存的最全啦&nbsp;&nbsp;<br/><br/><br/>黑客：我来了！！&nbsp;&nbsp;<br/>。。。。。。&nbsp;&nbsp;<br/>黑客：怎么不说话？&nbsp;&nbsp;<br/>小白：心情不好&nbsp;&nbsp;<br/>黑客：谁欺负你了？&nbsp;&nbsp;<br/>小白：我的一个q号搞丢了，里面有我的网上初恋&nbsp;&nbsp;<br/>黑客：这个简单，我帮你拿回来&nbsp;&nbsp;<br/>小白：拿不回来了&nbsp;&nbsp;<br/>黑客：不可能，告诉我，多少号？&nbsp;&nbsp;<br/>小白：呜~~~~就是不记得了&nbsp;&nbsp;<br/><br/><br/>小白：你给我出来！！！！&nbsp;&nbsp;<br/>黑客：怎么啦？！&nbsp;&nbsp;<br/>小白：你是不是用我的id去论坛玩了？！！&nbsp;&nbsp;<br/>黑客：。。。。不好意思，忘了告诉你了，不过，我没干坏事，就瞎编了个贴子，我保证下次再也不玩了&nbsp;&nbsp;<br/>小白：那不行！！！&nbsp;&nbsp;<br/>黑客：你还要怎么样？&nbsp;&nbsp;<br/>小白：你发的贴子得红脸了耶，我第一次得红脸，好开心哦，你必须再给我编一个&nbsp;&nbsp;<br/>黑客：倒！&nbsp;&nbsp;<br/><br/><br/>黑客：嘿嘿，刚才我做了一件很有趣的事&nbsp;&nbsp;<br/>小白：什么事&nbsp;&nbsp;<br/>黑客：我到论坛上去顶贴了&nbsp;&nbsp;<br/>小白：这很平常啊&nbsp;&nbsp;<br/>黑客：我见贴就顶，尽情的骂楼主是猪，好解气&nbsp;&nbsp;<br/>小白：哇塞，太过瘾了，我可从来不敢，会被封杀的！&nbsp;&nbsp;<br/>黑客：没错，已经被封杀了。&nbsp;&nbsp;<br/>小白：这还有趣？！&nbsp;&nbsp;<br/>黑客：是啊，因为我用的是你的id&nbsp;&nbsp;<br/><br/><br/>小白：你是高手吗？ <br/>黑客：可以说是吧。&nbsp;&nbsp;<br/>小白：高到什么程度？&nbsp;&nbsp;<br/>黑客：嗯，我无聊的时候就自己黑自己&nbsp;&nbsp;<br/>小白：哈，这个我也会！&nbsp;&nbsp;<br/>黑客：#￥%！你也可以？！&nbsp;&nbsp;<br/>小白：是啊，一关机它就黑了。。。。。&nbsp;&nbsp;<br/>黑客：滚开........！]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=46</link>
			<title><![CDATA[郁闷的CSS文件编码[UTF-8 、 ANSI] CSS无法被应用]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[XHTML+CSS]]></category>
			<pubDate>Thu,24 Jul 2008 12:15:51 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=46</guid>	
		<description><![CDATA[昨天写了个页面在FF、IE7、Opera下显示正常&nbsp;&nbsp;IE6却不能正常显示样式，今天才发现不晓得啥时候那个文件编码被更改了，整站所有页面用的是UTF-8，但那个文件不晓得啥时候成了ANSI，郁闷啊，IE6我...... 无语。]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=45</link>
			<title><![CDATA[烦人的GRUB]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[硬件杂谈]]></category>
			<pubDate>Sat,12 Jul 2008 13:43:35 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=45</guid>	
		<description><![CDATA[今天把电脑从linux恢复为xp的时候无法引导系统了，GHOST 格式化....全部无效&nbsp;&nbsp;最终使用windows启动盘，在命令行下输入 fdisk /mbr&nbsp;&nbsp;一切KO！]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=44</link>
			<title><![CDATA[photoshop无法启动-卡在读取首选项处]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[软件]]></category>
			<pubDate>Tue,24 Jun 2008 22:15:26 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=44</guid>	
		<description><![CDATA[今天打开PS的时候卡在读取首选项处，重装修复均无效，测试了多种方法，还原回默认的设置 <br/>即可，方法：同时按住Shift+Alt+Ctrl这三个键,右键打开PHOTOSHOP, 弹出对话框，是否删除PS设置文件，确定即可。]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=43</link>
			<title><![CDATA[Three Year Ache]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[o(∩_∩)o... life]]></category>
			<pubDate>Sun,22 Jun 2008 14:04:21 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=43</guid>	
		<description><![CDATA[今天又做了同样类似的梦，还是那样的无助。从毕业到现在已经过去3年的时间了，心中的痛也同样保留了3年，到现在发现自己还和以前一样，一点都没有长大。也许注定了这就是我的人生。不知道这样的梦要持续到什么时候。<br/>&nbsp;&nbsp;&nbsp;&nbsp;现实、梦想==还都是那么的遥远。<br/>&nbsp;&nbsp;&nbsp;&nbsp;这7年中有一半时间是在回忆中度过。我终于明白快乐是要付出代价的，只不过这个代价太过于昂贵。<br/>&nbsp;&nbsp;&nbsp;&nbsp;心已封存好久，何时开始何时继续.......<br/>&nbsp;&nbsp;&nbsp;&nbsp; 人们常说时间可以改变一切，但我明白有些东西是无法用时间改变的。<br/>&nbsp;&nbsp; 生活还要继续，梦想同样伴随，“梦”何时才能停止。]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=42</link>
			<title><![CDATA[悲痛...不能忘记的日子]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[o(∩_∩)o... life]]></category>
			<pubDate>Fri,20 Jun 2008 23:34:41 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=42</guid>	
		<description><![CDATA[&nbsp;&nbsp; 伤心时刻，今天在DOS下误操作分区把一个320G的盘内容搞没了，几年前丢过一次40G的东东，以后一定要多备份，本准备今天刻盘的......郁闷。伤心。已经无法用语言表达了。<br/>EC到EI 整整320G的东东全空<br/><img src="http://www.7crystal.com/blog//upload/2008-06-20/myQDQ.jpg" border="0" alt=""/><br/>还好大部分都是电影..................... <img src="http://www.7crystal.com/blog/images/smilies/Face_11.gif" border="0" style="margin:0px 0px -2px 0px" alt=""/>]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=41</link>
			<title><![CDATA[用户应尽快将Flash Player升级到9.0.124]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[IT-NET]]></category>
			<pubDate>Wed,04 Jun 2008 14:11:53 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=41</guid>	
		<description><![CDATA[来源：cnbeta　<br/><br/>　　我取到了一份swf格式的exploits，测试了一下在Flash Player 9 .0.115的结果。<br/><br/>　　Adobe Flash Player 9 .0.115 在播放恶意构造的swf时，会自动下载一个可执行文件并执行，而我拿到的这个swf文件会自动下载一个downloader并运行，然后再由这个downloader下载其他预先指定的木马程序，相当的危险。<br/><br/>　　这个漏洞出现在Adobe Flash Player 9 .0.115和更早版本，其实早在4月8号，Adobe已经放出了9.0.124的版本更新，也发布了安全公告。问题相当严重，所以务必请赶紧更新到9.0.124版本。<br/><br/>&nbsp;&nbsp;&nbsp;&nbsp;下面是我实际运行的截图，执行了downloader后先后下载了0.exe 到 20.exe一共21的木马程序。downloader还会不断的检测taskmgr.exe、procexp.exe等进程管理程序，发现后立即杀掉管理工具。一旦中招相当麻烦。我尝试将procexp.exe改名后可以运行起来。<br/><img src="http://www.7crystal.com/blog//upload/2008-06-04/player1.png" border="0" alt=""/><br/>&nbsp;&nbsp;&nbsp;&nbsp; Nod32可以检测到下载的木马程序。<br/><img src="http://www.7crystal.com/blog//upload/2008-06-04/player2.png" border="0" alt=""/><br/><br/>PS：其中使用Flash 8 Professional的开发工具也存相关问题。版本需要升级到8.0.42.0，AIR 的版本需要到1.01<br/><br/>　　能做些什么?<br/><br/>　　1.请在网页Object标签中的codebase修改需要version=9,0,124,0<br/><br/>　　2.在js引入方式中修改requiredMajorVersion和requiredRevision为相应版本，swfobject也是一样修改。<br/><br/><a target="_blank" href="http://www.macromedia.com/software/flash/about/">官方下载地址</a><br/><br/><a target="_blank" href="http://www.7crystal.com/blog//upload/2008-06-04/install_flash_player_active_x.rar">本站flash_player_ie</a><br/><a target="_blank" href="http://www.7crystal.com/blog//upload/2008-06-04/install_flash_player.rar">本站flash_player_fox和其他浏览器</a><br/><br/>]]></description>
		</item>
		
			<item>
			<link>http://www.7crystal.com/blog/default.asp?id=40</link>
			<title><![CDATA[提高网页效率的14条准则[转载]]]></title>
			<author>7crystal@7crystal.com(七彩Crystal)</author>
			<category><![CDATA[SEO]]></category>
			<pubDate>Wed,14 May 2008 17:13:42 +0800</pubDate>
			<guid>http://www.7crystal.com/blog/default.asp?id=40</guid>	
		<description><![CDATA[<strong><span style="font-size:18pt"><span style="color:Red">网站最基本的东西是什么？</span></span></strong><br/>&nbsp;&nbsp;&nbsp;&nbsp;——内容？SEO（搜索引擎优化）？UE（用户体验）？都不对！是速度！内容再丰富的网站，如果慢到无法访问也是毫无意义的； SEO做的再好的网站，如果搜索蜘蛛抓不到也是白搭； UE设计的再人性化的网站，如果用户连看都看不到也是空谈。<br/>所以网页的效率绝对是最值得关注的方面。如何才能提高一个网页的效率呢？Steve Souders(Steve Souders的资料<a target="_blank" href="http://www.oreillynet.com/pub/au/2951">http://www.oreillynet.com/pub/au/2951</a>)提出的提高网页效率的14条准则，而这些准则也将是我们下篇中介绍到的YSlow工具的理论基础：<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Make Fewer HTTP Requests<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Use a Content Delivery Network<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Add an Expires Header<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Gzip Components<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Put CSS at the Top<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Move Scripts to the Bottom<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Avoid CSS Expressions<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Make JavaScript and CSS External<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Reduce DNS Lookups<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Minify JavaScript<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Avoid Redirects<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Remove Duplicate Scripts<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Configure ETags<br/>&nbsp;&nbsp;&nbsp;&nbsp;* Make Ajax Cacheable<br/>这里我们将逐一的讲解这些准则,对其中开发者密切相关的准则我将详细讲解。小弟个人技术实在有限，错误和无知在所难免，还请高人指点。<br/><span style="color:Red"><strong>第一条：Make Fewer HTTP Requests 尽可能的减少HTTP的Request请求数。</strong></span><br/>&nbsp;&nbsp;&nbsp;&nbsp;80%的用户响应时间都是浪费在前端。而这些时间主要又是因为下载图片、样式表、JavaScript脚本、flash等文件造成的。减少这些资源文件的Request请求数将是提高网页显示效率的重点。<br/>这里好像有个矛盾，就是如果我减少了很多的图片，样式，脚本或者flash，那么网页岂不是光秃秃的，那多难看呢？其实这是一个误解。我们只是说尽量的减少，并没有说完全不能使用。减少这些文件的Request请求数，当然也有一些技巧和建议的：<br/>1：用一个大图片代替多个小图片。<br/>这的确有点颠覆传统的思维了。以前我们一直以为多个小图片的下载速度之和会小于一个大图片的下载速度。但是现在利用httpwatch工具的对多个页面进行分析后的结果表明事实并不是这样。<br/>第一张图是一个大小为40528bytes的337*191px的大图片的分析结果。<br/>第二张图是一个大小为13883bytes的280*90px的小图片的分析结果。<br/><img src="http://www.7crystal.com/blog//upload/2008-05-14/7crystal_com_httpwatch01.jpg" border="0" alt=""/><br/><span style="color:Beige">一个大小为40528bytes的337*191px的大图片的分析结果（点击图片可以查看完整大图片）</span><br/><img src="http://www.7crystal.com/blog//upload/2008-05-14/7crystal_com_httpwatch02.jpg" border="0" alt=""/><br/><span style="color:Beige">一个大小为13883bytes的280*90px的小图片的分析结果（点击图片可以查看完整大图片）</span><br/>第一张大图片花费时间为：<br/>Blocked：13.034s<br/>Send：0.001s<br/>Wait：0.163s<br/>Receive：4.596s<br/>TTFB：0.164s<br/>NetWork：4.760s<br/>功耗时：17.795s<br/>真正用于传输大文件花费的时间为Reveive时间，即4.596s，多数的时间是用来检索缓存和确定链接是否有效的Blocked时间，供花费13.034s，占总时间的73.2%。<br/><br/>第二张小图片花费时间为：<br/>Blocked：16.274s<br/>Send：小于0.001s<br/>Wait：0.117s<br/>Receive：0.397s<br/>TTFB：0.118s<br/>NetWork：0.516s<br/>功耗时：16.790s<br/>真正用于传输文件的花费时间是Reveive时间，即0.397s，这的确要比刚才大文件的4.596s小很多。但是他的Blocked时间为16.274s，占总时间的97%。<br/>如果这些数据还不够说服你的话，让我们看看下面这张图。这里列出了某个网页中所有图片中的花费时间示意图。当然，里面的图片有大有小，规格不一。<br/><img src="http://www.7crystal.com/blog//upload/2008-05-14/7crystal_com_httpwatch03.jpg" border="0" alt=""/><br/><span style="color:Teal">大约80%以上的时间是用来检索缓存和确定链接是否有效的Blocked时间。</span><br/>其中藏青色的为传输文件花费的Reveive时间，而前面白色的为检索缓存和确认链接是否有效的Blocked时间。铁一样的事实告诉我们：<br/><br/>&nbsp;&nbsp;&nbsp;&nbsp;* 大文件和小文件下载所需时间的确是不同的，差异的绝对值不大。而且下载所需时间占总耗费时间比例很小。<br/>&nbsp;&nbsp;&nbsp;&nbsp;* 大约80%以上的时间是用来检索缓存和确定链接是否有效的Blocked时间。无论文件大小，这个时间的花费大致是相同的。而且所占总耗费时间的比例是极大的。<br/>&nbsp;&nbsp;&nbsp;&nbsp;* 一个100k的大图片总耗费时间绝对大于4个25k的小图片的总耗费时间。而且主要差别就是4个小图片的Blocked时间绝对大于1个大图片的Blocked时间。<br/><br/>所以如果可能还是使用大图片来替代过多的琐碎的小图片吧。这也是为什么翻转门的效率要高于图片替换实现的滑动门的原因。<br/>但是，请注意：也不能用太大的单张图片，因为那样会影响到用户体验。例如个几兆的背景图片的使用绝对不是一个好主意。<br/>2：合并你的css文件。<br/>合并,合并示意图<br/>图:合并与融合<br/>我以前犯了一个错误，你在看我《样式表的组织与规划》的系列文章中会知道。当时，我为了方便组织和规划样式表，将用于不同用途的样式表文件分离开来，形成不同的css文件。然后在页面中根据需要引用多个css文件。根据“尽可能的减少HTTP的Request请求数”准则我们知道，那样的确是不合理的，因为那样会产生更多的HTTP的Request请求数。从而降低网页的效率。所以，从提高网页效率的角度上而言，我们还是应该将所有的css写在同一个 css文件中。但是问题又来了。那么怎么来很好的组织和规划样式表呢？这的确是个矛盾。我现在的做法是采用两套版本。编辑版和发布版。编辑版仍然使用多个 css文件以便于规划和组织。而等到发布的时候，再将多个css文件合并到一个文件中去，从而达到减少HTTPRequest请求数的目的。<br/>3：合并你的javascript文件。<br/>原因和处理方法同上，不再赘言。<br/><span style="color:Red"><strong>第二条：Use a Content Delivery Network 使用CDN</strong></span><br/>这个看上去好像很深奥的样子，但是只要结合中国的网络特色，这个便不难理解了。“北方服务器”、“南方服务器”、“电信服务器”、“网通服务器”……这些词听起来是那么熟悉和压抑。如果，一个北京的电信用户试图从广东的网通服务器上打开一个类似《壁纸合集》帖子的网页时，你就能很深刻的理解。<br/>鉴于这个不是我们开发人员力所能及的准则，所以这里也就不多言了。<br/><img src="http://www.7crystal.com/blog//upload/2008-05-14/cdn.jpg" border="0" alt=""/><br/><span style="color:Red"><strong>第三条：Add an Expires Header 添加周期头</strong></span><br/><br/>这个也并非开发人员来控制，而是网站服务器管理员的职责。所以，如果作为开发人员的你不了解和明白也没有关系。还是把这个准则告诉公司的网站服务器管理员。<br/><span style="color:Red"><strong>第四条：Gzip Components 启用Gzip压缩</strong></span><br/><br/>这个大家应该比较熟悉。Gzip的思想就是把文件先在服务器端进行压缩，然后再传输。这对于体积较大的纯文字型的文件有特效。鉴于这也并非开发人员，而是网站服务器管理员的工作范畴，这里就不详细讲解了。如果你对此感兴趣，可以资讯贵公司的网站服务器管理人员。<br/><span style="color:Red"><strong>第五条：Put CSS at the Top 把CSS样式放在页面的上方。</strong></span><br/><br/>无论是HTML还是XHTML还是CSS都是解释型的语言，而非编译型的。所以CSS到上方的话，那么浏览器解析结构的时候，就已经可以对页面进行渲染。这样就不会出现，页面结构光秃秃的先出来，然后CSS渲染，页面又突然华丽起来，这样太具有“戏剧性”的页面浏览体验了。<br/><span style="color:Red"><strong>第六条：Move Scripts to the Bottom 将脚本放在底部</strong></span><br/><br/>原因同第五条一样。只是脚本一般是用来于用户交互的。所以如果页面还没有出来，用户连页面都不知道什么样子，那谈交互简直就是扯谈。所以，脚本和CSS正好相反，脚本应该放在页面的底部。<br/><span style="color:Red"><strong>第七条：Avoid CSS Expressions 避免使用CSS中的Expressions</strong></span><br/>首先有必要先说明一下CSS Expressions是什么一个东西。其实它就像其它语言中的if……else……语句。这样在CSS中就可以进行简单的逻辑判断了。举个简单的例子<br/><div class="UBBPanel"><div class="UBBTitle"><img src="http://www.7crystal.com/blog/images/code.gif" style="margin:0px 2px -3px 0px" alt="程序代码"/> 程序代码</div><div class="UBBContent"><br/>&lt;style&gt;input{background-color:e&#173;xpression((this.readOnly &amp;&amp; this.readOnly==true)?&#34;#0000ff&#34;:&#34;#ff0000&#34;)}<br/>&lt;/style&gt;<br/>&lt;INPUT TYPE=&#34;text&#34; NAME=&#34;&#34;&gt;<br/>&lt;INPUT TYPE=&#34;text&#34; NAME=&#34;&#34; readonly=&#34;true&#34;&gt;</div></div><br/><img src="http://www.7crystal.com/blog//upload/2008-05-14/Expressions.jpg" border="0" alt=""/><br/>这样css就可以根结一些情况分别使用不同的样式了。如果你对这个感兴趣可以到我的博客上阅读相关的文章—— 《CSS中的e&#173;xpression系列文章》。但是CSS中Expressions 的代价却是极高的。当你的页面需要根据判断来渲染效果的元素很多的时候，那么你的浏览器将长期处于假死状态，从而给用户带来极差的用户体验。<br/><span style="color:Red"><strong>第八条：Make JavaScript and CSS External 将javascript和css独立成外部文件</strong></span><br/><br/>这一条好像和第一条有点矛盾。的确，如果从HTTP的request请求数来讲的话，这样做的确是降低了效率。但是之所以这么做，是因为另外一个重要的考虑因素——缓存。因为外部的引用文件会被浏览器缓存，所以如果javascript和css体积较大的时候，我们将它们独立成外部文件。这样当用户只要浏览一次以后，这些体积较大的js和css文件就能被缓存起来，从而极高地提高用户再次访问时的效率。<br/><span style="color:Red"><strong>第九条：Reduce DNS Lookups&nbsp;&nbsp;减少DNS查询</strong></span><br/><br/>DNS域名解析系统。大家都知道我们之所以能记住那么多的网址，是因为我们记住的都是单词，而非<a href="http://202.153.125.45" target="_blank">http://202.153.125.45</a>这样的东西，而帮我们把那些单词和202.153.125.45这样的ip地址联系起来的就是DNS。那这一条对我们到底有什么真正意义上的指导意义呢？其实有两条：<br/>1：如果不是必须，请不要把网站放到两台服务器上。<br/>2：网页中的图片、css文件、js文件、flash文件等等，不要太多的分散在不同的网络空间中。这就是为什么那种只发一个网站中的壁纸图片的帖子，要比壁纸图片来源于不同网站的帖子显示要快得多的原因。<br/><span style="color:Red"><strong>第十条：Minify JavaScript and CSS&nbsp;&nbsp;减少JavaScript和CSS文件的体积</strong></span><br/><br/>这点很好理解。在你的最终发布版本中把没有必要的空行、空格和注释全部去掉。显然手工去处理效率太低，好在网上到处都是用于压缩这些东西的工具。压缩JavaScript代码体积的工具随处可见，我便不再列举了，这里我只提供一个用于压缩css代码体积的在线工具网站——<a href="http://www.cssdrive.com/index.php/main/csscompressor" target="_blank">http://www.cssdrive.com/index.php/main/csscompressor</a><br/>它提供了多种压缩方式，可以适应多种要求。<br/><span style="color:Red"><strong>第十一条：Avoid Redirects 避免跳转</strong></span><br/><br/>我只从网页开发人员的角度来解读此条。那么我们可以解读到什么东西呢？2点——<br/>1：“此域名已过期，5秒钟以后，页面将跳转到<a href="http://www.xxxxxx.com/index.html" target="_blank">http://www.xxxxxx.com/index.html</a>页面”，这句话看起来的确很熟悉。但是，我就奇怪了，为什么不直接链接到那个页面呢？<br/>2：一些链接地址请更明确的写出来。例如:将<a href="http://justinyoung.cnblogs.com/" target="_blank">http://justinyoung.cnblogs.com/</a> 写成<a href="http://justinyoung.cnblogs.com" target="_blank">http://justinyoung.cnblogs.com</a> （注意最后面一个“/”符号）。的确，这两个网址都能访问到我的博客，但是，事实上，它们是有区别的。<a href="http://justinyoung.cnblogs.com" target="_blank">http://justinyoung.cnblogs.com</a> 的结果是个301响应，它会被重新指向<a href="http://justinyoung.cnblogs.com/" target="_blank">http://justinyoung.cnblogs.com/</a> 。但是显然，中间多浪费了一些时间。<br/><span style="color:Red"><strong>第十二条 Remove Duplicate Scripts 移除重复的脚本</strong></span><br/>对重复说不<br/>这个准则的道理很浅显，但是真正在工作中，很多人却因为“项目时间紧”、“太累了”、“初期没有规划好”……这样的理由搪塞过去了。你，的确可以找很多的理由不去处理这些多余重复的脚本代码，如果你的网站不需要更高的效率和后期维护的话。<br/>也正是这点，我提醒大家一些，一些javascript框架、javascript包一定要慎用。至少要问一下：用了这个js kit 到底给我们多少方便，提高了多少工作效率。然后，再与它因为多余的、重复的代码带来的负面效果比较一下。<br/><span style="color:Red"><strong>第十三条：Configure ETags 配置你的实体标签</strong></span><br/><br/>首先来讲讲什么是Etag吧。Etag（Entity tags ）实体标签。这个tag和你在网上经常看到的标签云那种tag有点区别。这个Etag不是给用户用的，而是给浏览器缓存用的。Etag是服务器告诉浏览器缓存，缓存中的内容是否已经发生变化的一种机制。通过Etag，浏览器就可以知道现在的缓存中的内容是不是最新的，需不需要重新从服务器上重新下载。这和 “Last-Modified”的概念有点类似。很遗憾作为网页开发人员对此无能为力。他依然是网站服务器人员的工作范畴。如果，你对此有兴趣，可以咨询贵公司的网站服务器管理员。<br/><span style="color:Red"><strong>第十四条：Make Ajax Cacheable 上面的准则也适用Ajax</strong></span><br/>现在的Ajax好像有点被神话了，好像网页只要Ajax了，那么就不存在效率问题了。其实这是一种误解。拙劣的使用Ajax不会让你的网页效率更高，反而会降低你的网页效率。Ajax的确是个好东西，但是请不要过分的神话它。使用Ajax的时候也要考虑上面的那些准则。<br/><br/>后记：<br/>当然，上面的这些也只是供你参考的理论上的准则。具体的情况还是要具体的去对待。理论和准则只是用来指导现实工作的，却是万万不可死记硬套。]]></description>
		</item>
		
</channel>
</rss>