张信哲 - 雨霖铃

人处苏州 让前事退后

雨下 天空哭了这样久

难再挽手 便遊荡宇宙

以后 不见面更自由

 

没有悲 因我太明事理

没有喜 全是你福气

无谓怕 谁又怕 你今晚将出嫁

忘掉祝福话 更拒绝去诅咒他

难永别你 这个你 有日也必成家

分手时 早该想到吧 要化

 

终于都不忍上机

原谅我 远隔万里为回避

没有喜 喜宴对谁做戏

没有悲 情敌够福气

无谓怕 谁又怕

你今晚将出嫁 忘掉祝福话 更拒绝去诅咒他

难永别你 这个你 有日也必成家

分手时 早该想到吧

 

多得光阴这劫匪

驯服我 在记忆里没妒忌

心灰飞仍属惊喜

亦胜从无深爱你

连夜雨 试验我的慈悲

无谓怕 谁又怕 你今晚将出嫁

无谓恭喜吧 更拒绝去比较他

忘记代价 对你牵挂 我没这么傻瓜

这一夜 酸风苦雨下

连生死 亦未怕

Firebug

 

本文最初发表《程序员》杂志第三期,现将全文贴上,内容已经过编辑修饰了很多:)

什么是Firebug

从事了数年的Web开发工作,越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码;要编写精致的CSS样式表展示每个页面模块;要调试javascript给页面增加一些更活泼的要素;要使用Ajax给用户带来更好的体验。一个优秀的WEB开发人员需要顾及更多层面,才能交出一份同样优秀的作业。为帮助广大正处于Web2.0洪流中的开发人员,在这里为大家介绍一款轻巧灵活的辅助开发工具。

Firebug是Firefox下的一款开发类插件,现属于Firefox的 五星级强力推荐插件之一。它集HTML查看和编辑、Javascript控制台、网络状况监视器于一体,是开发JavaScript、CSS、HTML和 Ajax的得力助手。Firebug如同一把精巧的瑞士军刀,从各个不同的角度剖析Web页面内部的细节层面,给Web开发者带来很大的便利。这是一款让 人爱不释手的插件,如果你以前没有接触过它,也许在阅读本文之后,会有一试的欲望。笔者在撰写此文的时候,正逢Firebug发布1.0正式版,这不能不 说是种巧合。

应用

Firebug插件虽然功能强大,但是它已经和Firefox浏览器无缝地结合在一起,使用简单直观。如果你担心它会占用太多的系统资源,也可以方便地启用/关闭这个插件,甚至针对特定的站点开启这个插件。

在安装好插件之后,先用Firefox浏览器打开需要测试的页面,然后点击右下方的绿色按钮或使用快捷键F12唤出Firebug插件,它会将当前页面分成上下两个框架,如图1所示。

图1:Firebug插件展开图示
firebug插件展开图示
从图1中看到,Firebug有6个主要的Tab按钮,下文将主要介绍介绍这几方面的功能。

ConsoleHTMLCSSScriptDomNet
控制台Html查看器Css查看器脚本条时期Dom查看器网络状况监视

Console 控制台

控制台能够显示当前页面中的javascript错误以及警告,并提示出错的文件和行号,方便调试,这些错误提示比起浏览器本身提供的错误提示更加 详细且具有参考价值。而且在调试Ajax应用的时候也是特别有用,你能够在控制台里看到每一个XMLHttpRequests请求post出去的参数、 URL,http头以及回馈的内容,原本似乎在幕后黑匣子里运作的程序被清清楚楚地展示在你面前。

象C shell或Python shell一样,你还能在控制台中查看变量内容,直接运行javascript语句,就算是大段的javascript程序也能够正确运行并拿到运行期的信息。

控制台还有个重要的作用就是查看脚本的log, 从前你也许习惯了使用alert来打印变量,但是Firebug给我们带来了一个新朋友 —— console.log, 最简单的打印日志的语法是这样的:

