Article 3PPHH The simplest online note-taking website

The simplest online note-taking website

by
Rob Beschizza
from on (#3PPHH)

trickery.jpg

Jan Erik Klouman's jjjjjjjjjjjjjjjjjjjj is a clever feat of minimalism: a web-based notepad so simple that the saved-to-desktop HTML file works as-is just like it did at the website. On Firefox, it even lets you paste images in! It's almost a joke--it's just a single HTML box with the "contentEditable" attribute--but it works, so who cares? [via Hacker News]

To save a note just store it on disk (cmd/ctrl+s). To add images, drag and drop them onto the text area. Remove the contenteditable attribute from <body>, save, and voila, you now have a static lightweight blog post ready to be published! Formatting can be a bit wonky but should work in some browsers (cmd/ctrl+b/i/u). Copy+pasting formatted text can potentially break things a bit.

The two colors are from Solarized. Feel free to download the file and update style/markup to your preference.

Some ideas/variations:

Dark theme: https://jjjjjjjjjjjjjjjjjjjj.github.io/new-note/dark.html

Serif: https://jjjjjjjjjjjjjjjjjjjj.github.io/new-note/serif.html

HN theme: https://jjjjjjjjjjjjjjjjjjjj.github.io/new-note/hn.html

With heading: https://jjjjjjjjjjjjjjjjjjjj.github.io/new-note/with-heading...

It's hard to one up this, and trying only makes it less attractive, but here goes: paste

data:text/html, <html contenteditable style='padding:10%;'>
into your browser bar and hit return, then drag the generated page's info icon/navicon from the URL bar to the bookmarks bar, thereby creating a bookmarklet. Clicking that bookmarklet will create new blank contenteditable pages that can be saved the same way. Customize the look by stuffing your favorite CSS into that style attribute. Adding a whole <style> section used to be possible but doesn't seem to work anymore, presumably because modern browsers won't run any old nonsense pasted into a URL bar.
External Content
Source RSS or Atom Feed
Feed Location http://boingboing.net/rss
Feed Title
Feed Link http://boingboing.net/
Reply 0 comments