Last year saw the launch of book printing for Wikipedia articles. A very nice feature that allows you to create a collection of articles and print them as a book. Since yesterday you can even get hardcovers. There is also a wonderful "Print to PDF" feature that piggybacks on the book rendering technology.
Printing webpages has long intrigued me and the results have always been suboptimal, especially with something as complex as Wikipedia articles. However, the web is moving forward and the printing options for the web are getting better with every browser release. The past few days I was revisiting this issue and I have now added some new CSS to the print stylesheet of MediaWiki which should help browsers detect proper spots to insert pagebreaks and more importantly, where to avoid them.
When your browser supports it, it will try to avoid pagebreaks in images, wikitables and right after headers. It will also try to avoid lone sentences of paragraphs at the beginning or end of the page, keeping paragraphs more readable. This CSS is part of the Paged media subset of CSS. It is best supported by Opera and Internet Explorer 8. Actually it's one of the few spots where Webkit and Gecko are really lagging behind a bit. There are many more options in the paged media specification that would help improve printing of pages, but they are part of CSS3 and only Opera has made some progress on this so far.
Another thing that I have been working on is a new gadget called Print dialog. It helps you influence how pages are printed, right from Wikipedia. You can remove backgrounds, images and references, and mark all the text as black. Really very useful for if you intend to do some quick printing and since there is demand (Bugzilla 25869, bugzilla 22256), we might actually see this one day in the MediaWiki software.
The most esoteric function of Print dialog, is an option to actually kill the print styling. Normally when you print Wikipedia pages, you will use a different set of stylesheets that are optimized for printing instead of the screen. These stylesheets hide the interface components and elements that might not be useful in print. Usually this is wonderful, but sometimes I just want it all, and on my browser (Safari), this was not possible (well you could make a screenshot). With this new option you can actually fake the screen media while you print. Currently it works only for Safari. IE is untested, and Firefox/Opera refuse me to give the access I need to adapt the stylesheets, due to the Same Origin policy, which is violated due to the usage by the Foundation of a separate server for the stylesheets (Bugzilla 25886).
I think this could be a welcome feature for many, please let me know what you think !
Printing webpages has long intrigued me and the results have always been suboptimal, especially with something as complex as Wikipedia articles. However, the web is moving forward and the printing options for the web are getting better with every browser release. The past few days I was revisiting this issue and I have now added some new CSS to the print stylesheet of MediaWiki which should help browsers detect proper spots to insert pagebreaks and more importantly, where to avoid them.
 |  |
| Before pagebreak CSS | After pagebreak CSS |
Another thing that I have been working on is a new gadget called Print dialog. It helps you influence how pages are printed, right from Wikipedia. You can remove backgrounds, images and references, and mark all the text as black. Really very useful for if you intend to do some quick printing and since there is demand (Bugzilla 25869, bugzilla 22256), we might actually see this one day in the MediaWiki software.
The most esoteric function of Print dialog, is an option to actually kill the print styling. Normally when you print Wikipedia pages, you will use a different set of stylesheets that are optimized for printing instead of the screen. These stylesheets hide the interface components and elements that might not be useful in print. Usually this is wonderful, but sometimes I just want it all, and on my browser (Safari), this was not possible (well you could make a screenshot). With this new option you can actually fake the screen media while you print. Currently it works only for Safari. IE is untested, and Firefox/Opera refuse me to give the access I need to adapt the stylesheets, due to the Same Origin policy, which is violated due to the usage by the Foundation of a separate server for the stylesheets (Bugzilla 25886).
 |  |  |
| Example print output with no images | Print output without references and backgrounds | Print output with all non-print elements restored |
Comments
Post a Comment