finger

Test your site in Lynx

When was the last time you tested your website in a text-only browser like Lynx (or ELinks, or one of several others)? Perhaps you should.

I’m a big fan of CSS Naked Day. I love the idea of JS Naked Day, although I missed it earlier this month (I was busy abroad, plus my aggressive caching, including in service workers, makes it hard to reliably make sweeping changes for short periods). I’m a big fan of the idea that, for the vast majority of websites, if it isn’t at least usable without any CSS or JavaScript, it should probably be considered broken.

This year, I thought I’d celebrate the events by testing DanQ.me in the most-limited browser I had to-hand: Lynx. Lynx has zero CSS or JavaScript support, along with limited-to-no support for heading levels, tables, images, etc. That may seem extreme, but it’s a reasonable analogue for the level of functionality you might routinely expect to see in the toughest environments in which your site is accessed: slow 2G connections from old mobile hardware, people on the other side of highly-restrictive firewalls or overenthusiastic privacy and security software, and of course users of accessibility technologies.

Here’s what broke (and some other observations):

`<link rel="alternate">`s at the top

I see the thinking that Lynx (and in an even more-extreme fashion, ELinks) have with showing “alternate versions” of a page at the top, but it’s not terribly helpful: most of mine are designed to help robots, not humans!

I wonder if switching from <link rel="alternate"> elements to Link: HTTP headers would indicate to Lynx that it shouldn’t be putting these URLs in humans’ faces, while still making them accessible to all the services that expect to find them? Doing so would require some changes to my caching logic, but might result in a cleaner, more human-readable HTML file as a side-effect. Possibly something worth investigating.

Fortunately, I ensure that my <link rel="alternate">s have a title attribute, which is respected by Lynx and ELinks and makes these scroll-past links slightly less-confusing.

Post list indentation

Posts on the homepage are structured a little like this:

<li>
  <a href="...">
    <h2>Post Title</h2>
    <p>...post metadata, image, and things...</p>
  </a>
</li>

Strictly-speaking, that’s not valid. Heading elements are only permitted within flow elements. I chose to implement it that way because it seemed to be the most semantically-correct way to describe the literal “list of posts”. But probably my use of <h2> is not the best solution. Let’s see how Lynx handles it:

It’s not intolerable, but it’s a little ugly.

CSS lightboxes add a step to images

I use a zero-JavaScript approach to image lightboxes: you can see it by clicking on any of the images in this post! It works by creating a (closed) <dialog> at the bottom of the page, for each image. Each <dialog> has a unique id, and the inline image links to that anchor.

Originally, I used a CSS :target selector to detect when the link had been clicked and show the <dialog>. I’ve since changed this to a :has(:target) and directed the link to an element within the dialog, because it works better on browsers without CSS support.

It’s not perfect: in Lynx navigating on an inline image scrolls down to a list of images at the bottom of the page and selects the current one: hitting the link again now offers to download the image. I wonder if I might be better to use a JavaScript-powered lightbox after all!

gopher: and finger: links work perfectly!

I was pleased to discover that gopher: and finger: links to alternate copies of a post… worked perfectly! That shouldn’t be a surprise – Lynx natively supports these protocols.

In a fun quirk and unusually for a standard of its age, the Finger specification did not state the character encoding that ought to be used. I guess the authors just assumed everybody reading it would use ASCII. But both my WordPress-to-Finger bridge and Lynx instead assume that UTF-8 is acceptable (being a superset of ASCII, that seems fair!) which means that emoji work (as shown in the screenshot above). That’s nuts, isn’t it?

You can’t react to anything

Back in November I added the ability to “react” to a post by clicking an emoji, rather than typing out a full comment. Because I was feeling lazy, the feature was (and remains) experimental, and I didn’t consider it essential functionality, I implemented it mostly in JavaScript. Without JavaScript, all you can do is see what others have clicked.

Emoji reactions screenshot showing thumbs up, star eyes, surprise, muscle flex, nausea, and a dinosaur. — The available emoji vary from post to post; I sometimes like to throw a weird/fun one in there, knowing that it’ll invariably be Ruth that clicks it first.

In a browser with no JavaScript but with functional CSS, the buttons correctly appear disabled.

