alexseanchai: Katsuki Yuuri wearing a blue jacket and his glasses and holding a poodle, in front of the asexual pride flag with a rainbow heart inset. (0)
let me hear your voice tonight ([personal profile] alexseanchai) wrote in [community profile] marchmetamatterschallenge 2020-03-06 02:53 am (UTC)

<img src="https://IMAGE URL.png" style="max-width:100;height:auto;" alt="IMAGE DESCRIPTION HERE" />

It can be .jpg or .gif or whatever the actual extension is, but you do need the extension, and you do need the alt text—let me illustrate:

Screenshot of this comment in progress, showing the code of the next few lines of the comment, in order to, first, illustrate the fail mode of using an image URL without file extension or alt text, second, illustrate the importance of alt text to sighted users when the image itself fails to load, and third, show sighted users what the alt text on the third says without requiring them to view page source.



The alt text is to describe the image to users who can't display it, either because something is wrong with the code (as here) or because they're browsing with a screenreader or with image loading disabled.

Ladybug and Chat Noir of Miraculous Ladybug; she is resting her elbow on his shoulder and they both look smug. Caption: 'alexseanchai of summer'.

The style part, which I'm only bothering with here on the screenshot of this comment in progress, is a trick to make sure large images don't try to be bigger than the mobile device some folks may be viewing on. [archiveofourown.org profile] La_Temperanza also has a CSS way to do that better and an HTML and a CSS way to wrap text around images for use on AO3; both CSS tricks involve making AO3 work skins.

Oh, and Discord really really hates being image hosting for anyone who isn't viewing the image through Discord or direct at the URL; an increasingly common fail mode I'm noticing is the image source is cdn.discordapp.com and the image itself works fine if you go direct to its URL. Tumblr works great, though; so does Imgur.
(33 comments)

Post a comment in response:

If you don't have an account you can create one now.
HTML doesn't work in the subject.
More info about formatting
 
Notice: This account is set to log the IP addresses of everyone who comments.
Links will be displayed as unclickable URLs to help prevent spam.