Copy and Pasting Parts of Web Pages


Imagine you could copy any part from a web page in your browser and paste it into a notebook in the cloud. Styles and images would be preserved, so that the clipped part looks just the same as on the original page, but it would be kept as you found it, for as long as you want, annotated with the time and place where it was originally found.

You could for example keep track of results from booking a trip across multiple web sites on a single notebook, adding your own comments as required, to remember what you did. These dynamically generated pages are usually printed off for preservation, but there should be a modern way to digitally preserve relevant parts.

Thinking this further, users could share notebooks with each other, just as any cloud document. They could even be published at fixed URLs for public display.

The old-fashioned way of doing this, is to take screenshots of the entire browser window, manually clip images from the screenshot, and pasting these into Word documents, or something similar. Clearly this can be streamlined with dedicated software.

How would this work? Web content is structured as HTML and the relevant style is defined in CSS. The entire content of a browser windows is present in the so-called DOM tree, which arises from HTML and CSS. The relevant section has to be lifted from this DOM. It is not entirely clear to me whether this can be done with a browser plugin, or whether a dedicated browser has to be developed for this application alone. The latter might be prohibitive for this project, but a plugin for the major browsers is doable.

Another variant would be to take automatic screenshots of the relevant sections, as selected with the mouse. These images would be inserted into the notebooks by the software. The main disadvantage is that you can’t select text sections from images, so returning data from the notebook is difficult.