存档

作者存档

如何让某页面元素最后加载

2009年8月13日 22 条评论

很多时候我们在自己的站添加了某一个第三方的代码,包括广告,流量统计等,如果对方服务器的速度过慢的话,同样也会影响到我们的网站页面打开速度。以广告代码为例,谷歌的广告代码速度很快,不会影响到我们,但是阿里妈妈或者部落客等代码恐怕有些时候就会给我们的网站速度带来一些影响,当然并不局限于广告代码。那么如何解决这样的问题呢?

方法就是控制加载顺序,先加载自己的网站主要代码,最后加载广告等代码。

实现方法很简单,第一步,把以下这段代码放在你要放置广告的网页位置,先显示“广告加载中……”的字样,你也可以用空白或图片替代。推荐一个ajax载入中图片在线生成网站 — http://ajaxload.info/

<div id=ad_blogger>广告载入中……</div>

第二步,把下面这段代码放到页面的底部,将广告代码加载到上面那个位置,取代原来的文字。

1
2
3
<div id="ad_kay" style="display:none">这里放js广告代码或者其它加载比较慢的广告代码</div>
<script type="text/javascript">document.getElementById("ad_blogger").innerHTML=document.getElementById("ad_kay").innerHTML;
</script>

OK,刷新看效果吧!

转载请注明:
转自:守望的麦子[http://www.wheatime.com]
原文链接:http://www.wheatime.com/2009/08/how-to-make-the-final-element-of-a-page-to-load.html

分类: 技 术 标签: ,

试用Gmail的新功能

2009年8月12日 20 条评论

以前一直在使用IE6浏览器,Gmail的很多新功能都使用不了,最近换上IE7试了下打开Gmail的设置菜单,看到了里面新增加的诸多功能:

(查看Gmail新增功能信息 http://mail.google.com/mail/help/intl/zh-CN/about_whatsnew.html

设置菜单里多了小工具、实验室、多个收件箱、离线版、背景主题控制选项。

打开小工具:

实验室选项里面可用的非常多,但是要注意因为是试验性功能,所以这些功能可能会随时发生变化、无法使用或者消失。

多个收件箱可以让我们在同一界面按照不同分类显示邮件:

离线版可以让我们在无法连接到互联网的情况下查看存储在本地的邮件,windows用户要求安装.net frame和google gears:

背景主题让你的Gmail多姿多彩,可以自定义颜色设置:

超级星标:

邮件随机签名:

累了?散步休息一会……

分类: 随 笔 标签:

两个让你的WP更快的插件

2009年8月11日 34 条评论

对WP进行优化,可以节省我们的流量,更重要的是让你的WP打开速度更快!网络上提供了很多对WP进行优化的方法,大多数是手动更改你的WP文件代码,包括CSS,JS文件等,照此方法优化压缩后的文件的确会减小,但是同时也破坏了文件本身的可读性,不利于日后的修改维护。今天推荐的2个WP插件不会更改WP本身及主题文件,却同样可以达到优化压缩的效果。

1.gzippy 插件

对于懒人或者菜菜们来说这可是个超级首选,插件解压后也不足2K,可谓短小精悍,且上传安装之后也无需另外设置,很方便实用。

下载地址:http://wordpress.org/extend/plugins/gzippy/

2. Autoptimize 特别推荐
下载地址:http://downloads.wordpress.org/plugin/autoptimize.0.8.zip

讲一下其工作原理:通过优化HTML代码(去除不必要的空格、换行、注释)、CSS代码JS代码,缓存起来,然后访问的时候输出,访客访问到的是经过优化后的代码,很大程度上节省了流量,同时作者推荐和 WP Super Cache 插件一起使用。Showfom 小帅锅的建议是,流量不足3000IP之前不用考虑 WP Super Cache,使用 Autoptimize 进行代码优化以后然后gzip输出之,就很完美了。

安装时不需要更改任何系统文件,上传,激活,设置即可使用。

注意事项:
1.假如样式出错,就不要选择优化 CSS 代码,只能采取自己手动优化的方法了;同样,假如功能出错,也请关闭 JS 优化功能。
2.一般情况下,优化 HTML 代码是不会出错的,原理只是删除了多余的空格、空行和注释而已,假如出错,请自行检查不该优化的代码并且写入 JS
3.Autoptimize 的原理只是前台进行优化,后台编辑主题里的代码不用修改。

附使用Autoptimize优化WP前后代码片段截图:

优化前:

优化后:

看起来感觉很杂乱,但是显示出来的效果并没有任何差异。至于这样做究竟会不会有效果,我们看一下 Google百度 等这些超大流量的网站代码就清楚了。

分类: wordpress 标签: ,

CSS中背景图片定位方法

2009年8月10日 14 条评论

越来越多的网站开始将多个图标放在一个图片里,这样做的好处一是减少与服务器的连接次数,二是可以让部分未用到的图片预先加载;最大的缺点就是图片难以定位了,不过如果你的图片规则,排列的井然有序,这个缺点也就不存在了。

在CSS中,背景图片的定位方位有3种:

1)关键字:background-position: top right;
2)像素:background-position: 0px 0px;
3)百分比:background-position: 0% 0%;

