Best vector image format for Mac

Targets macOS
41

I think I’ve found a solution for you!

<!DOCTYPE html>
<html>
<head>
	<title>PDF in HTML</title>
</head>
<body>
<p>here is some random text before</p>
	<div><object data="file:///Users/eric.w/Desktop/sample.pdf"></object></div>
	<p> and here is some after text</p>
</body>
</html>

Using Safari, this lets me copy and paste whatever I like into Pages, and it comes across as vector. I tried a few different approaches of embedding the PDF into the HTMl and not all worked; this one works like a charm.

Try it out with a PDF that is hosted on a web server. It might behave differently.

42

Yep - that’s what I meant but was reading PDF :open_mouth: … my point (no matter how dull) was that there was a great solution in Postscript that could handle things like this before all of the new standards started appearing.

1 Like
43

Thanks, that does seem to work. Apart from the PDF file which has a thick border around it.

I’ll have to figure out what Safari is doing to make the clipboard work. Simply putting a webarchive on it doesn’t make it paste-able.

44

Well, do you need to know how Safari is doing it? Seems like building your HTML like this would serve your needs.

45

Yes, that is fine. But will the html viewer generate all of the correct clipboard. I’ll have to try it.

OK, on the HTMLViewer, if I simply Select all and right click copy it works correctly. Which is a relief.

46

So to summarise:

  • SVG is well supported in a browser context, but is less well supported in other locations:
    – For example SVG cannot be pasted into a document, even if you can get it onto the clipboard.

  • SVG and Dark mode is excellent:
    – SVG is easy to style and can be used for dark or light mode with only simple CSS required.

  • PDF is better supported across the OS:
    – Paste into applications is more often supported.

  • PDF and Dark mode is almost impossible:
    – Almost every viewer draws a PDF with a white background.
    – Dark mode support is almost non-existent. Black text, lines etc are always black.

So as an interface element SVG works better, due to dark mode support.

As a paste-able scalable image format, PDF works better as more applications support it as an image format.

47

That’s about the shape of it. Different technologies for different scenarios.

If you implemented your own copy routine, perhaps you could have it display the SVG for screen purposes but copy the PDF for pasting purposes. Or maybe this can be done right in HTML/CSS.

48

I’ve tried all sorts of options. You have very little control over the pdf viewer. One of the developers of the viewer for Chrome confirmed this. There are almost no APIs for adjusting it from the web side.

I did think about generating both, as you say. It would slow things down though. Plus the odd copy mechanism. I rather wanted the ability to copy the whole output in one go, which the html + pdf solution offered.