其实很多人都知道,如果说Snow Leopard和Windows 7的图形界面是可口的点心的话,那么在*nix系统里面,命令行Shell简直就是系统的灵魂。
笔者是从事网站开发和设计的,俗称的D&D(Design and Development),经常遇到需要把制作效果汇报给上级,或者发Demo给客户的情况。然而由于Web pages脱离了Web server通常是无法完整预览的,这就需要截图了。
Mac上截图是很方便的,系统自带的截图功能就异常强大(和Windows上残废的截图功能无法类比),而且通过便利的热键就能使用。关键是Mac上的截图工具并不能截取网页的全图,也就是遇到你的网页尺寸大于你的浏览器窗口尺寸的时候,就无能为力了,难不成还要开个Photoshop来拼接?这样做很山寨,一点都不专业,而且效率相当低。于是我也尝试过使用Paparazzi和Little Snapper。说实话,这两个软件都是很优秀的,特别是华丽的Little Snapper,但是那就需要多安装一个软件了,有没有什么环保一点的办法呢?
经过一番研究,其实是有的,就是使用基于python的webkit2png,然而事实上Paparazzi和Little Snapper都是基于webkit2png项目的。
webkit2png可以在这里下载到:http://www.paulhammond.org/webkit2png/
如果你和我一样,有命令行癖,那么打开Terminal,使用CURL获取,命令如下:
curl http://www.paulhammond.org/2009/03/webkit2png-0.5/webkit2png-0.5.txt > webkit2png
于是你就得到webkit2png了。怎么用呢?
首先检查你的系统,你必须使用Mac OS X 10.2或以上系统,Safari 1.0或以上,PyObjC库1.1或以上。当然了,如果你的系统是Mac OS X 10.5 Leopard或更高版本,那么以上所有组件,你都已经安装过上了。如果不满足条件,可以升级Safari,并下载PyObjC的源代码自己编译。
webkit2png的使用很简单,Terminal执行:
python /Users/Leask/webkit2png https://leaskh.com/
执行效果如下:
然后你就会发现网页已经被截图放在你的home文件夹了。
当然你还可以通过参数控制webkit2png的行为,你可以通过 --help 获得以下使用帮助:
Flora:~ Leask$ python /Users/Leask/webkit2png --help
Usage: webkit2png [options] [http://example.net/ ...]examples:
webkit2png http://google.com/ # screengrab google
webkit2png -W 1000 -H 1000 http://google.com/ # bigger screengrab of google
webkit2png -T http://google.com/ # just the thumbnail screengrab
webkit2png -TF http://google.com/ # just thumbnail and fullsize grab
webkit2png -o foo http://google.com/ # save images as "foo-thumb.png" etc
webkit2png - # screengrab urls from stdin
webkit2png -h | less # full documentationOptions:
--version show program's version number and exit
-h, --help show this help message and exit
-W WIDTH, --width=WIDTH
initial (and minimum) width of browser (default: 800)
-H HEIGHT, --height=HEIGHT
initial (and minimum) height of browser (default: 600)
--clipwidth=WIDTH width of clipped thumbnail (default: 200)
--clipheight=HEIGHT height of clipped thumbnail (default: 150)
-s SCALE, --scale=SCALE
scale factor for thumbnails (default: 0.25)
-m, --md5 use md5 hash for filename (like del.icio.us)
-o NAME, --filename=NAME
save images as NAME-full.png,NAME-thumb.png etc
-F, --fullsize only create fullsize screenshot
-T, --thumb only create thumbnail sreenshot
-C, --clipped only create clipped thumbnail screenshot
-d, --datestamp include date in filename
-D DIR, --dir=DIR directory to place images into
--delay=DELAY delay between page load finishing and screenshot
--noimages don't load images
这里我就不一一翻译了。如果你懂一点Shell Script语言,还可以把这个命令再封装一下,例如我就把这个命令封装为:
websnap [URL]
的形式,很便利地得到截图,如输入:
至于Shell Script怎么写?也不难,Unix和Linux上的Shell Script其实都大致一样,如:
#!/bin/bash
echo "Leask's WebSnap based on webkit2png"
echo ""
python /Users/Leask/webkit2png $1;
exit;
保存上面的代码片段为以websnap为名文件,注意以上的Leask为我的用户名,你还需要自己改为自己的用户名呢。放脚本的目录和脚本本身都需要有执行权限。
就先写这些吧,Enjoy。
// 如果你是Linux用户,你通常没有Webkit,那么你有Firefox就可以了,Google一下另外一个基于Mozilla Firefox的项目叫做khtml2png,和webkit2png大同小异。