console.log("hello world")

如果你有一堆参数需要组合在一起输出,可以写成这样:

console.log(2,4,6,8,"foo",bar).

Firebug的日志输出有多种可选的格式以及语法,甚至可以定制彩色输出,比起单调的alert,显然更加方便,限于篇幅,这里不做详细说明,但是有志于提高debug效率的读者,可以到Firebug的官方站点(见附录)查看更详细的教程。

图2: 在控制台里调试javascript
在控制台里调试javascript

查看和修改HTML

第一次看到Firebug强大的HTML代码查看器,就觉得它与众不同,相比于Firefox自带的HTML查看器,它的功能强大了许多。 HTML

首先你看到的是已经经过格式化的HTML代码,它有清晰的层次,你能够方便地分辨出每一个标签之间的从属并行关系,标签的折叠功能能够帮助你集中精 力分析代码。源代码上方还标记出了DOM的层次,如图3所示,它清楚地列出了一个hml元素的parent、child以及root元素,配合 Firebug自带的CSS查看器使用,会给div+css页面分析编写带来很大的好处。你还可以在HTML查看器中直接修改HTML源代码,并在浏览器 中第一时间看到修改后的效果,光凭这一点就会让许多页面设计师死心塌地地成为Firebug的粉丝了。

有时候页面中的javascript会根据用户的动作如鼠标的onmouseover来动态改变一些HTML元素的样式表或背景色,HTML查看器会将页面上改变的内容也抓下来,并以黄色高亮标记,让网页的暗箱操作彻底成为历史。

利用Inspect检查功能,我们还可以用鼠标在页面中直接选择一些区块,查看相应的HTML源代码和CSS样式表,真正的做到所见即所得,如果你 使用了外部编辑器修改了当前网页,可以点击Firebug的reload图片重新载入网页,它会继续跟踪你之前用Inspect选中的区块,方便调试。

图3::HTML查看器
HTML查看器

CSS调试

Firebug的CSS调试器是专为网页设计师们量身定做的。

如今的网页设计言必称div+css,如果你是用table套出来的HTML页面,就得按这规矩重构一遍,否则显得你不够时髦!用div做出来的页 面的确能精简HTML代码,HTML标签减肥的结果就是CSS样式表的编写成了页面制作的重头戏。Firebug的CSS查看器不仅自下向上列出每一个 CSS样式表的从属继承关系,还列出了每一个样式在哪个样式文件中定义。你可以在这个查看器中直接添加、修改、删除一些CSS样式表属性,并在当前页面中 直接看到修改后的结果。

一个典型的应用就是页面中的一个区块位置显得有些不太恰当,它需要挪动几个象素。这时候用CSS调试工具可以轻易编辑它的位置——你可以根据需要随意挪动象素。
如图4中正在修改一个区块的背景色。

提示:如果你正在学习CSS样式表的应用,但是总记不住常用的样式表有哪些值,可以尝试在CSS调试器中选中一个样式表属性,然后用上下方向键来改变它的值,它会把可能的值一个个遍历给你看。

图4: CSS查看器,能够直接修改样式表
图4: CSS查看器,能够直接修改样式表

可视化的CSS尺标

我们可以利用Firebug来查看页面中某一区块的CSS样式表,如果进一步展开右侧Layout tab的话,它会以标尺的形式将当前区块占用的面积清楚地标识出来,精确到象素,更让人惊讶的是,你能够在这个可视化的界面中直接修改各象素的值,页面上 区块的位置就会随改动而变化。在页面中某些元素出现错位或者面积超出预料值时,该功能能够提供有效的帮助,你可以籍此分析offset、margin、 padding、size之间的关系,从而找出解决问题的办法。

图5:Firebug中的CSS标尺
图5:Firebug中的CSS标尺

网络状况监视器

