P
Paul Hammond
paulhammond.org · Personal blog · on HN since 2008
Paul Hammond, a web developer and Typekit engineer, writes about deployment practices, infrastructure, and small tools like webkit2png and jp.
What HN saysHN links it for his tools, with commenters using webkit2png for screenshots and jp to browse JSON, plus his posts on shipping trunk.
23HN people shared it
16linked it in comments
7stories submitted
218story points
9 years agolast shared
2008people per year2026
Most-shared posts
- 1Webkit2png: Python (cmd) tool that creates png screenshots of webpages14 people · 70 points · first shared 2008 · 28 comments on HN
- 2Always ship trunk: Managing change in complex websites2 people · 139 points · first shared 2010 · 23 comments on HN
- 3Conditional2 people · first shared 2009
- 4Scaling Typekit: Infrastructure for Startups (2012)1 people · 4 points · first shared 2013 · discussion on HN
- 5Infrastructure for Startups1 people · 2 points · first shared 2012 · discussion on HN
- 6Always ship trunk1 people · 2 points · first shared 2010 · discussion on HN
- 7Xoxo1 people · 1 points · first shared 2012 · discussion on HN
- 8Jp1 people · first shared 2014
What HN people wrote when they linked it
bertrandom · 2014-06-03
I uploaded it to Internet Archive: https://archive.org/details/HackerNewsStoriesAndCommentsDump
Not sure two giant JSON files is the best format for this, but I used jp: http://www.paulhammond.org/jp/ to browse through it.
sailormoon · 2010-02-20
Yep, that's exactly it.
Didn't even have to write an app - I used this excellent tool: http://www.paulhammond.org/webkit2png/
audionerd · 2009-07-24
The author recommends two ways to target rules at IE: 1) create new stylesheets for each version of IE, or 2) CSS hacks that only IE understand/ignores.
But I prefer to use a different approach: conditional classes on the body tag. For example:
<!--[if lt IE 7 ]> <body class="ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie7"> <![endif]-->
<!--[if IE 8 ]> <body class="ie8"> <![endif]-->
<!--[if !IE]><!--> <body> <!--<![endif]-->
Then you can write IE-specific rules without CSS hacks:
body div#container { background-color: white; }
body.ie6 div#container { background-color: red; }
And all your related styles can be grouped together in the same file.
via http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-… and http://www.paulhammond.org/2008/10/conditional/
mrcoles · 2014-08-21
Hi—I built that extension! Thank you for using it. You can view the source code here:
https://github.com/mrcoles/full-page-screen-capture-chrome-extension
It’s malware & spyware free. I built the extension to take a screen cap of a seating chart that I built as a web page for my wedding—since all the other extensions at the time were broken. Why a web page for my seating chart? IDK, I wanted to play with CSS3 columns, alas I should have used photoshop…
I have been contacted by people who want to buy the extension, but it seems too dangerous, since they could easily install their own malware—I wonder if anything like this happened to “Awesome Screenshot”? My own conscience and, more importantly, my personal brand is too important to me to sell it.
In terms of the permissions, when I built it, I had to ask for those permissions in order to make it work. If you find any changes to chrome permissions that let me ask for fewer, please let me know or, better, submit a pull request.
Also, instead of PhantomJS, if you have a Mac, try out `webkit2png`, which works great as long as you don't need to login or interact with a page before the screenshot:
http://www.paulhammond.org/webkit2png/
dewski · 2017-10-06
I built exactly this once, was fun to set and forget and look back on it in a few months. It calculated the diff and you could see obvious spikes when big changes were rolled out. You saw a lot of big spikes on say Apple.com when new products were announced or marketed, whereas Reddit.com was always changing and couldn't detect any meaningful patterns.
It also had ffmpeg in the backend that would create a timelapse for you on demand. I built it when we rolled out our some rebranding/homepage changes on GitHub.com and nobody really knew off the top of our heads when exactly the last time we updated it was. Git only tracked code changes, no visual changes.
It was originally built on top of http://www.paulhammond.org/webkit2png/
maxmcd · 2014-06-30
Something that involves this possibly?
http://www.paulhammond.org/webkit2png/
Might be overkill, but would allow quite a bit of flexibility.
dools · 2013-03-06
Anyone looking for a simple way to do this on an ad-hoc basis from their own machine can check out this python script: http://www.paulhammond.org/webkit2png/
lukeholder · 2012-12-04
This is nice, but I find webkit2png http://www.paulhammond.org/webkit2png/ (brew install webkit2png) a more simple and flexible way to quickly generate images (and thumbnails) of webpages.
This is nice, that it hosts them for you immediately, although dropbox live links are pretty easy.
Inception: https://dl.dropbox.com/u/103062/webkit2png.png
scraplab · 2012-11-10
And Paul Hammond's webkit2png, if you want to run something yourself.
http://www.paulhammond.org/webkit2png/
icoloma · 2012-05-28
Any insights about how it is different from webkit2png?
http://www.paulhammond.org/webkit2png/
geekgyrl · 2012-01-19
Here are two options.
Webkit2png (free for Mac) - http://www.paulhammond.org/webkit2png/
Khtml2png (free for Linux) - http://khtml2png.sourceforge.net/
Paid online api - http://url2png.com/
simonw · 2010-11-10
Consensus these days is pretty much that CSS hacks should be completely avoided in favour of conditional comments. Take a look at how we handle IE-specific styles on http://lanyrd.com/ (based on a trick discovered by Paul Hammond: http://www.paulhammond.org/2008/10/conditional/ )
paraschopra · 2010-08-24
If you need technical details, implementing it is quite simple. For generating screenshots on an Ubuntu machine, you just need a script called webkit2png.py http://www.paulhammond.org/webkit2png/ and XVFB (fake X server).
After that, taking screenshots is as simple as firing this command on shell:
xvfb-run --server-args="-screen 0, 1024x768x24" python webkit2png.py -o google.png -F javascript -w 2 http://google.com/
Even though it is resource-intensive operation, I decided to generate screenshots on our own servers over using an existing service because I didn't find a satisfactory screenshot generation API that captures full-page screenshots (as opposed to just thumbnails).
Next feature is to implement nicely formatted PDF reports. But my initial research says it is a VERY hard task! (That's because VWO charts are all JavaScript powered)
apgwoz · 2008-05-21
It also looks like it's at version "works for me," so you're probably out of luck if it doesn't work for you.
There's actually a fair number of these popping up as of late, webkit2png (http://www.paulhammond.org/webkit2png/) and khtml2png (http://khtml2png.sourceforge.net/) are the other ones I've seen recently...