Responsive PDFs

We are just starting planning for a responsive website. What is the best way to handle PDFs? Many of our assets are 50-60 pages of technical documentation. What is the best way to approach.

PDFs are intended to be printed on fixed size paper and so can’t be responsive the way web pages can. PDF readers have zoom and scroll built in so your visitors will be able to decide for themselves the most appropriate way to view the content on their device if they decide to do so before printing it.

The other thing you could do to provide a more responsive way of accessing that information is to also supply an HTML version of the same content.

Thanks. The issue is that we have lots of technical documentation and it would be difficult to convert it all to html. Would it be bad form to have a responsive site that had PDFs on it? Are there any responsive sites that still provide PDFs? We can likely tackle the hundreds of PDFs over time but it will be some time before it’s done.

Usage of the PDF format is of course very common and there are countless sites with a responsive layout that offer them. As @felgall said many PDF readers have options that allow the viewer to render the content in different ways. However viewing any non HTML document on a small device is going to pose problems. I would suggest not to worry about it too much, if the visitor wants the documentation they can always download them on a device that has a large enough screen to make it usable.

In the long term, I always recommend creating documentation in HTML format as default, then offering a PDF version for those people that want it that format - these days it’s easy enough to convert any web page to a PDF on demand, and of course having everything in HTML makes it easier to maintain.

1 Like

PDF documents can be made somewhat responsive by choosing to let the content “reflow” when you create the PDF. Makes for a rather ugly layout, though, and I’m not sure if this reflowing works when you view the pdf in a browser or on a small screen.

I am not sure how that would work as the browser has no idea what paper size you plan on printing it to or whether in fact you intend printing it at all.

Remember that PDF is supposed to be producing point perfect layouts for printing so any sort of reflowing to different widths means that you are using the completely incorrect output format.

I’d say “able to” rather than “supposed to”. A few years ago I was making PDF “ebooks” and was experimenting with various PDF formats. PDFs indeed have reflow capabilities, so you might have a somewhat limited view of what they are capable of / intended for these days. They can be used for a lot more than just a digital version of a printed document.

Some kinds of documentation lend themselves to the fixed format of PDF much better than to HTML – particularly if you have a more complicated layout with diagrams and charts. Sure, you can put these in a web page as images, but you often won’t get a great output that way. If that’s the sort of page you’re working with, it’s fine to use PDF, and there are any number of responsive sites that use PDFs.

(One that gets me is a local bus company, that has recently converted its website to a responsive design, and apart from the fact that it is now less easy to use on a PC, the timetables are pretty much impossible to use on a mobile, and even they recommend using the large PDF versions on a mobile rather than the responsive HTML – what a mess!)

Having said that, I don’t really get responsive design, and more often than not would prefer to just use the regular desktop design on my mobile and zoom and scroll, so I may not be the best person to comment!

1 Like