4 ms·

Show HN: simple web utility for converting html to image

22 points by kimura 14y ago

MichaelApproved 14y ago
Works well on the desktop but I couldn't get it to work on my iPhone and the UI was completely broken when I tried to load the page.
lukeholder 14y ago
This is nice, but I find webkit2png http://www.paulhammond.org/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 https://dl.dropbox.com/u/103062/webkit2png.png
Charlesmigli 14y ago
Doesn't phantomjs do the thing for you?
- kimura 14y ago
  Yes, it does. I will to look into phantomjs to see how it handles css and flash.
sdoering 14y ago
Well, nice, really nice idea. Tried it and was frustrated by the poor quality, of the screenshot it produced. Grainy and blurred fonts, nothing I would wanna use. And the software had obvious problems parsing my css-styles. Some headlines were way of... Hope you might be able to fix these issues. If not, you are (at least in my case) not usable...
- kimura 14y ago
  Thank you for the feedback. We might have to start generating .png outputs - that will definitely solve the quality problem. Do you mind sharing the site/input you used?
  - carbuncle 14y ago
    You should add a loader, or at least a feedback that the processhas started. I clicked on the button 2 or 3 times before realizing that my browser was waiting for your side. Plus, the PNG doe not perfectly reflect our site (alignment problems , ...). Input site : http://d-sight.com http://d-sight.com Finally, clicking on our screenshot brings us to "realtywarp.com" Other wise it's a nice tool-to-have. I would probably use it around once a month.
cabirum 14y ago
pici.picidae.net - http://pici.picidae.net/CACHE/dec45eca572ebdea3a554c5827d33d53.png http://pici.picidae.net/CACHE/dec45eca572ebdea3a554c5827d33d... html2image - http://s3.amazonaws.com/amazon-cl2/LXOTY9N1IMC4BJ3GZU1PCZTNLU863KHPUQ7T8.jpg http://s3.amazonaws.com/amazon-cl2/LXOTY9N1IMC4BJ3GZU1PCZTNL...
jwuggles 14y ago
haha i see waht you did there. this is the king of all craigslist posting - image based ads
mahmoudhossam 14y ago
I entered http://www.tumblr.com http://www.tumblr.com and it took around 5 seconds to come up with a result, this is because tumblr uses "endless scrolling". Is this by design?
eb0la 14y ago
I've always done this kind of stuff with PhantomJS; but I find this much better (no need to copy and paste code for a quick 1-minute job).
balakk 14y ago
Wow. At last, an azure-hosted site featured on HN front page.
ppadron 14y ago
If you need to host your own screenshot/html2png app, I've built this on top of PhantomJS: https://github.com/w3p/htmlshots https://github.com/w3p/htmlshots. It uses PhantomJS's builtin webserver module to serve screenshots, so you don't need to spawn a new process for each screenshot request.
skakri 14y ago
As others mentioned - PhantomJS is way to go, it supports webfonts as well - http://www.grab.lv/_external/testpreview.png http://www.grab.lv/_external/testpreview.png
jondot 14y ago
Should be easy enough doing with phantom.js http://skookum.com/blog/dynamic-screenshots-on-the-server-with-phantomjs/ http://skookum.com/blog/dynamic-screenshots-on-the-server-wi...
javan 14y ago
I made a similar thing with phantomjs and node: http://node-urlshot.herokuapp.com/ http://node-urlshot.herokuapp.com/

22 points by kimura 14y ago

Works well on the desktop but I couldn't get it to work on my iPhone and the UI was completely broken when I tried to load the page.

lukeholder 14y ago

This is nice, but I find webkit2png http://www.paulhammond.org/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 https://dl.dropbox.com/u/103062/webkit2png.png

Charlesmigli 14y ago

Doesn't phantomjs do the thing for you?

kimura 14y ago
Yes, it does. I will to look into phantomjs to see how it handles css and flash.

sdoering 14y ago

Well, nice, really nice idea. Tried it and was frustrated by the poor quality, of the screenshot it produced. Grainy and blurred fonts, nothing I would wanna use. And the software had obvious problems parsing my css-styles. Some headlines were way of... Hope you might be able to fix these issues. If not, you are (at least in my case) not usable...

kimura 14y ago
Thank you for the feedback. We might have to start generating .png outputs - that will definitely solve the quality problem. Do you mind sharing the site/input you used?
- carbuncle 14y ago
  You should add a loader, or at least a feedback that the processhas started. I clicked on the button 2 or 3 times before realizing that my browser was waiting for your side. Plus, the PNG doe not perfectly reflect our site (alignment problems , ...). Input site : http://d-sight.com http://d-sight.com Finally, clicking on our screenshot brings us to "realtywarp.com" Other wise it's a nice tool-to-have. I would probably use it around once a month.

cabirum 14y ago

pici.picidae.net - http://pici.picidae.net/CACHE/dec45eca572ebdea3a554c5827d33d53.png http://pici.picidae.net/CACHE/dec45eca572ebdea3a554c5827d33d... html2image - http://s3.amazonaws.com/amazon-cl2/LXOTY9N1IMC4BJ3GZU1PCZTNLU863KHPUQ7T8.jpg http://s3.amazonaws.com/amazon-cl2/LXOTY9N1IMC4BJ3GZU1PCZTNL...

jwuggles 14y ago

haha i see waht you did there. this is the king of all craigslist posting - image based ads

mahmoudhossam 14y ago

I entered http://www.tumblr.com http://www.tumblr.com and it took around 5 seconds to come up with a result, this is because tumblr uses "endless scrolling". Is this by design?

eb0la 14y ago

I've always done this kind of stuff with PhantomJS; but I find this much better (no need to copy and paste code for a quick 1-minute job).

balakk 14y ago

Wow. At last, an azure-hosted site featured on HN front page.

ppadron 14y ago

If you need to host your own screenshot/html2png app, I've built this on top of PhantomJS: https://github.com/w3p/htmlshots https://github.com/w3p/htmlshots. It uses PhantomJS's builtin webserver module to serve screenshots, so you don't need to spawn a new process for each screenshot request.

skakri 14y ago

As others mentioned - PhantomJS is way to go, it supports webfonts as well - http://www.grab.lv/_external/testpreview.png http://www.grab.lv/_external/testpreview.png

jondot 14y ago

Should be easy enough doing with phantom.js http://skookum.com/blog/dynamic-screenshots-on-the-server-with-phantomjs/ http://skookum.com/blog/dynamic-screenshots-on-the-server-wi...

javan 14y ago

I made a similar thing with phantomjs and node: http://node-urlshot.herokuapp.com/ http://node-urlshot.herokuapp.com/