Printing a Tab to PDF Exactly As It Appears

I often need to print an entire tab to a PDF (though I'm fine printing to a JPG or some such file instead) exactly as it appears. Ctrl-P will often print it with a very different appearance; PrintScreen will save the current screen contents to the clipboard, but I'd have to repeat that several time when a tab contains multiple screens' worth. I tried Ctrl-Shift-PrintScreen, which I've seen recommended for this, but it just printed the current screen, rather than the whole tab.

Any suggestions? Thanks!

Comments

[Jonathan Affleck]

What type of machine are you using?

Does the result have to be searchable?

Are you referring to the content on the screen or to the content in the tab?

How do you want collapsible fields and sliders to be handled?

There are other issues, but at the moment the issues above first occur to me.

[oshout]

1. Print to PDF. Choose to print a webpage you’re looking at (likely control+P or option+P) and then choose a PDF printer. It will ask you where you want to save the PDF.

2. The browser extension ‘go full page’ – it can save as png and pdf. Browser extensions carry risks, you should read up on those if you’re not familiar.

3. Consider using a service like the Wayback machine by archive.org This will allow you to see the public pages of a site as it existed on a specific day. helpful if you need to track or demonstrate changes. not helpful if you need to present data which requires being logged in such as someone’s Facebook profile. Basically, instead or perhaps along with the image you’ve created, you can offer a URL to demonstrate unequivocally how a webpage looked at a specific date.

[Eugene Volokh]

Excellent, thanks! The GoFullPage extension from the Chrome Store works (I'm using it on Brave).

[Magister]

You could try saving it as an HTML file (save as webpage complete, so it saves the images rather than references to the originals) but that things like cascading style sheets may make it look different, and probably scripting within the page will cause issues anyway.

You could try software that records video of the screen, and scroll through the tab while recording; faster but probably more annoying to get to what you want later. Like print screen, it won't give you a result that you can search for text.

[Snorkle]

If you browse with FireFox, right/control-click on any page, select "Take Screenshot", and select "Full Page".

Chrome at least used to have a way to do this buried in the web developer tools, but I don't use spyware, so I don't know if it still does.

[Á àß äẞç ãþÇđ âÞ¢Đæ ǎB€Ðëf ảhf]

Dang that does look like it works! Thanks.

[Eugene Volokh]

Thanks -- I tried this in FireFox, but couldn't get a Take Screenshot option. Maybe I'm not properly understanding "right/control-click"; I tried using the right-control button and clicking at the same time, using the control button and right-clicking, and using the right-control button and right-clicking, but didn't get any Take Screenshot option. What am I missing? If you want to e-mail me the answer (e.g., with a screenshot or some such), please e-mail volokh at law.ucla.edu.

[bernard11]

I'm on a Mac, and it works with either control-click or a plain right click on a two button mouse.

Don't know about Windows.

[Davy C]

I"m on Windows using Firefox, and a simple right click produces a menu with Take Screenshot right in the middle. (The click can't be in a textbox or link or picture or anything that will make it produce a different menu, though.)

[slprice]

If you are using an iPad or iPhone, when in Safari you can hit the sleep/wake and volume up buttons simultaneously to take a screen shot. When the thumbnail shows at the bottom touch it to open the editor. At the top, select the "Full Page" tab then press "Done," at which time it will give an option to save a PDF to Files.

[DRM]

https://zapier.com/blog/full-page-screenshots-in-chrome/

With the web page open, press Cmd + Opt + I (on Mac) or Ctrl + Shift + I (on Windows).

Then, press Cmd + shift + P (on Mac) or Ctrl + Shift + P (on Windows).

In the search bar, immediately after the word Run >, type "screenshot".

Select Capture full size screenshot, and Chrome will automatically save a full-page screenshot to your Downloads folder (as a PNG).

[Eugene Volokh]

Nice, thanks!

[Bored Lawyer]

Beat me to it. Ctrl + Shift + P (on Windows) works really well for me.

[santamonica811]

Interesting. On my machine (Firefox and Windows), doing that [Crt-Shft+P] instead opened up a new Private Tab in a separate browser window.

[Bored Lawyer]

Try ALT-SHIFT-P. That's actually what I use.

It might be a Chrome thing. Worthy a try.

[Bwaaah]

That one worked well for me.

[MatthewSlyfield]

There are a number of PDF printer drivers out there that will allow you to print anything to PDF exactly as if you were printing it to paper.

For example: https://www.win2pdf.com/pdf-printer-driver.html

[Jordan Brown]

Remember that HTML and browsers are not designed to precisely produce output. What you see in your browser may be different from what I see in mine, and may differ when you change the window size or shape. You may have different font and font size preferences. Et cetera.

The reason that this is relevant is that a PDF isn't your screen. It doesn't have the same geometry. (I don't know if it necessarily even has the same fonts.) Some pages deliberately render differently when "printed" than when viewed. I wouldn't expect a screen-shot-like exact reproduction, unless you're using a screen-shot mechanism that takes a picture - and then you don't get searchable text and the results may be odd if the content is significantly longer than a screen.

Exactly what problem are you trying to solve?

[Eugene Volokh]

I just want to be able to show exactly what I was shown on the screen. Sometimes it's just for completeness: For instance, today I wanted to save some payment history data from a particular web site, but its print mode seemed busted, giving me only a small subset of the columns in the table. And sometimes it's for accuracy: For instance, I may want to save a screenshot of the output of some program, in order to blog about what the program did, and want to show it exactly as it came up for me on my browser.

[Jordan Brown]

The second is easier, because it probably doesn't require capturing stuff that isn't currently shown in the window. You want to show what you're looking at, and that's what a screen shot is. In fact, often you want to trim it down from there, to grab only the particular piece of the page that you want to talk about. Including thousand-pixel-wide images in your blog post may not be ideal.

The first... ugh. I'm not familiar with the tools the others describe, but going to PDF is often considered a "print" operation, and so if the page is botching its print layout, the same botch is likely to apply to PDF. (I tried printing this Reason page to PDF, and on both Firefox and Chrome it used a print layout, not exactly what was on the screen.) There's "save page as HTML", but... I just saved this page as "HTML complete", and it gave me a directory with 240 files in it plus a file in the parent directory. Opening that file in the parent did seem to reproduce the page, but maybe too well: it still picked up some content by making network requests, so it wasn't a local-only copy. "Save page as HTML only" seemed to work better, though I don't think it saves images.

There's always copy and paste, which is not likely to give you a perfect image (or even a very good image), but might be better than some of the alternatives.

For something like payment history, maybe they have a "download as CSV" or "download as Excel" option.

[Caphon]

Programmers always argue about white space, but generally feel 4 spaces are superior to a tab. It may render in PDFs better as well.

[snixdad]

Eugene, the Google Chrome extension GoFullPage will do exactly what you want. I have used it with great success.

[BadLib]

One of my pet peeves about “kids today” ????

Once upon a time in a land far away, web site designers cared about what printed output (either to a “real” printer or a “virtual PDF” printer) looked like and included the appropriate print style sheets and actually (apparently) tested them.

Sadly, “progress” seems to have resulted in most modern web sites not “printing” suitably leaving us with screen resolution png screen shots that are nearly useless for record keeping purposes.

Not all progress is good…

(I had forgotten how long ago the slide down the slippery slope started – for example here’s a web site dated in 2011 which refers to printing a Web page as a “long-forgotten habit”.)

Kids today don’t even learn assembly language, let alone microcode! Get off my lawn!

[David Nieporent]

Do you also have your secretary print your emails for you before you read them?

[Jordan Brown]

Printing stuff on paper is one thing. Keeping copies of records under *your* control is quite another.

[BadLib]

Nope (although I still do have a multifunction printer, it mostly get used for scanning and only for perhaps 2 pages a month for printing).

However, I do often save things digitally from web pages - such as the warranty statement for a product I've bought online or the product description. "Printing" to a PDF (such as by using PDFCreator - although now Firefox provides a "PDF" print function directly) was a much better way to do this than a screen grab - but few web sites now render a reasonable form of the page to a "printer".

[SRG2]

I had a boss 20 years ago who did this and who pretended that he did so because of "efficiency" and that he liked drafting replies in ballpoint, etc. when the real reason was his own technological incompetence.

[Schnazola]

Can't you just use a screen-capture app that can take scrolling captures? ShareX comes immediately to mind.

[hazelnut1973]

GoFullPage Extension

https://gofullpage.com/

[Sisu]

https://www.awesomescreenshot.com/

Alternatively, "Microsoft Print to PDF" (which is also a path from a jpg file to a more usable document)

[CEF]

Not completely on-point, but since you already have your answer, a helpful tip:

Start-Shift-S allows you to copy any rectangular portion of your screen. Excellent for tech support: "Hey -- I just got this on my screen. What does it mean?"

[alexarafat]

I’ve been there! For capturing an entire tab as it appears, I’d recommend using a browser extension like "Full Page Screen Capture" or built-in tools like Chrome's "Save as PDF" under the Print options (make sure to adjust settings for layout). If you're ever printing graphics-heavy tabs, https://iconicsgraphics.com/ could be a great resource for turning them into polished prints. Hope this helps!

[alexarafat]

I’ve run into the same issue before! Ctrl+P often messes up the formatting, and PrintScreen is a hassle for longer pages. What’s worked for me is using a browser extension like "GoFullPage" (for Chrome) or "Fireshot" (for Firefox). They capture the entire tab exactly as it appears and let you save it as a PDF or image.

Funny enough, I first ran into this issue when trying to save some info from https://pcp-claims.org/oodle-pcp-hp-claims/ about oodle car finance refunds. The page was long, and I didn’t want to miss anything, so I had to find a better way. Hope this helps!

[elize]

If you want to learn more about the world of AI chat and how to use it effectively, you can get more information here. There are plenty of resources available to help you better understand how AI works, how to improve your experience with it, and how to make the most of the tools it offers. In summary, trying the AI chat is an excellent way to start exploring the fascinating world of artificial intelligence. Whether you want to talk with AI now, try the AI assistant, or simply experience AI for free, this technology is revolutionizing the way we interact with machines. https://chatgptespanol.co/