Featherweb Blog

Blog index

Lovable Links

I used to be a bookmarks junkie, collecting all links that looked vaguely interesting until my bookmarks became a miserable jungle. Countless times I started with the intention to clean up, only to end up reading one or more of the articles I had forgotten I bookmarked.

in an effort to regain sanity, I created my browser's home page, a simple but beautiful dashboard/start page, an html page displaying just the 25 links I opened more or less every day.
That worked great for a while, but then I started to see a new problem arising: in real life, "important topics" are changing all the time. In fact, it is not exaggerated to say we humans are changing all the time, only acting as if we are the same person we were yesterday.

That's why I created a new page: Temporary Links. It was one of the 25 buttons in my browser home page.I was extremely happy with this solution for a while, until I realized it took too much boring and repetitious html-writing work to keep it updated.
A normal person would at this stage decide to buy an Apple and just follow the instructions and get on with it...I decided differently: let's see how far creativity could lead us towards an optimum solution, at no cost, staying within the featherweb approach...

That's how Lovable links was born

For the last couple of weeks I've been trying lots of scripts, all of them written with only one goal: to make a writer's life easier. Most of them Javascript, either using WYSIWYG (What You See Is What You Get) or Markdown. While I admire the talent the developers show, I did not get anywhere after installing them. That could be me, the simple guy, predestined to help end complexity, but literally none of the scripts I tried worked as intended. Some boasted having AutoSave, not explaining why they AutoForgot to do so about half of the time. Or have a brilliant way to add new links, not explaining why those links were unclickable (impossible to open).

Back to the Temporary Links... I started from scratch, after seeing the myriad of dependencies and libraries most projects need, I began to see a way out of all this .
For my Temporary Links I wrote a simple responsive html table: link-table Apart from row 1, it looks rather empty. ..it's not: every cell has been given an empty link tag. So all you have to do -just like in WYSIWYG and in markdown-, is enter the link (simply paste it) and give it a name. Just change
into this:

It would be difficult to make this easier, less complicated and more reliable. Any editor is okay. I use Atom and Geany because I like them both. For this kind of simple editing most editors will do. Geany opens and acts much faster than Atom for this lightweight work.

If you would like to play around with this, I have included the Lovable links project to download. It uses feather.css, but you could use any other css.. (Just replace feather.css with the new one and adjust the link rel="stylesheet" in the head of the html document to your chosen css.)

[ Edit Sept 6: Re-uploaded the Lovable Links file. A harmless, but superfluous line-break tag had sneaked into the first version and was copied over to the whole link table. Now corrected. ]

But why only 20 rows?

Yes, the table could be made much longer... but in this case, that would not be very helpful: these are temporary links. If you fill the whole table, something needs to be done: either move some of the entries to a more permanent place (bookmarks?) or delete them to make room for new temporary links.
But who am I to judge? Maybe 200 rows feels right for you and your project... just add them ;)


Bit too early for me. You decide...