上面这三句语句,都将图片定位在背景的左上角,表面上看效果是一样的,实际上第三种定位机制与前两种完全不同。

前两种定位,都是将背景图片左上角的原点,放置在规定的位置。请看下面这张图,规定的位置是“20px 10px”和"60px 50px",都是图片的原点在那个位置上,图中用X表示。

但是第三种定位,也就是百分比定位,不是这样。它的放置规则是,图片本身(x%,y%)的那个点,与背景区域的(x%,y%)的那个点重合。比如,如果放置位置是“20% 10%”,实际结果如下图,可以看到这个点是在图片本身的“20% 10%”的位置上。

下面是一个有趣的例子。

背景图片是四个边长为100px的方块叠在一起:

请问怎样才能将其横过来:

答案是,在网页中先设置四个div区域:

<div>
</div>

<div">
</div>

<div>
</div>

<div>
</div>

然后,这样编写CSS:

.box1, .box2, .box3, .box4 {
float:left;
width:100px;
height:100px;
position:relative;
background: #F3F2E2 url(1234.png) no-repeat;
}

.box1 {
background-position:0% 0%;
}

.box2 {
background-position:0% 33.33333%;
}

.box3 {
background-position:0% 66.66666%;
}

.box4 {
background-position:0% 100%;
}

点击这里查看最后的效果。可以看到第二和第三个方块的设置,并不是一般想象中的“0% 25%”和“0% 75%”。

不过说实话,这个例子用像素设置法更容易一些。使用百分比设置的主要优势在于,当页面缩放的时候,背景图片也会跟着一起缩放,具体请参考下面“延伸阅读”中的第二篇文章。

[延伸阅读]

1. CSS: Using Percentages in Background-Image

2. Creating Liquid Faux Columns

3.为什么将多个图片放在一个图标里?

分类: 分 享 标签: ,

暂不升级

2009年8月8日 22 条评论

主题已经用了快1年了,每次登陆后台都可以看到提示升级主题,刚才看见 iNove 已经被 MG12 升级到1.4.6了!我用的是最初的1.0版本……对主题的升级和更改我会很谨慎,每次 MG12 有新的动作我都会去看他的CHANGELOG,然后对于较大的变动我会结合他的日志去手动做相应的更改,步入1.4以来,关于 iNove 的更新好多都是在优化小细节和整合一些功能。可以说 iNove 写的非常漂亮,感谢 MG12 对 iNove 做出的努力……

对于最新版本的一些功能和细节问题已经在自己的主题上改动了,暂时不会对主题进行全面升级,等到1.5吧……

分类: 随 笔 标签: , , ,

有些东西还是要亲身去试的

2009年8月7日 21 条评论

终于做了一个决定,换成IE 7.0,虽然我们有许多选择可以取代IE 7.0,可以使用 Chrom,Opera... 虽然很多人在埋怨IE 7.0太耗内存、选项卡不好用等等,但是我还是决定升级了……放着IE 6在总是不自觉的点开使用,昨天晚上使用IE 6打开几个网站,竟然出现假死现象,更有几个网站贴出了类似 Youtube 那样的公告 — 不再支持 IE 6,请升级您的浏览器!

看了 mg12 的文章后,更是深有同感,换!

换成IE 7.0后,在选项卡内随便打开3个页面,跟以前IE 6相比大约多出5M内存,使用起来感觉一切良好!访问守望的麦子在速度上甚至比以前更快,浏览起来更流畅一些! :smile: 看来并不像网友说的那么差啊!而且占用内存方面根据我自己的测试也并没有像那些知名网站给出的评测结果那么差!

看来有些东西还是要亲身去试的,就像你要亲自去试你的鞋子一样,有时候,保持现状固然好;但也有很多时候,迈出一步,你会得到意想不到的东西……

分类: 随 笔 标签: ,

校内更名?

2009年8月6日 10 条评论

今天上校内时,在首页看到了“校内正式更名”的通告,从名字就可以知道以后的用户群体将由大学生扩展到全体网民。由原来的5Q到今天的校内,再到未来的人人……眼瞅着一个品牌树立起来,然后亲手打破!实在佩服千橡集团的“魄力”……我们看看官方对此次更名的解释:

为了给校内带来一个更长远、广阔的发展前景,我们需要割舍对校内品牌的依恋之情,去积极的、勇敢的创造一个更伟大、更具延展性的新品牌,一个广大用户心目中的至爱品牌。人人这个名称,正如“社会和谐人人有责,和谐社会人人共享”里所说的一样,是一个能够包容全体互联网用户,能够支撑起一个有社会责任感的、努力进取的WEB2.0公司长期健康的发展,同时有潜力成为一个为广大用户所尊敬和热爱的至爱品牌。