But with neither technology available, as in Lynx, they look like they should work, but just… don’t. Oops.

If I decide to keep the reaction buttons long-term, I’ll probably reimplement them so that they function using plain-old HTML and HTTP, using a <form>, and refactor my JavaScript to properly progressively-enhance the buttons for those that support it. For now, this’ll do.

Comment form honeypot

The comment form on my blog posts works… but there’s a quirk:

At the end of the comments form, an additional <textarea> appears!

That’s an annoyance. It turns out it’s a honeypot added by Akismet: a fake comments field, normally hidden, that tries to trick spam bots into filling it (and thus giving themselves away): sort-of a “reverse CAPTCHA” where the robots do something extra, unintentionally, to prove their inhumanity. Lynx doesn’t understand the code that Akismet uses to hide the form, and so it’s visible to humans, which is suboptimal both because it’s confusing but also because a human who puts details into it is more-likely to be branded a spambot!

I might look into suppressing Akismet adding its honeypot field in the first place, or else consider one of the alternative anti-spam plugins for WordPress. I’ve heard good things about Antispam Bee; I ought to try it at some point.

Overall, it’s pretty good

On the whole, DanQ.me works reasonably well in browsers without any JavaScript or CSS capability, with only a few optional features failing to function fully. There’s always room for improvement, of course, and I’ve got a few things now to add to my “one day” to-do list for my little digital garden.

Obviously, this isn’t really about supporting people using text-mode browsers, who probably represent an incredible minority. It’s about making a real commitment to the semantic web, to accessibility, and to progressive enhancement! That making your site resilient, performant, and accessible also helps make it function in even the most-uncommon of browsers is just a bonus.

Yesterday’s Internet Today! (Woo DM 2023)

The week before last I had the opportunity to deliver a “flash talk” of up to 4 minutes duration at a work meetup in Vienna, Austria. I opted to present a summary of what I’ve learned while adding support for Finger and Gopher protocols to the WordPress installation that powers DanQ.me (I also hinted at the fact that I already added Gemini and Spring ’83 support, and I’m looking at other protocols). If you’d like to see how it went, you can watch my flash talk here or on YouTube.

If you love the idea of working from wherever-you-are but ocassionally meeting your colleagues in person for fabulous in-person events with (now optional) flash talks like this, you might like to look at Automattic’s recruitment pages…

The presentation is a shortened, Automattic-centric version of a talk I’ll be delivering tomorrow at Oxford Geek Nights #53; so if you’d like to see it in-person and talk protocols with me over a beer, you should come along! There’ll probably be blog posts to follow with a more-detailed look at the how-and-why of using WordPress as a CMS not only for the Web but for a variety of zany, clever, retro, and retro-inspired protocols down the line, so perhaps consider the video above a “teaser”, I guess?

Finger Portal to WordPress Blog

Finger Primer

The finger protocol, first standardised way back in 1977, is a lightweight directory system for querying resources on a local or remote shared system. Despite barely being used today, it’s so well-established that virtually every modern desktop operating system – Windows, MacOS, Linux etc. – comes with a copy of finger, giving it a similar ubiquity to web browsers! (If you haven’t yet, give it a go.)

If you were using a shared UNIX-like system in the 1970s through 1990s, you might run finger to see who else was logged on at the same time as you, finger chris to get more information about Chris, or finger alice@example.net to look up the details of Alice on the server example.net. Its ability to transcend the boundaries of different systems meant that it was, after a fashion, an example of an early decentralised social network!

I first actively used finger when I was a student at Aberystwyth University. The shared central computers osfa and osfb supported it in what was a pretty typical way: users could add a .plan and/or .project file to their home directory and the contents of these would be output to anybody using finger to look up that user, along with other information like what department they belonged to. I’m simulating from memory so this won’t be remotely accurate, but broadly speaking it looked a little like this –

$ finger dlq9@aber.ac.uk
Login: dlq9                           Name: Dan Q
Directory: /users/9/d/dlq9      Department: Computer Science

Project:
Working on my BEng Software Engineering.

Plan:
    _______
---'   ____)____
          ______)  Finger me!
       _____)
      (____)
---.__(___)