也许有一天,你的老板或者客户找到你,抱怨你制作的网页速度奇慢,你该如何应对?你或许会说这可能是网络问题,或者是电脑配置问题,或者是程序太慢,或者直说是他们的人品问题?不管怎么说,最后你可能被要求去解决这个有多种可能的问题。

网络状况监视器能帮你解决这个棘手问题。Firebug的网络监视器同样是功能强大的,它能将页面中的CSS、javascript以及网页中引用 的图片载入所消耗的时间以矩状图呈现出来,也许在这里你能一把揪出拖慢了你的网页的元凶,进而对网页进行调优,最后老板满意客户欢喜,你的饭碗也因此而牢 固。

网络监视器还有一些其它细节功能,比如预览图片,查看每一个外部文件甚至是xmlHttpRequests请求的http头等等。

图6:网络状况监视器
图6:网络状况监视器

Javascript调试器

这是一个很不错的javascript脚本调试器,占用空间不大,但是单步调试、设置断点、变量查看窗口一个不少。正所谓麻雀虽小,五脏俱全。

如果你有一个网站已经建成,然而它的javascript有性能上的问题或者不是太完美,可以通过面板上的Profile来统计每段脚本运行的时间,查看到底是哪些语句执行时间过长,一步步排除问题。

图7:javascript调试器
图7:javascript调试器

DOM查看器

DOM(Document Object Model)里头包含了大量的Object以及函数、事件,在从前,你要想从中查到需要的内容,绝非易事,这好比你去了一个巨大的图书馆,想要找到几本名 字不太确切的小书,众多的选择会让你无所适从。而使用Firebug的DOM查看器却能方便地浏览DOM的内部结构,帮助你快速定位DOM对象。双击一个 DOM对象,就能够编辑它的变量或值,编辑的同时,你可能会发现它还有自动完成功能,当你输入document.get之后,按下tab键就能补齐为 document.getElementById,非常方便。如果你认为补齐得不够理想,按下shift+tab又会恢复原状。用了Firebug的 DOM查看器,你的javascript从此找到了驱使的对象,Web开发也许就成了一件乐事。

图8: Dom查看器
图8: Dom查看器

小结

Firebug插件提供了一整套web开发所必需的工具。从HTML的编写,到CSS样式表的美化调优,以及用javascript脚本开发,亦或 是Ajax应用,Firebug插件都会成为你的得力助手。所谓工欲善其事,必先利其器。在Web2.0的时代,言必称Ajax,动辄就是用户体验提升, 如果把Firebug工具用好,必能让你如虎添翼,将HTML、CSS、javascript整理得服服帖帖,从此成为web开发中的专家级人物。

Firebug的中文含义是萤火虫,作者是Joe Hewitt,官方网页 http://www.getfirebug.com Firefox亦即火狐浏览器,是近年来撼动IE浏览器市场占有率的一支强大力量,要不是它的出现,我想有生之年说不定也看不到IE 7的发布了,官方网页 http://www.firefox.com

作者: Volcano 发表于May 15, 2007 at 9:54 am

版权信息: 可以任意转载, 转载时请务必以超链接形式标明文章原始出处作者信息及此声明

永久链接 - http://www.ooso.net/archives/294

【东风何处在人间】

烟沙朦胧风凌乱^

霾雾携寒浸城半 ^

惊马疾骋迷归路^

东风借否还人间

 

煙沙朦朧風凌亂^

霾霧攜寒浸城半^

驚馬疾騁迷歸路^

東風借否還人間

[caption id=”” align=”alignnone” width=”300” caption=”许嵩”]许嵩[/caption]

原因;听了许嵩的半城烟沙

你最常用的 命令是什么?

在 Linux 下肯定要经常和命令行打交道,Linux 下的命令有无数,想知道自己经常用的命令 Top 10 是哪些吗?
实现起来很简单,把下面的这一长串命令粘进终端,执行就可以看到结果:

