By @edent · HTML metadata schema.org · 6 comments · 300 words
My name is Terence(/ˈtɛɹəns) Eden(ˈiːdən/). Modern HTML allows the user to use <ruby> to annotate text. This is usually used for furigana - which allows pronunciation to be placed above words. For example: "シン・ゴジラ (Shin Godzilla)" shows you how to pronounce both words if you are unfamiliar with kanji. The text can be any language […]
Continue reading →By @edent · css HTML · 7 comments · 250 words · read ~160 times.
Suppose you have lots of links on a page. You want to highlight the ones which point to example.com - is that possible in CSS without using JavaScript? Yes! This scrap of code will turn all those links red: a[href^="https://example.com"] { color: red; } Now, there are a few gotchas with this code. It matches […]
Continue reading →By @edent · HTML Social Media · 2 comments · 700 words · read ~143 times.
It is sometimes useful to embed the contents from one website into another. For example, you may wish to quote a post from a microblogging site like Twitter, Threads, BlueSky, or Mastodon. All of them offer an "embed" button which will copy a snippet of code for you to paste into your website. Here's how […]
Continue reading →By @edent · css HTML Web Development · 4 comments · 300 words · read ~140 times.
I am a bear of very little brains sometimes. I had a site which, for various boring reasons, was printing a <style> element in the middle of the HTML's body. Because <style> is a metadata element, it should only appear within the <head> element. This is OK: <!doctype html> <html> <head> <style> a { color: […]
Continue reading →By @edent · HTML schema.org semantic web · 7 comments · 650 words · read ~1,872 times.
I'm a little bit obsessed with the idea of Semantic markup. I want the words that I write to be understood my humans and machines. Imagine this piece of code: print( "Hello, world!" ) Is that code example written in Python? C++? Basic? Go? Perhaps you're familiar enough with every programming language to tell - […]
Continue reading →By @edent · HTML Open Source php · 250 words
Dan Q very kindly shared his script to make WordPress do good HTML. But I couldn't get it working. Looking at the HTML it was spitting out, the meta generator said it was HTML Tidy version 5.6.0. That's quite old! I confirmed this by running: echo tidy_get_release(); Which spat out 2017/11/25. Aha! There are a […]
Continue reading →By @edent · HTML WordPress · 1 comment · 150 words · read ~237 times.
HTML documents have the concept of an alternate representation of the document. For example, a page's header might say: <link rel="alternate" type="application/rss+xml" href="https://shkspr.mobi/blog/feed"> That tells you there's an alternative representation of the page, what sort of content it is, and where it is located. That's nice. But it's hard for a browser to tell the […]
Continue reading →By @edent · ebook HTML unicode · 2 comments · 300 words
By and large, the English language doesn't use diacritical marks. Even our loanwords are stripped of them; we drink in a cafe rather than the more pretentious café. This has a consequence for HTML and, by extension, eBooks. As a quick primer, modern computing gives us two main ways of displaying a letter with an […]
Continue reading →By @edent · blogging HTML IndieWebCamp · 11 comments · 200 words · read ~161 times.
While attending IndieWebCamp in Brighton a few weeks ago, a bunch of us were talking about blogging. What is post? What should it contain? What's optional? Someone (probably Jeremy Keith said: A blog post doesn't need a title. In a literal sense, he was wrong. The HTML specification makes it clear that the <title> element […]
Continue reading →By @edent · HTML javascript security ui ux · 10 comments · 400 words · read ~5,105 times.
This has to be the most infuriating bug report I've ever submitted. I went to type in my 2FA code on a website - but no numbers appeared on screen. Obviously, I was an idiot and had forgotten to press the NumLock button. D'oh! I toggled it on and typed again. No numbers appeared. I […]
Continue reading →