Editing Results of Evernote's Web Clipper
December 5, 2013 8:49 AM Subscribe
Evernote's web-clipper is super convenient, but creates clippings in a non-standard format making them tickly to edit and often unreadable when exported into HTML (e.g. for sharing). Any tips for quickly/efficiently stripping off some of the style/formatting kludge?
EV's web clipper is great for stuff like grabbing recipes off the internet....while including all the artwork and comments (which conventional recipe storage sites like Pepperplate leave off). I like the speed and ease. But the clipper takes a brute force approach, and as a result:
1. it's annoyingly hard to edit out errant social media icons and other kludge (e.g. deleting some element can effect massive changes throughout the clipping)
2. the clippings are in a non-standard format (not unlike the output of really crappy auto web site building software), which doesn't effectively export as HTML (e.g. to share). Plus, I'm skeptical that in 15 or 20 years, Evernote will still be able to interpret these clippings.
I rarely need to preserve anything but photos and text, and I'm not fussy about formatting. Can anyone suggest a way to de-kludge these clippings? I definitely don't want to delve into the HTML (that'd feel like work); is there an environment I can cut/paste into which might strip off some of the crazy, simplifying things into more of an RTF environment or something (from which I can paste back into EV)? Or other solutions?
EV's web clipper is great for stuff like grabbing recipes off the internet....while including all the artwork and comments (which conventional recipe storage sites like Pepperplate leave off). I like the speed and ease. But the clipper takes a brute force approach, and as a result:
1. it's annoyingly hard to edit out errant social media icons and other kludge (e.g. deleting some element can effect massive changes throughout the clipping)
2. the clippings are in a non-standard format (not unlike the output of really crappy auto web site building software), which doesn't effectively export as HTML (e.g. to share). Plus, I'm skeptical that in 15 or 20 years, Evernote will still be able to interpret these clippings.
I rarely need to preserve anything but photos and text, and I'm not fussy about formatting. Can anyone suggest a way to de-kludge these clippings? I definitely don't want to delve into the HTML (that'd feel like work); is there an environment I can cut/paste into which might strip off some of the crazy, simplifying things into more of an RTF environment or something (from which I can paste back into EV)? Or other solutions?
Best answer: My Evernote web clipper gives me a "Simplified Article" option, which cleans things up nicely. Have you tried that?
posted by KevCed at 9:15 AM on December 5, 2013
posted by KevCed at 9:15 AM on December 5, 2013
Response by poster: Thanks, KevCed, but does not seem to be available on Safari.
Also, I mostly use the clipper to clip the selected portion of the page (so there's less to remove in later editing). Not sure that'd work with simplified.
posted by Quisp Lover at 9:19 AM on December 5, 2013
Also, I mostly use the clipper to clip the selected portion of the page (so there's less to remove in later editing). Not sure that'd work with simplified.
posted by Quisp Lover at 9:19 AM on December 5, 2013
Best answer: I am probably one of the two most knowledgable people on how the Evernote Web Clipper works in the world (I wrote it), but I left Evernote about a year ago and I know they launched a new one recently. I doubt the storage format has changed with the new version, though, since it was a compromise even in the old one due to needing backwards compatibility with the existing Evernote note format and older Evernote clients.
The format is not "non-standard" so much as it is annoying. It inlines *all* styling information for everything because the format in which it's stored doesn't support "style" tags or separate stylesheets. Doing this even close to correctly in the environment of a web browser is actually *really* hard, as the browser doesn't actually give you access to everything you need to know to figure this out. I reimplemented significant chunks of a CSS processing engine in Javascript to make it work.
Editing annoyances: This is usually due to the way the clipped page was constructed in the first place. If a website author wants to use a little block of social media icons to enforce the fact that the following text actually falls below it on the page, and you remove that little block that had "clear:both" applied to it, it is easy for the whole layout of the page to change. There really isn't a lot you can do about these cases, and website authors don't really design their sites thinking, "What if someone wants to edit this later, *but not edit the CSS*?"
2) The clippings are strictly HTML, they just have lots of extra styling information.
posted by tylerkaraszewski at 9:19 AM on December 5, 2013 [9 favorites]
The format is not "non-standard" so much as it is annoying. It inlines *all* styling information for everything because the format in which it's stored doesn't support "style" tags or separate stylesheets. Doing this even close to correctly in the environment of a web browser is actually *really* hard, as the browser doesn't actually give you access to everything you need to know to figure this out. I reimplemented significant chunks of a CSS processing engine in Javascript to make it work.
Editing annoyances: This is usually due to the way the clipped page was constructed in the first place. If a website author wants to use a little block of social media icons to enforce the fact that the following text actually falls below it on the page, and you remove that little block that had "clear:both" applied to it, it is easy for the whole layout of the page to change. There really isn't a lot you can do about these cases, and website authors don't really design their sites thinking, "What if someone wants to edit this later, *but not edit the CSS*?"
2) The clippings are strictly HTML, they just have lots of extra styling information.
posted by tylerkaraszewski at 9:19 AM on December 5, 2013 [9 favorites]
Best answer: Thanks, KevCed, but does not seem to be available on Safari.
Top right corner of this image, with the green bullet next to it. this option strips certain styling information, it doesn't remove images.
posted by tylerkaraszewski at 9:28 AM on December 5, 2013
Top right corner of this image, with the green bullet next to it. this option strips certain styling information, it doesn't remove images.
posted by tylerkaraszewski at 9:28 AM on December 5, 2013
Response by poster: found the "simplified" option, thanks.
tylerk, great to have your reply, thanks much for stopping in. But per #2, I've tried html export on a lot of these clippings and gotten results that are absolutely garbled in browser.
That's the basis for my concern about EV v19 being able to interpret these clippings. EV is working some special magic here. As standards change, I'm worried it will be harder and harder to be backward compatible with this interpretation.
posted by Quisp Lover at 9:36 AM on December 5, 2013
tylerk, great to have your reply, thanks much for stopping in. But per #2, I've tried html export on a lot of these clippings and gotten results that are absolutely garbled in browser.
That's the basis for my concern about EV v19 being able to interpret these clippings. EV is working some special magic here. As standards change, I'm worried it will be harder and harder to be backward compatible with this interpretation.
posted by Quisp Lover at 9:36 AM on December 5, 2013
If you are talking about looking at the clips in your Evernote client (I'll assume the Mac client as you're using Safari) and selecting "File > Export Notes..." and using the HTML option, I cannot tell you for sure what that is doing, as I've never worked on the Mac client. Being that the underlying format of an Evernote note is essentially a subset of HTML, though, I'd be extremely surprised if it didn't just dump the note to disk. Can you post an example of a "non-standard" note you're getting out of Evernote?
I just exported a note that way and got this, which looks like pretty standard HTML with extra styling info to me.
posted by tylerkaraszewski at 9:49 AM on December 5, 2013
I just exported a note that way and got this, which looks like pretty standard HTML with extra styling info to me.
posted by tylerkaraszewski at 9:49 AM on December 5, 2013
Response by poster: Yes, I'm using export-to-HTML from within EV and then opening the HTML file with Safari.
None of the exports look like the notes. Most wind up at least weirdly aligned, like this:
example 1 (evernote view)
example 1 (safari view)
...and some are impossibly mangled, like this:
example 2 (evernote view)
example 2 (safari view)
Again, only half my concern is getting a better HTML export. My point is that whatever juju is making these look (a lot) better in EV than in browser is ALSO destined to stop working someday as EV cuts off some backward compatibility.
posted by Quisp Lover at 10:09 AM on December 5, 2013
None of the exports look like the notes. Most wind up at least weirdly aligned, like this:
example 1 (evernote view)
example 1 (safari view)
...and some are impossibly mangled, like this:
example 2 (evernote view)
example 2 (safari view)
Again, only half my concern is getting a better HTML export. My point is that whatever juju is making these look (a lot) better in EV than in browser is ALSO destined to stop working someday as EV cuts off some backward compatibility.
posted by Quisp Lover at 10:09 AM on December 5, 2013
Could you provide the actual HTML file you used to generate those Safari screenshots?
posted by tylerkaraszewski at 10:27 AM on December 5, 2013
posted by tylerkaraszewski at 10:27 AM on December 5, 2013
I'm not sure if this is relevant, because I don't fully understand your question, but I stopped using Evernote Web Clipper and started printing PDFs to Evernote (via "Save PDF to Evernote" in the PDF menu when printing) to get round some formatting issues.
posted by oliverburkeman at 10:28 AM on December 5, 2013
posted by oliverburkeman at 10:28 AM on December 5, 2013
Response by poster: TylerK, please check your mailbox
Good solution, oliver, but then I'm stuck with the entire page (including ads and other stuff), whereas web clipper lets me select portions of the page to clip. Yes, I do understand that it's that very power/flexibility that forces EV to bend over backwards creating something proprietary. And I likely have to make a choice (how nicely formatted I want the results versus how easy to share + vulnerability to data rot).
posted by Quisp Lover at 10:36 AM on December 5, 2013
Good solution, oliver, but then I'm stuck with the entire page (including ads and other stuff), whereas web clipper lets me select portions of the page to clip. Yes, I do understand that it's that very power/flexibility that forces EV to bend over backwards creating something proprietary. And I likely have to make a choice (how nicely formatted I want the results versus how easy to share + vulnerability to data rot).
posted by Quisp Lover at 10:36 AM on December 5, 2013
Response by poster: Hmm, could not send HTML via mail here after all. So....
Example 1:
http://pastebin.com/wNsJfGft
Example 2:
http://pastebin.com/wvdp37Jj
posted by Quisp Lover at 11:00 AM on December 5, 2013
Example 1:
http://pastebin.com/wNsJfGft
Example 2:
http://pastebin.com/wvdp37Jj
posted by Quisp Lover at 11:00 AM on December 5, 2013
Looking at the HTML in those notes, there's nothing strictly *wrong* with it, it's valid HTML, but it has some strange styling set in it. For instance, in the first note, "text-align: right" is set where it probably shouldn't be. In the second note, "line-height: 0" is set in various places where it shouldn't be.
I doubt this will turn into a compatibility issue in the future, the notes are just normal HTML, but somehow end up with some styling oddities in them when exported. There seem to be two major options here:
1) The notes are clipped and stored with incorrect styling in them, but Evernote for Mac manages to display them correctly anyway. This seems unlikely to me. I think that if they were clipped incorrectly, they'd show up in Evernote incorrectly.
2) Something about the export process for Evernote for Mac adds bad styling information. This seems more likely. It's possible that the exporter adds some sort of wrapper code around a note to get a "standard" base style for the note, and this might be incompatible with certain clipped notes, as clipped notes tend to be much more complex than most notes created by hand.
If number 2 is the case, then this problem is actually more likely to get *better* over time, in the case that such a bug gets fixed. The already exported copies of notes will continue to be broken, but in a potentially fixed future version of Evernote, you could export them again and they should work correctly at that time.
posted by tylerkaraszewski at 11:22 AM on December 5, 2013 [2 favorites]
I doubt this will turn into a compatibility issue in the future, the notes are just normal HTML, but somehow end up with some styling oddities in them when exported. There seem to be two major options here:
1) The notes are clipped and stored with incorrect styling in them, but Evernote for Mac manages to display them correctly anyway. This seems unlikely to me. I think that if they were clipped incorrectly, they'd show up in Evernote incorrectly.
2) Something about the export process for Evernote for Mac adds bad styling information. This seems more likely. It's possible that the exporter adds some sort of wrapper code around a note to get a "standard" base style for the note, and this might be incompatible with certain clipped notes, as clipped notes tend to be much more complex than most notes created by hand.
If number 2 is the case, then this problem is actually more likely to get *better* over time, in the case that such a bug gets fixed. The already exported copies of notes will continue to be broken, but in a potentially fixed future version of Evernote, you could export them again and they should work correctly at that time.
posted by tylerkaraszewski at 11:22 AM on December 5, 2013 [2 favorites]
Response by poster: I can't find fault with your logic, and glad that it may turn out that this is a more trustworthy storage solution than I'd expected (though I didn't solve my difficulty-of-editing problem!).
Thanks again!
posted by Quisp Lover at 11:47 AM on December 5, 2013
Thanks again!
posted by Quisp Lover at 11:47 AM on December 5, 2013
When I find something that looks like it's going to be a problem, I will post the stuff into Textpad (i am sure any plaintext editor will do), and then copy the results back into Evernote and format it to my own satisfaction. Then I copy and paste the pictures I want.
It's more work, but it allows me to avoid the kinds of issues you are encountering.
posted by The Blue Olly at 1:00 PM on December 5, 2013
It's more work, but it allows me to avoid the kinds of issues you are encountering.
posted by The Blue Olly at 1:00 PM on December 5, 2013
Response by poster: TBO:
But I'd like to keep some formatting....font, etc. Also, I'm fond of clipping long strings of web comments beneath recipes, and if you transform that sort of thing to plain text, things get really super ugly.
posted by Quisp Lover at 2:30 PM on December 5, 2013
But I'd like to keep some formatting....font, etc. Also, I'm fond of clipping long strings of web comments beneath recipes, and if you transform that sort of thing to plain text, things get really super ugly.
posted by Quisp Lover at 2:30 PM on December 5, 2013
Response by poster: (Informal/unofficial) word from Evernote is that the formatting problem with exporting has been replicated and acknowledged, but I shouldn't hold my breath for a fix.
Obviously, there is scant incentive (actually, negative incentive) to facilitate export of data from Evernote. The fact that they've got some sort of export function satisfies the need to reassure customers about lock-in. But devoting resources to making export work well (or even adequately) is another matter entirely.
posted by Quisp Lover at 7:04 PM on December 15, 2013
Obviously, there is scant incentive (actually, negative incentive) to facilitate export of data from Evernote. The fact that they've got some sort of export function satisfies the need to reassure customers about lock-in. But devoting resources to making export work well (or even adequately) is another matter entirely.
posted by Quisp Lover at 7:04 PM on December 15, 2013
This thread is closed to new comments.
posted by Quisp Lover at 8:51 AM on December 5, 2013