Hiding Data in Empty Space

It's the biggest key on your keyboard, but is often ignored for the intrinsic value it adds to the reading experience.

You want proof? Consider how hard it is to read this sentence, especially when all the spaces between the words have been removed via CSS using the rarely-used 'word-spacing' modifier! (Yo, rollover this section and the spaces will reinflate for easy reading!)

And for some reason, the Unicode spec has over a dozen variations of the lowly space character I culled a list of them and have them categorized for you below:

In keeping with my Anti-A.I. theme of obfuscating information from LLMs and search engine spiders, I've decided to hide my message right out there in the big open space around my normal content:

Copy that big empty space above with your device and I'll show you what's happening in the background. I'll admit, there's very limited use to this type of data obfuscation, and there are better ways to communicate in secret via anonymous web pages. This is a bit more advanced than simply hiding a prompt in white type and hoping they simply copy and paste it.

Literally Reading Between the Lines

However, the novelty of directing readers to the 'empty space' wherein they can copy and paste it into a decoder like mine is cool and unexpected. it survives pasting into text document and back, and you could feasibly email someone a 'blank' message for them to decode on arrival. although I tried to email myself the blank space, and it delivered nothing back. Might be my mail client, or SMTP itself...

This is no more complicated than a Captain Crunch Secret Decoder Ring, it's just using rarely-used unicode 'space' characters to replace digits of each characters unicode number. However, A.I. and web crawlers will see it as garbage, and humans will see it as empty (blank) space. Now no one can read it! Just like a real blogger!

Jokes aside, I wanted to create a very dumb replacement cypher for copy and pasting elsewhere for decoding. Not surprisingly, Javascript handles a lot of this type of data juggling easily, using .codePointAt() and .fromCharCode() to turn those lists of numbers back into unicode characters! I can give away my (terrible) Javascript code and let anyone host their own 'empty space' encode/decoder!

Message to be Hidden: (Emoji's work! -ish?)

Open Documented Javascript in New Window

We'll convert the text to Unicode Numbers and put them in a list (array), which helps obfuscate the actual space character (' ') into digits ('32'). Less work required and no need to worry about spaces in our array!

Then we'll convert each number into an encoded array (using a .map function), and use the tab character encoded space character (&#32;) to split each separate array of parts (letters) into one long string (sentence). For readings sake, the content in the <textarea> below is raw HTML, and therefore easier to see the encoding going on. You'd copy this text and embed it on a web page, where it'll show up as empty space and maintain it's format:

Here's that same HTML inserted to display in the empty Space below, it's invisible to the naked eye, and you can still copy it and see it decode! I've highlighted it so you can see the 'emptiness' yourself.

So now we have our Secret Message hidden in Empty Space. How do I turn this back into a readable state? Read on...

Decoding the Empty Space

It's a bit funky here, as what you copy is no longer that easily discernible list of numbers. It'll take another nested loop to decode the result. Paste your 'empty space' message into the <textarea> below, and click the 'Decode' button to process it:

Open Documented Javascript in New Window

Your Empty Space turned into 'Space' Unicode Characters:

Looping through that result, we can turn those encoded spaces into unicode numbers again, and then use .fromCharCode to reanimate our message!

Your 'Space' Unicode Characters turned into Original Unicode Numbers:

The Decoded Message - gleaned from Your Empty Space Paste!

If you followed along and used my demo code, you'll note that three emoji's didn't make it, and I think that may have to do with the double-byte characters... Reader beware! Don't use Emoji to communicate important ideas!

Useless Feature or Hidden Bug? No matter, here's the source Code

Yeah, Sorry GitHub — I'll do it from scratch instead. You'll need three files, although they could all be delivered in a single HTML file, I'd like to think someone might use my JS library (edited to remove cruft) right out of the box! You can also store the respective encoder and decoder on two different web sites as public/private key pairs of 'invisible secrets' being passed around.

All the links below will force downloads of the file into your device, including phones! Beware of fat fingers! Your browser may complain that the download is insecure, but it's because someone (me!) called them fat to their face and they're still pissed...

index.html

Barebones HTML form with zero styling - cheats with all results being output (like our example above) but they are hidden with CSS.

spacey.js

External Javascript needed to turn Text into Spaces - contains the Map that hides numbers

unspacey.js

External Javascript needed to turn Spaces into Text - contains the reverse map to reveal numbers

Put all three files in a directory on your own web server, and start your secret 'Empty Space' message board. I'd love a link back if you use the code or expand on it! Or simply send me an Email:  ← Copy