1.6 KiB
title, description, date, tags, synopsis, imageURL, imageAlt, mastodon_id
| title | description | date | tags | synopsis | imageURL | imageAlt | mastodon_id | ||
|---|---|---|---|---|---|---|---|---|---|
| A New Audio Web Component; Ballin’ | I've gone and built a not-so-fancy audio component for my blog. | 2024-10-23 |
|
I've gone and built a not-so-fancy audio component for my blog. | /audio/covers/ballin.webp | An uncapped fountain pen on top of a pretty, gold-foiled pad of paper beside some envelopes with stamps featuring coffee drinks on them. | 113360498256457079 |
::: info Update 2025-11-21: I actually got rid of of all web components on this site because they were heavy, unnecessary, and didn't render in folks' RSS readers. Currently, I'm using plain old HTML for this, rendered by Eleventy from a convenient shortcode. :::
Fresh from my text editor comes a neat little web component that packages the native HTML <audio> tag inside a <figure> with a song name, title, and a graphic — an album cover perhaps. Here's what it looks like, featuring a very catchy drum and bass tune, "Ballin'," by Vibe Chemistry:
{% audio "Ballin’", "Vibe Chemistry", "/audio/ballin.mp3", "/audio/covers/ballin.webp" %}
It's pretty basic for now; it doesn't even truncate an over-long title, but it'll do the job for the moment. My hope is to use this to play short song snippets so that I can talk about and review them. I think this falls pretty squarely under "fair use" in the United States, and there's no admin for litigious record companies to complain to but myself anyway; coincidentally, direct all copyright complaints to me to have any decent snippets of your IP replaced with samples of significantly lower quality.