When linking to an image using the Markdown Syntax

![alt text][1]

The alt text gets added as the "alt" attribute on the img tag, which is correct. It would be nice if it could also be added as the "title" tag, so that tooltips work.

Sadly I have no good usage example for it. I wish I could claim that some textmode browsers or browsers for people with disabilities don't support alt and use title instead to give this request some credibility, but I think ultimately I ask for XKCD-Fun.

But well, asking can't hurt :)

  • So many would have "alt text" as the tooltip it would be noise and not fun for a screenreader. – random Jan 17 '10 at 9:59
  • @random, isn't that the other way around? Screen readers use the alt text, which indeed is too often "enter image description here" (previously "alt text"). – Arjan Dec 6 '11 at 8:29

You just use ![I like MSO!](http://i.stack.imgur.com/HQ44r.png "Meta Stack Overflow")?

I like MSO!

XKCD is the funzorz! - G-Spot

From the Markdown help for Images:


Just like links, images work with reference syntax and titles:

This page is ![valid XHTML][checkmark].

[checkmark]: http://w3.org/Icons/valid-xhtml10
             "What are you smiling at?"


and that for Links:

Advanced Links

Links can have a title attribute, which will show up on hover. Title attributes can also be added; they are helpful if the link itself is not descriptive enough to tell users where they're going.

Here's a [poorly-named link](http://www.google.com/ "Google").
Never write "[click here][^2]".
Visit [us][web].

[^2]: http://www.w3.org/QA/Tips/noClickHere
     (Advice against the phrase "click here")
[web]: https://meta.stackoverflow.com/ "Meta Stack Overflow"

Even if none of these were available, you could always use HTML:

<img src="http://sstatic.net/mso/img/logo.png" alt="I <3 MSO!" title="Meta Stack Overflow" />
  • I didn't know that. Cool :) – Michael Stum Jan 17 '10 at 12:56
  • Cool indeed, did I miss it or was it documented somewhere?? +1 – o.k.w Jan 17 '10 at 13:03
  • 1
    I saw it here on meta. Or maybe on the markdown FAQ. Can't remember. It's been a while introducing subliminal messages to images. – perbert Jan 17 '10 at 13:06
  • Note that attribute order matters for the <img> tag on Stack Exchange (unlike standard HTML). – duozmo Nov 17 '15 at 23:18

Well, alt and title are meant to serve different purposes. I'll leave the debate elsewhere.

If you want to describe an image in your post, you can just type it out in the content. If you want to have a text to tell the users what the image is (for whatever reason the image didn't load or still loading), it should be something shorter and more concise so that it appears where the image is.

However somehow many just use the title as the same as alt (which I suppose is the intention of the OP). Having a seperate markdown for title seems too troublesome.

Like this anyone? ![alt text][title][1]

Here's an example of what I will do:

SO-Meta Logo
Above is the lovely logo of Stack Overflow Meta <-- this one is to describe the image

SO-Meta Logo http://i.stack.imgur.commmm/HQ44r.png
Above is the lovely logo of Stack Overflow Meta <--Intentionally left broken to see the alt text

  • 2
    Hmm, I can't even see the alt text on the broken image (Chrome, Mac). Come to think of it, I don't think I ever have seen alt text in Chrome. – Kyle Cronin Jan 17 '10 at 11:48
  • 1
    Broken image works fine as an example on Opera. – random Jan 17 '10 at 11:52
  • 1
    @Kyle: You are right! I tried shortening the alt text, still no show. A webkit engine issue perhaps? – o.k.w Jan 17 '10 at 11:53
  • I'd say so, as Safari doesn't display it either. – Kyle Cronin Jan 17 '10 at 11:56
  • Yea, similarly for Chrome/Safari on Windows. – o.k.w Jan 17 '10 at 12:15
  • Alt-text doesn't work in Chrome on Linux either. – Brad Gilbert Jan 17 '10 at 15:27
  • I guess I'm missing the point, but the examples do not match the ![alt text][title][1] scheme, do they? Or are you suggesting a new Markdown format? – Arjan Jan 17 '10 at 17:59
  • @Arjan: I'm just suggesting but 'circular reference' answered perfectly. – o.k.w Jan 17 '10 at 22:48
  • @Kyle, as for your first comment: that is caused by not specifying a height, making it use some defaults that are too small. (It seems to default to the line height?) See the Formatting Sandbox. – Arjan Dec 6 '11 at 8:10

oh, the great schism between alt="" and title="". I remember ranting about this on Twitter a while back, but I can't find it now.

The main difference as I recall is that IE treats title as mouseover text, and I don't think any other browsers do..?


  • 2
    Firefox will also display the contents of the title attribute on mouseover. Or is that not what you mean? – Stephan202 Jan 17 '10 at 10:25
  • 3
    Chrome also displays the title attribute on mouseover. – Kyle Cronin Jan 17 '10 at 11:51
  • 7
    title is usually displayed on mouseover. IE also displays alt on mouseover, which isn't the intention of alt and isn't done by other browsers. – sth Jan 17 '10 at 16:59
  • (@Jeff, you posted this 2 years ago. I guess your opinion/understanding has changed by now...?) – Arjan Dec 6 '11 at 10:32

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .