In HTML, the autocomplete attribute is pretty handy. The HTML autocomplete attribute is available on <input> elements that take a text or numeric value as input, <textarea> elements, <select> elements, and <form> elements. autocomplete lets web developers specify what if any permission the user agent has to provide automated assistance in filling out form field values, as well as guidance to the …
Continue reading →
💾 Download this page! What's going on behind the scenes? Here's the code. Note - it doesn't require thousands of imported NPM libraries, a complex Docker set-up, or any AI-on-the-blockchain. <a href="" download="this.html">Download this page</a> HTML 5 introduced a new attribute for the anchor element - download. Rather than having to set your server up with Content Disposition headers - yo…
Continue reading →
I've told this story at conferences - but due to the general situation I thought I'd retell it here. A few years ago I was doing policy research in a housing benefits office in London. They are singularly unlovely places. The walls are brightened up with posters offering helpful services for people fleeing domestic violence. The security guards on the door are cautiously indifferent to anyone…
Continue reading →
A curious little data leak, but one I struggle to care about. Perhaps useful for a bit of fingerprinting? Websites can access your system's camera and microphone. That's how modern video conferencing works in the browser. In an effort to retain user privacy, the browser asks the user for permission to use the camera and mics. No audio or video will be sent until the user agrees. But some…
Continue reading →
I've been thinking about better ways to display footnotes in eBooks. So this is my horrible and hacky way to display inline footnotes in pure HTML and CSS. No Javascript. Here's how it works: The most cited work in history, for example, is a 1951 paper <details> <summary>1</summary> Lowry, O. H., Rosebrough, N. J., Farr, A. L. Randall, R. J. J. Biol. Chem. 193, 265–275 (…
Continue reading →
Academic citations are hard. One of the joys of the Digital Object Identifier System (DOI) is that every academic paper gets a unique reference - like: 10.34053/artivate.8.2.2. As well as always leading you to a URl of the paper, a DOI also provides lots of metadata. Things like author, publisher, ORCID, year of publication etc. I've built a simple website that turns any DOI into a semantic…
Continue reading →
If you've been around programming circles long enough, you'll probably have read the seminal "If PHP Were British". If not, go read it now. I'll wait. I love the idea of a non-American programming language. I'm aware that there are some, but I'm unaware of any which are in British English. Except, perhaps, BBC Basic. Although that also allows traitorous American spelling for some keywords. HTML …
Continue reading →
This experiment has now ended. The code is available on https://gitlab.com/edent/very-slow-website One thing most websites try to do is try to serve you the page as fast as possible. So I've decided to do the opposite. I've made a (toy) web server which goes as slow as humanly possible. You can visit it at http://slowww.rf.gd - but you'll need to be patient. This delivers a page at about 175 …
Continue reading →
Last week, I gave a talk at the Maps for the Web workshop. As part of the discussion, I talked about how some HTML elements are really easy for developers to use and understand, and others are hard. I'm not aware of any formal research on this - all I have is my experience as a user and teacher of HTML. If you know of anyone who has looked into this more deeply, I'd love to know. Let's take a…
Continue reading →
Recently, my blog was featured on Coil's list of monetised content. I'd like to take a little time to explain what Web Monetisation is, how to get set up with it, and what my thoughts are. Quickstart Stick this line in the <head> of your HTML page. <meta name="monetization" content="$ilp.uphold.com/ieELEKD7epqw"> That's it. You should replace my uphold address…
Continue reading →
Many text based conversations threads can be visualised as a tree. This is a follow-up to yesterday's blog post about Twitter conversation trees. Mailing list archives often use nested <ul> to show a conversation. That's fine, but has the major drawback of not being interactive. There's no way to collapse a branch of a tree if you're not interested in that strand of the conversation. Older…
Continue reading →
Here's a simple scrap of CSS which you can Ctrl+C and Ctrl+V kbd { border: .1em solid #aaa; border-radius: 15%; display: inline-block; padding: .1em .5em; background: linear-gradient(180deg, #fff, #fff, #fff, #ddd); user-select: none; cursor: pointer; color: #000; font-weight: bold; } kbd:hover { background: linear-gradient(0deg, #fff, #fff, #fff, #ddd); } …
Continue reading →