itty.bitty - A tool to create sites that are contained entirely within their own URL

[Arthur]

You can either visit itty.bitty.site to create a website there or download the source code from GitHub (link below) if you want to host it yourself.

 

Website / Download (Source Code) / Learn more: How it works, Advanced editing, Security

 

Itty bitty sites are contained entirely within their own link. (Including this one!) This means they're...

 

💼 Portable - you don't need a server to host them

👁 Private - nothing is sent to–or stored on–this server

🎁 Easy to share as a link or QR code

 

Itty bitty sites can hold about as much as a printed page, and there is a lot you can do with that:

 

✒️ Compose poetry

🛠 Create an app

🐦 Bypass a 140 280 char limit

🎨 Express yourself in ascii

 

How itty.bitty works

 

TL;DR:

itty.bitty takes html (or other data), compresses it into a URL fragment, and provides a link that can be shared. When it is opened, it inflates that data on the receiver’s side.

 

✏️ Composing

You can edit directly on itty.bitty with simple formatting. If you want something richer, use HTML files or Codepen (see the advanced section of the about page).

 

🗜 Compression

To fit more in the URL, the content is compressed using the Lempel–Ziv–Markov chain algorithm. This significantly reduces the size of html, allowing for nearly a printed page worth of content.

 

🔗 Link Creation

This compressed data is base64 encoded, which converts it into to a set of letters and numbers that can be included in a URL.

 

#️⃣ Fragments

itty.bitty stores this text in a section of the URL called a fragment–everything after the first # symbol.

 

http://itty.bitty.site/#Name/SITE_DATA

 

Fragments have a unique property: they are not sent to the server when requesting a website. Instead, the web browser traditionally uses them to scroll the page when it is loaded.

 

💬 Sharing

The links that are generated from this process are complete and substantial. While most sites/apps support about 2000 bytes (2KB), some can handle more.

 

Twitter, for example, allows 4000 bytes in a link, accommodating a significant amount of text. Edgar Allan Poe's The Raven comes out to just under this. Longer sites can still be used via domain redirect (which is how this and many of the other examples are stored)

 

🌐 Display

Once the link is sent and opened, it loads itty.bitty.site to reverse the process, which is done completely on device. The data is extracted, inflated, and then shown in the web browser.

 

🗒️ Other Notes

Scripting is enabled on these sites, which allows for greater flexibility, but can enable malicious use. Approach any content with caution and do not share personal information.