history | awk '{CMD[$2]++ ;count++ ;}END { for (a in CMD)print CMD[a] " " CMD[a]/count*100 "% " a;}' | grep -v "./" | column -c3 -s " " -t | sort -nr | nl | head -n10
原理也很简单,用 awk 统计 history 中的命令部分出现的次数,去掉 “./" 这样不算命令的情况,最后排序输出,列出前 10 个。

history | sed "s#^\s+[0-9]+\s+##g" | grep -oP "(?<=^||)\w+"|sort |uniq -c| sort -k1,1nr -k2

Workrave -- 防止腰酸背痛腿抽筋

Workrave is a program that assists in
the recovery and prevention of
Repetitive Strain Injury (RSI).
The program frequently alerts
you to take micro-pauses,
rest breaks and restricts
you to your daily limit.
Please refer to the feature
comparison for a complete
list of features, and how the
program performs with respect to other programs
on the market. The program
runs on GNU/Linux and Microsoft Windows.
经常在电脑前工作或是娱乐的人,
时间久了就会觉得脖子酸痛,后背酸痛,
操纵键盘鼠标 的手腕也不灵活起来,
这是因为在电脑前,
我们基本上都会保持一个姿势不变,
时间一长就会造成
RSI (Repetitive Strain Injury),
中文成为“重复性压力损伤”,
表现症状就是到处都酸痛。

防止 RSI 最好的办法就是工作一段时间就休息一下,

附带活动一下关节,伸展一下身体,

但是工作起来就会忘记时间,

经常是一转眼就发现几个小时过去了,强制自己按时休息也很难坚持。

Workrave 可以帮你解决这个问题,

在 Gnome 的面板加入 Workrave,

启动后,Workrave 就会自动得

根据键盘和鼠标的活动状况计算你的工作时间,

到设定的休息时间,就会发出警告。

Workrave 的默认值是每工作 3 分钟休息 30 秒,

每 45 分钟休息 10 分钟,每次最多工作 4 个小时,你也可以设定自己的休息计划。

Workrave 还附带了活动的体操示范,非常实用哦~

 

Workrave 的主页: http://workrave.sourceforge.net/

[caption id=”” align=”alignleft” width=”99” caption=”download”]workrave-linux[/caption]

如何在WordPress中安装 Google Analytics 数据分析

强大的网站数据分析可以说是任何一个成功网站必不可少的一个关键因素。分析流量是了解访客最佳的方式,而 Google Analytics数据分析可称得上是最好的免费网站分析工具。在这篇文章里,我将与大家分析下Google Analytics强大在哪里,以及教大家如何在WordPress博客中安装 Google Analytics。

Google Analytics的重要性

通过Google analytics,你可以追踪:

谁访问了你的网站

此部分数据包括了访客的地理位置,访客使用何种浏览器访问您的网站以及其他更多内容,如:屏幕分辨率、JavaScript支持、 Flash支持、语言等等。

这些数据非常实用,可以在多个方面帮助你:例如,在自定义设计时,你可以使用用户数据来确保您的站点与受众是兼容的。如果大多数用户不支持Flash,那么你应该尽量避免使用flash元素。如果大部分用户使用的屏幕分辨率是1280,那么应该保证你的设计与它兼容。

访客在你的网站上做了什么

你可以追中用户都在网站上那些地方停留了,他们在你的网站上停留了多久,跳出率如何,通过分析这些信息,你可以降低用户跳出率提高页面浏览的深度。

他们何时访问你的网站

通过观察站点上一天流量的高峰时刻,你可以挑选最佳的发布文章时间。如果碰上时区差别的,你可以使用定时发布功能来避免作息时间冲突。

他们从哪里到达你的站点

