GoKawiilI wrote this piece by hand and photographed the pages. After that, I wanted to make the text copy-pasteable. So I put the images into one SVG file with a text overlay:
Pictured: overlaid + spaced out text. Notice the ` spacers and extra spaces.
The font (Barlow Condensed – Italic Condensed) and the line height roughly match my handwriting’s dimensions. For spacing, the idea was that I’d add spacing characters that’ll be removed in Javascript during the copy-paste event that fires on the webpage.
I used ` (backtick) characters for narrow spaces that’ll be fully removed, and multiple spaces between words where I planned to collapse them into just 1 space. The hyperlinks are made using Inkscape’s Create Anchor functionality.
After exporting the SVG file, it required some post-processing:
Embedding the font using <style>
Replacing the ` characters with Six-per-em Space characters so the backticks don’t show up when selected
Replacing the linked local image filepaths with full URLs