It’s not just about a directory of people, though: you could finger printers to see what their queues were like, finger a time server to ask what time it was, finger a vending machine to see what drinks it had available… even finger for a weather forecast where you are (this one still works as shown below; try it for your own location!) –

$ finger oxford@graph.no
        -= Meteogram for Oxford, Oxfordshire, England, United Kingdom =-
 'C                                                                   Rain (mm)
 12
 11
 10                                                         ^^^=--=--
  9^^^                                                   ===
  8   ^^^===      ======                              ^^^
  7         ======      ===============^^^         =--
  6                                       =--=-----
  5
  4
  3        |  |  |  |  |  |  |                                        1 mm
    17 18 19 20 21 22 23 18/11 02 03 04 05 06 07_08_09_10_11_12_13_14 Hour

     W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W  W Wind dir.
     6  6  7  7  7  7  7  7  6  6  6  5  5  4  4  4  4  5  6  6  5  5 Wind(m/s)

Legend left axis:   - Sunny   ^ Scattered   = Clouded   =V= Thunder   # Fog
Legend right axis:  | Rain    ! Sleet       * Snow

If you’d just like to play with finger, then finger.farm is a great starting point. They provide free finger hosting and they’re easy to use (try finger dan@finger.farm to find me!). But I had something bigger in mind…

Fingering WordPress

What if you could finger my blog. I.e. if you ran finger blog@danq.me you’d see a summary of some of my recent posts, along with additional addresses you could finger to read the full content of each. This could be the world’s first finger-to-WordPress gateway; y’know, for if you thought the world needed such a thing. Here’s how I did it:

Installed efingerd; I’m using the Debian binaries.
Opened a hole in the firewall on port 79 so the outside world could access it (ufw allow 1965; utf reload).
The default configuration for efingerd acts like a “typical” finger server, but it’s highly programmable to make it “smarter”. I:
1. Blanked /etc/efingerd/list to prevent any output from “listing” the server (finger @danq.me).
2. Replaced the contents of /etc/efingerd/list and /etc/efingerd/nouser(which are run when a request matches, or doesn’t match, a user account name) with a call to my script: /usr/local/bin/finger-to-wordpress "$3". $3 holds the username that was requested, so we can act on it.
3. Created /usr/local/bin/finger-to-wordpress – a Ruby program that either (a) lists a selection of posts or (b) returns a specific post (stripping the HTML tags)

In future, I might use some extra tags or metadata to enhance finger-friendly WordPress posts. The infrastructure’s in place already (I already have tags that I use to make certain kinds of content available only via certain media – shh!). You might rightly as what the point is of this entire enterprise, of course, and you’d be well within your rights to ask such a question. But I think the best answer available is “because Dan”.

If you want to see my blog in a whole new way, give it a go: run finger blog@danq.me on your computer and follow the instructions.

Your Experience May Differ

To: Daniel Hill <dlh9@….>
	
From: Dan Q <dan@….>
	
