HTML tips for 90s kids trying to make 20s websites, metadata edition (indiepocalypse.social repost)

Mon, 04 Mar 2024 00:18:52 GMT

<!DOCTYPE html>: you have the modern HTML standard at https://html.spec.whatwg.org/ bookmarked now, you're not making terrible Microsoft Internet Explorer 5-only broken pages, the browser doesn't have to use ~*~quirks mode~*~. Stick this at the very top.
<html lang="en">: If most of the page is in one language - this one is English - then you can tell the browser that so language-dependent stuff can use that. Use the ISO 639 abbreviations. I think. (Correction: BCP 47, not ISO 639. It's a subset, I think.) Anyway, if part of your page is in another language, you can put lang="whatever" on the element containing the other-language part. (Or, like, wrap it in <span lang="whatever"></span> if you don't have one.)
<meta charset="UTF-8">: Did you make your HTML files using UTF-8? It should be an option in, like, the Save As dialog or something. Anyway, if you did, you can put this in the <head></head> part so the browser knows it's not Windows-1252 or something.
- Edit: If your server declares a character encoding in an HTTP header, this line will do nothing. It looks like Neocities doesn't do it for our site, though, so we still need it.
<meta name="viewport" content="width=device-width, initial-scale=1">: Okay, so, you didn't use any tables for layout, right? And you still don't understand CSS or Javascript? Okay, then your website probably works fine on, like, a tiny screen. You can check this by zooming in like 500% or opening it in a small window or, idk, both. Anyway, the viewport thing tells mobile browsers that they can just display your site normally and it'll all be good.

Folks who learned HTML in the past fifteen years, feel free to chime in with more hot tips. Because we need them. Please.

(Link to Indiepocalypse HTML tips thread, because which a number of folks did, in fact, chime in.)

comments

Words! Mostly about image descriptions.

Wed, 08 Jul 2020 00:35:09 GMT

We wrote a bunch of words today! A bunch of them specifically in a fediverse thread about obstacles people face to adding image descriptions riffing off the essay "Laziness Does Not Exist" by Devon Price.

...kind of fediverse inside baseball, all things considered, but now our wrists are sending "hey, you might wanna chill a little" signals, so we're not gonna write a lot more here. So you get the link instead. :P

...

Okay, also: if you're using the HTML editor to write your Dreamwidth posts, the key is <img src="[image URL]" alt="[text to display if image doesn't load]" title="[text to display when mouse hovers over image]">. If you use Dreamwidth's image hosting, the HTML it gives you to copy gets auto-filled with the "Title" in the mouseover and the "Short Description" in the alt text.

comments

The Packbats' Weblog

HTML tips for 90s kids trying to make 20s websites, metadata edition (indiepocalypse.social repost)

Words! Mostly about image descriptions.