loading...

re: Paper as a Platform VIEW POST

FULL DISCUSSION
 

Making an okay-looking printable version of an article is relatively easy. But printing anything more advanced is not easy to get both right and browser-compatible.

What I wanted to do: Take our onscreen table-layouted webpage (a plan/calendar-ish thing, generated by our webapp) that looks great on both desktop and mobile, and print it to a paper and still look much the same, but handle pagination, unknown amount of text, and user-selected font and size. On all browsers.

What our dev-team ended up doing after a lot of headscratching and cursing: A webservice that takes our webpage and opens it in a chrome headless browser, and returns a carefully styled and rendered pdf based on a few preset layout- and font-options.

Viewing PDFs in browsers are not fun either..

  • Some browser-embedded pdf viewers shows print and save buttons. Others dont. Or only do if you hover the cursor at the correct position or click inside the document.
  • There is no way to get javascript to reliable call "print" on a embedded or iframed PDF document. So we just added a download button instead.
  • Putting clickable links inside PDFs will open the webpage inside the pdf-frame. You can put javascript inside the PDF to make it open the link in the system-default browser window, but not all PDF viewers supports this. I kinda understand why links arent really well-supported in pdfs. It is supposed to be a printable product after all. Just annoys me that if there is a link, and a user clicks it while inside a embed or iframe, there is sometimes no way to go back to the pdf.

(I'm hoping we can use a js-based PDF viewer next time we remake this.)

But its way easier to just design and code a mobile app and tell the customers to use that. 😆

 

Wow, yeah. Glad to hear how much thought you put into it.

way easier to just design and code a mobile app and tell the customers to use that

I can see this being a good argument for installing an app for anything more complex. "Need this offline or on the go? Don't print, or save as PDF, just install our app."

I now also understand better why apps and extensions exist to turn websites into more readable layouts. I found myself opening up dev tools to manually delete nodes and resize containers to print better at times.

code of conduct - report abuse