Subject: Aberystwyth University Is Awesome! Warning: Your Experience May Differ.
	
		Dear Daniel,
	
		There’s an age-old tradition amongst Aberystwyth graduates, and in particular amongst Computer Science graduates. But to truly understand it, you first need to understand a
		little bit about Aberystwyth University. Also, to understand recursion, you must first understand recursion (you’ll “get” that joke by your second year, if you don’t already).
	
		As you know, your username is “dlh9”. There’s a reason for that: The letters are your initials. “But I don’t have a middle name,” I hear you cry (or, at least, not one that the
		University know about), “Where’s the ‘L’ come from?” Well, it turns out that Information Services, who look after all of the computer networks, have a System [TM]. And their System
		[TM] is that staff get usernames like “abc”, undergrads get “abc1”, postgrads get “abc12”.
	
		(this has lead to some awesome usernames: for example, “bed” used to be the username of somebody from Residential Services, and “sad” was once the username of one of the counsellors
		at the Students’ Union)
	
		Anyway, I digress. I was talking about usernames. The digit in your username is the year you started your course. So, because you’re starting this year, yours is “9” (see, ‘cos it’s
		2009 – get it?). You’re not allowed to spend more than nine years getting your degree, so that’s a pretty good primary key (you probably know what one of those is, but if not, you
		will before the academic year is out). Postgraduates get two digits because they often hang around for years and years. I don’t know what would happen if somebody spent a century
		getting their PhD, but I’m guessing that it wouldn’t be pretty.
	
		And so there’s been a long-standing tradition amongst Aber grads, and particularly Comp. Sci. Aber grads, and especially particularly Comp. Sci. Aber
		grads-who-graduated-and-got-jobs-in-Aberystwyth and never got around to leaving… that when their username comes up for “renewal” – when a decade passes after they first started their
		course – they finger (you’ll learn what that means soon enough, too) the Aber computer systems and check if their username has been re-assigned. It’s a great way to make yourself feel
		old, as if the annual influx of younger-every-year Freshers didn’t do that perfectly well already.
	
		Over the years, I’ve seen many friends play this little game. Some of them won, but most of them lost – it turns out that the odds aren’t really on your side: there are 17,576
		conceivable username combinations each year – from aaa9 to zzz9 – and only 3,000 new students, so odds are less than 50% whether or not you ignore the statistical biases that mean
		that things like “qxz9” (Quentin X. Zachary?) are basically never going to turn up.
	
		So imagine my surprise when I, for the first time, get to play the game, today… and I not only win, but I get a double-win, because the person to whom my old username has been
		recycled is an undergraduate in my old department!
	
		Yes: I was the last owner of “dlh9”. I was “dlh9” from 1999, when I started, to 2004, when I graduated, an alumni of the Computer Science Department at what was then the University of
		Wales, Aberystwyth (it changed it’s name to Aberystwyth University shortly afterwards – this, combined with the fact that I have since changed my name by deed poll, means that I am
		the proud owner of a degree certificate that contains neither my name nor the name of an existing university!). At the time, my name was Daniel Huntley – I didn’t have a middle name,
		either – and I spent five years getting a four-year degree in Software Engineering before I started working for a software company here in this very town. I haven’t yet got around to
		leaving.
	
		It still feels strange to write an e-mail to your e-mail address – my old e-mail address. It feels like I’m writing an e-mail to myself. I wonder what I’d have made of it if I’d have
		received this e-mail when I first arrived at University. It’s not so hard to imagine: the person I am now would be unrecognisable to the person I was back then, just like I am a
		complete stranger to you, but writing to you nonetheless. But even if you discard this e-mail and never think of it again, you’ll have done me a wonderful service by allowing me the
		chance to participate in a fascinating thought experiment that has granted me a great and deep nostalgia for the time I spent at that University.
	
		(by the way; I apologise if your e-mail address is still getting the spam it used to get when it belonged to me)
	
		Like me, Aber’s changed over the last ten years. The University’s changed, and the Computer Science Department has changed too. But I’m sure that you’ll find the place as beautiful
		and as satisfying as it has always been: this remarkable town on the West coast of Wales, where the mountains meet the sea, full of strange and quirky characters, a million miles from
		anywhere, and truly unique. I find myself longing for you to have *my* experience of Aberystwyth; to do all the great things I did, to meet all the great people I did – but you won’t.
		You won’t have the same lovers; you won’t discover the same music; you won’t join the same clubs; you won’t have the same beautiful sunsets while you roast burgers on disposable
		barbeques and the rising tide laps at your ankles; you won’t have the same hangovers; you won’t scrape through the same exams; you won’t steal the same traffic cones; you won’t climb
		the same mountains. A different story told differently.
	
		You won’t have any of the things that made my time here in Aberystwyth so wonderful for the last ten years, but don’t dispair, because you’ll have something far better – you’ll have
		all of your own marvellous experiences. Mine are mine in nostalgia alone, but yours are yet to come. And I hope you have an ass-kickingly good time, because that’s what every Aber
		Comp. Sci undergrad deserves when they come to this magical corner of the world.
	
		When you get as far as your lectures, tell Richard Shipman I said “Hi”. That’ll put you in
		his good books, I’m sure. ;-)
	
		And if you see me around town, give me a wave and I’ll buy you a pint. If you got nothing else from reading this old man’s drivel, you just earned yourself a free pint. When I was a
		student, I’d have called that a win-win. Your experience may differ.
	
		Good luck, and best wishes;
	
		—
		
		Dan Q
	
		Home

<link rel="alternate">s at the top