官方的解析归根结底一句话就是 — 去争取更广大的市场份额!同时我也觉得月光博客的说法更到位:

千橡从校内转化为人人,证明以学生为主的校内网已经被以公司白领为主的开心网彻底击败,从一定程度上证明了,以中国大学生为用户基础的商业网站很难成功,因为大学生虽然数量众多,但没有稳定的收入,也缺少消费能力和商业价值。

的确,蓦然回首,自05年12月成立,校内网已经在风风雨雨中走过了接近四年。从最初只拥有屈指可数的几所大学学生用户,到涵盖大学生、白领市场在内的WEB2.0沟通娱乐平台;从简单的日志、相册等基本功能,到即时通讯、开放平台……校内网带给我们太多的回忆……

伴随我走过大学匆匆的四年时光,毕业后,我们通过校内保持联系,每天在上面瞎侃,分享信息,大家一起开心农场…… :smile: 提起“校内”,我就会想起那些昔日的同学、我的朋友、我的大学生活……

未来的“人人”,又会带给我们一个怎样的网络和回忆呢? :idea:

附:“人人”新品牌标志的含义

新品牌标志由两个抽象的人字变形,人字成圈形寓意每个人的人际圈,同时两个人字中间发生交集,寓意人与人的沟通和交流,中间的红色象征着人与人之间的情感。文字部分拼音renren,同时也是网址renren.com。由图形和域名共同组合成的新标志,象征着renren.com是一个人与人的沟通分享平台,分享真实、沟通快乐。

分类: 随 笔 标签: , ,

可恶的DNS拦截……

2009年8月4日 17 条评论

刚鼓捣完的一个博客个人的力量,突然一访问就转到网通的广告页了!PING后发现IP变了……去域名管理后台却又发现一切好好的……因为电脑使用的是自动获取DNS,所以就想到了DNS拦截!其实我一直以来都没有遇到这种情况。手动把DNS改了一下,换成 OpenDNS 的:

208.67.222.222
208.67.220.220

问题马上解决了!

收藏一下大连网通和电信的DNS:

网通:
202.96.64.68
202.96.69.38

电信:
219.150.32.132
219.150.46.146

分类: 随 笔 标签:

XLex VS 有道……

2009年8月3日 10 条评论

手机里一直在使用 xLex 的朗文手机词典,内含10万词汇,使用过程中不必像其他手机词典软件那样需要联网查词。我一直认为与其需要联网查词,到不如直接登录 wap.iciba.com 或者 谷歌词典。关于 xLex 的这款词典应该算是手机词典的巅峰之作。10万词汇完全本地化,而且占用空间非常小。看一下关于 Xlex 的手机词典的介绍:

朗文授權,XCome Technology Ltd.公司出品,移動雙向詞典Jar版
內含10萬詞彙,使用過程中無需聯網,不會像金山詞霸、谷歌詞典等其他手機詞典那樣耗費GPRS流量,安裝后手機中10萬本地詞彙一網打盡。
運行速度快,基本功能與操作完全不亞於其他智能手機詞典。
支持機型:所有的S60 V1 V2
詞典大小僅為3489KB
版本:1.0.0

今天偶然看到有道手机词典的介绍:

小巧实用的手机版词典。内置超过10万中英文单词短语,无需上网即可轻松查单词。
支持即时提示。在您输入单词的前几个字母后,根据提示即可找到您想要输入的单词。
支持网络释义。从数十亿网页中自动萃取最新单词解释,永不过时的超大网络词库。
包含海量例句。数百万中英文例句,是你学习英语的好帮手。
支持单词发音。S60第三版新增单词发音,背单词更有把握。
内嵌长句翻译新。S60第三版、JAVA通用版内嵌长句翻译, 方便您英语的学习交流。

马上被它的第一句话所吸引:

内置超过10万中英文单词短语,无需上网即可轻松查单词。

既然也是10万本地词库,而且看到软件截图,有道的界面也更好一些,xLex 的界面做的的确稍显粗糙……

于是便下载下来……经过一番测试使用,发现其所说的10万词汇确实不假,但是每个词汇给出的只是第一个解释……举例:

core 这个词,从有道手机词典本地词库上我们只能查询到“果心、核心”,对于其他解释和词性的介绍则需要联网查询,而且联网速度也不是很理想。试了下其他词汇,也都只是给出了基本的一个解释……

哎~什么感觉?感觉好比要买10个苹果,数量够了,可回去才发现 core 是坏的……

还是那句话与其需要联网查词,到不如直接登录 wap.iciba.com 或者 谷歌词典。于是重新换回了 xLex ...

Everything is good when new, but friends when old.
物莫如新,友莫如故。

对于一个05年出品的 xLex 手机词典,强大的词库,很小的占用空间,只是稍显粗糙的界面,不知什么时候会真正出现一款同类产品将其弥补……虽说“物莫如新”,但是“新”也要在“旧”的基础上而来吧?

分类: 随 笔 标签: , , , ,