这部分数据的分析将会告知你用户从哪里来到你的站点: 搜索引擎、直接链接还是其他站点的引荐链接。它会显示每一个来源访客的百分比。Google analytics 还分别对这些分类还有更细的分析。就拿搜索引擎分类来说,它会告诉你哪一个搜索引擎获得的流量最多,谷歌、雅虎还是微软的必应。 它也会显示用户使用最为频繁的搜索词,这样可以帮助你提高该关键字的排名 。站点引荐链接这部分也会告知你哪个站点合作的效果最佳。假设从Twitter上获得的引荐最多,那么你就非常有必要再Twitter上花费些功夫,为Twitter受众提供些比较好的内容,让用户觉得他们有受到 特别的招待。如果从外部网站上获得的流量比较多,你可以考虑跟那个站点搞个合作关系 (交换链接之类的)。

他们与你网站的互动如何

通过Google analytics,你可以了解用户跟你网站内容的互动性如何。它会显示用户点击网站上链接的比例等等。通过观察用户的互动性,你可以依据用户的兴趣在内容上下功夫做些改善。

通过以上几个问题的分析,你就可以将重心花在适合自己网站的策略上,效果不好的策略就不用花太多精力。
注册Google Analytics

说了这么多,你可能也想问到底怎么样使用谷歌数据分析工具呢?首先,你需要访问 Google Analytics 注册页面.注册一个 Google Analytics账户。

进入注册页面以后,你会看到如下图所示的一个页面,如果你已经有gmail账户,你可以直接用邮箱账户注册,没有的朋友就先注册一个谷歌账户。

用邮箱账户注册完之后,你会看到下图所示,在这里你就可以注册google analytics。

接着就是输入你的站点信息, 表格内容都非常清楚, 输入你的网站URL地址,账户名(任何账户) 国家和时区。

第四步,你需要输入联系信息。

第五步, 同意服务协议条款。

第六步,你就会获得需要粘贴在你站点的代码。 这也是注册中最为关键的部分,复制并粘贴这个代码到记事本或HTML编辑器中,并不要关闭下面的窗口。

如何在WordPress中安装 Google Analytics

有三种方法可以在WordPress中安装Google analytics:直接粘贴代码、修改functions.php文件和插件。

直接粘贴代码

直接复制第六步的代码并将其粘贴到主题 footer.php文件标签的前面。

修改Functions.php

在主题 functions.php 文件加入下面的代码,也不要忘记粘贴上面第六步获得的Google Analytics代码。

// 在这里粘贴第六步获得的代码

插件

有非常多插件都可以实现在站点中加入Google Analytics数据分析工具,我这里推荐以下两款:

Google Analytics for WordPress由Joost de Valk制作
Google Analyticator 由 Ronald Heft制作

完成Google Analytics的安装以后,你可以返回到第六步的页面点击保存,完成。接着你就会进入到你的网站数据分析页面。

你会发现状态栏下方有个黄色的感叹号,这是说明谷歌还没有认识到你已经在你的站点添加谷歌分析,大概还需要12 – 24之后谷歌才会提供数据分析报告。

谷歌分析工具是每个博客都必不可少的, 如果你希望能够随时对自己的博客流量做分析,那么现在就行动吧。

more —-http://www.wordpress.la/How%20to%20Install%20Google%20Analytics%20in%20WordPress.html

http://www.wpbeginner.com/beginners-guide/how-to-install-google-analytics-in-wordpress/

 

Ubuntu软件中心最受好评的20款软件

Stellarium(开源的桌面星空软件)、Chromium web浏览器、SMPlayer 播放器、GnuCash 资金管理软件、Blender(三维绘图及渲染软件)、Guake GNOME 命令终端、Synaptic 包管理器、Shutter 截图工具、ynapse 启动器、Mumble 游戏语音通讯工具、XChat IRC 客户端、Akregator(KDE下的feed 聚合器)、Uget 下载管理器、Deluge BT下载客户端GIMP图片编辑器、RawTherapee RAW照片处理软件、Darktable 数字摄影暗房软件、Inskscape 矢量图形编辑器、OpenShot 视频编辑器、Calibre 电子图书馆。

FileZilla,VirtualBox,