Jakob | 22 Jun 2012 13:00
Picon
Picon
Gravatar

Definition list as image caption

 recently though about image captions, then i realized that this could be achiebed by Markdown Extra's definition list feature:

![alttext](http://exampl.com/img.jpg)
: here goes the *caption*

What do you think?



_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Waylan Limberg | 22 Jun 2012 17:53
Picon
Gravatar

Re: Definition list as image caption

On Fri, Jun 22, 2012 at 7:00 AM, Jakob <jakov <at> gmx.at> wrote:
>  recently though about image captions, then i realized that this could be
> achiebed by Markdown Extra's definition list feature:
>
> ![alttext](http://exampl.com/img.jpg)
> : here goes the *caption*
>
> What do you think?

Hmm, what HTML are you suggesting that output? Standard Definition
List HTML? How would that translate to a "caption"?

--

-- 
----
\X/ /-\ `/ |_ /-\ |\|
Waylan Limberg
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Jakob | 22 Jun 2012 18:04
Picon
Picon

Re: Definition list as image caption

> Von: Waylan Limberg <waylan <at> gmail.com>
> Hmm, what HTML are you suggesting that output? Standard Definition
> List HTML? How would that translate to a "caption"?

In the meantime I rethought my proposal, but for the sake of being backwards compatible with HTML4: I think
it should take a "figure" class (only when it is only images and that definition line), like this:

```
<dl class="figure">
<dt><img alt="alt text" src="http://example.com/img.jpg"></dt>
<dd class="figcaption">the caption</dd>
</dl>
```

like this i would be very similar to the HTML5 stuff (and could be easily handled in CSS with `.figure {}` in
HTML4 or just `figure {}` in HTML5):

```
<figure>
  <img alt="alt text" src="http://example.com/img.jpg" >
  <figcaption>the caption/figcaption>
</figure>
```
--

-- 

NEU: FreePhone 3-fach-Flat mit kostenlosem Smartphone!                                  
Jetzt informieren: http://mobile.1und1.de/?ac=OM.PW.PW003K20328T7073a
Waylan Limberg | 22 Jun 2012 20:07
Picon
Gravatar

Re: Definition list as image caption

On Fri, Jun 22, 2012 at 12:04 PM, Jakob <JakoV <at> gmx.at> wrote:
>> Von: Waylan Limberg <waylan <at> gmail.com>
>> Hmm, what HTML are you suggesting that output? Standard Definition
>> List HTML? How would that translate to a "caption"?
>
> In the meantime I rethought my proposal, but for the sake of being backwards compatible with HTML4: I think
it should take a "figure" class (only when it is only images and that definition line), like this:
>
> ```
> <dl class="figure">
> <dt><img alt="alt text" src="http://example.com/img.jpg"></dt>
> <dd class="figcaption">the caption</dd>
> </dl>
> ```

So you want the parser to special case dt's that contain an image and
then attach a bunch of classes to the output. That seems like it might
surprise the user a little too much and I don;t recall any other
syntax which follows a similar pattern. I don't like it.

> like this i would be very similar to the HTML5 stuff (and could be easily handled in CSS with `.figure {}` in
HTML4 or just `figure {}` in HTML5):
>
> ```
> <figure>
>  <img alt="alt text" src="http://example.com/img.jpg" >
>  <figcaption>the caption/figcaption>
> </figure>
> ```

I think this one probably falls in the "should be in raw HTML" camp.
Remember the syntax rules state that markdown is only for a subset of
HTML. These special cased HTML5 tags all strike me as raw HTML
material.

--

-- 
----
\X/ /-\ `/ |_ /-\ |\|
Waylan Limberg
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Thomas Humiston | 22 Jun 2012 18:05

Re: Definition list as image caption

It's a good idea, Jakob. Despite the name of this HTML element (which HTML5 moves to rename as "description
list"), it exists for exactly the sort of purpose you suggest -- or, as I like to say, "DT is some object, DD is
something *about* that object".

No matter which implementation of Markdown (or anything else) one uses to wrap content in HTML, the
question is, "What HTML element is appropriate for the job?" The answer isn't always stark, and DL has long
been undervalued, misunderstood, and largely forgotten, but it is indeed the best choice in this case.

And in situations where the text includes discrete bits, such as a photograph's copyright info and the name
of the photographer in addition to the caption, we see that it indeed becomes list-like, so that the
appropriateness of using DL becomes even more apparent.

Here's an example of styling for a photo and caption info in a DL element. (Note: I made up the copyright info.
If Wikipedia even allows hotlinking to their photos, I'd first look up the correct way of doing it before
using this on a real site.)

div#example {
  max-width: 20em;
  }
dt {
  padding: 5px;
  border: 1px solid gray;
  margin-bottom: 5px;
  }
dt img {
  width: 100%;
  height: auto;
  }
dd {
  margin-left: 0; /* removes the indent */
  color: gray;
  font-size: small;
  }
dd.maker, dd.copyright {
  font-style: italic;
  font-size: x-small;
  margin-top: 1em;
  }
dd.maker {
  float: left;
  margin-right: 2em;
  }
dd.copyright {
  float: right;
  }

<div id=example>
<dl>
<dt><img src="http://upload.wikimedia.org/wikipedia/commons/f/fd/Fuzzy_Freddy.jpg" alt="Foxy
Freddy, from Wikipedia">
<dd>Fox is a common name for many species of omnivorous mammals belonging to the Canidae family.
<dd class=maker>Photo by Rob Lee
<dd class=copyright>&copy;2012 Wikimedia / GPL
</dl>
</div>

Regards,
TH

On Jun 22, 2012, at 7:00 AM, Jakob wrote:

> recently though about image captions, then i realized that this could be achiebed by Markdown Extra's
definition list feature:
> 
> ![alttext](http://exampl.com/img.jpg)
> : here goes the *caption*
> 
> What do you think?
Alan Hogan | 22 Jun 2012 19:23
Favicon
Gravatar

Re: Definition list as image caption

![alttext](http://exampl.com/img.jpg)
: here goes the *caption*


I *really* like this proposal. It takes the extant image and DL (in Extra-style implementations) syntaxes and smartly combines them into something even better when they’re mashed-up. Very memorable and visually meaningful. This is easily the most exciting proposed syntax extension I can remember seeing on this list.
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Michel Fortin | 22 Jun 2012 20:22
Gravatar

Re: Definition list as image caption

Le 2012-06-22 à 13:23, Alan Hogan a écrit :

>> ![alttext](http://exampl.com/img.jpg)
>> : here goes the *caption*
> 
> I *really* like this proposal. It takes the extant image and DL (in Extra-style implementations)
syntaxes and smartly combines them into something even better when they’re mashed-up. Very memorable
and visually meaningful. This is easily the most exciting proposed syntax extension I can remember
seeing on this list.

It's too subtle. What happens if you have this:

![icon](url) My Super App to Download
: this is the first version of the app.

![icon](url) My Super App to Download
: this is the first version of the app.

Is this two figures, or is it a definition list? If it's a definition list, is the text after the image the only
thing preventing it from becoming figures? Or is it because you've put two one after the other that it
becomes a definition list. Or maybe we could just make it a signel "figure list" with two figures.

 - - -

HTML5 figures let you put much more than just an image inside a figure (I'm actually the one who pushed for
this in the WHATWG mailing list some time ago). Longer code snippets in books are often structured like a
figure with a caption for instance, and sometime figures are made of multiple images illustrating the
various steps of a process for instance. Perhaps Markdown shouldn't try to be that versatile, but perhaps
it should too.

Beside, before we add captions to images, perhaps we could add captions to tables. I know MultiMarkdown
already has that, but not PHP Markdown Extra. Once we have that we could find a similar way to add caption to
various other things which would wrap the said thing in a figure element. In short, it should be pretty much
the same syntax for both.

--

-- 
Michel Fortin
michel.fortin <at> michelf.com
http://michelf.com/
Jakob | 22 Jun 2012 22:13
Picon
Picon

Re: Definition list as image caption

> It's too subtle. What happens if you have this:
> 
> ![icon](url) My Super App to Download
> : this is the first version of the app.
> 
> ![icon](url) My Super App to Download
> : this is the first version of the app.
> 
> Is this two figures, or is it a definition list? If it's a definition
> list, is the text after the image the only thing preventing it from becoming
> figures? Or is it because you've put two one after the other that it becomes
> a definition list. Or maybe we could just make it a signel "figure list"
> with two figures.

That's why I changed my mind, that it would be better to use a **new** syntax with the exclamation mark
instead of the colon, then there would be no ambiguity.

> HTML5 figures let you put much more than just an image inside a figure
> (I'm actually the one who pushed for this in the WHATWG mailing list some time
> ago). Longer code snippets in books are often structured like a figure
> with a caption for instance, and sometime figures are made of multiple images
> illustrating the various steps of a process for instance. Perhaps Markdown
> shouldn't try to be that versatile, but perhaps it should too.

I think the only problem would be multi-paragraph stuff. Maybe the syntax could then be like the fenced code
blocks, but with exclamation marks:

!
here goes all the stuff

and even more
! here goes the caption

or like this

!!!
here goes all the stuff

and even more
!!! here goes the caption

Another option would be to use the `figure` element itself and define the caption inside it or after it, like this

<figure>
here goes all the stuff

and even more

! here goes the caption
</figure>
! or maybe here

> Beside, before we add captions to images, perhaps we could add captions to
> tables. I know MultiMarkdown already has that, but not PHP Markdown Extra.
> Once we have that we could find a similar way to add caption to various
> other things which would wrap the said thing in a figure element. In short,
> it should be pretty much the same syntax for both.

I totally agree! But why not use the same syntax?:

! caption of the table
| user  | password |
|-------|----------|
| frank | 123456   |
| mike  | mypass   |

--

-- 

NEU: FreePhone 3-fach-Flat mit kostenlosem Smartphone!                                  
Jetzt informieren: http://mobile.1und1.de/?ac=OM.PW.PW003K20328T7073a
Jakob | 23 Jun 2012 14:19
Picon
Picon

Re: Definition list as image caption

> > Beside, before we add captions to images, perhaps we could add captions
> to
> > tables. I know MultiMarkdown already has that, but not PHP Markdown
> Extra.
> > Once we have that we could find a similar way to add caption to various
> > other things which would wrap the said thing in a figure element. In
> short,
> > it should be pretty much the same syntax for both.
> 
> I totally agree! But why not use the same syntax?:
> 
> ! caption of the table
> | user  | password |
> |-------|----------|
> | frank | 123456   |
> | mike  | mypass   |

I think it should be posisible to use tables with captions inside of a figure element: Therefore we need a
different syntax for the table caption. Wikipedia uses `|+ caption` [1], so I think we could use similar syntax:
```
|+ caption align=top    +|
| user  | password       |
|-------|----------------|
| frank | 123456         |
| mike  | mypass         |
```

```
| user  | password       |
|-------|----------------|
| frank | 123456         |
| mike  | mypass         |
|+ caption align=bottom +|
```

```
|  caption align=right ++|
| user  | password       |
|-------|----------------|
| frank | 123456         |
| mike  | mypass         |
```

```
|++  caption align=left  |
| user  | password       |
|-------|----------------|
| frank | 123456         |
| mike  | mypass         |
```

[1]: http://en.wikipedia.org/wiki/Help:Table_caption
--

-- 

NEU: FreePhone 3-fach-Flat mit kostenlosem Smartphone!                                  
Jetzt informieren: http://mobile.1und1.de/?ac=OM.PW.PW003K20328T7073a
Michel Fortin | 23 Jun 2012 15:43
Gravatar

Re: Definition list as image caption

Le 2012-06-23 à 8:19, Jakob a écrit :

>>> Beside, before we add captions to images, perhaps we could add captions
>> to
>>> tables. I know MultiMarkdown already has that, but not PHP Markdown
>> Extra.
>>> Once we have that we could find a similar way to add caption to various
>>> other things which would wrap the said thing in a figure element. In
>> short,
>>> it should be pretty much the same syntax for both.
>> 
>> I totally agree! But why not use the same syntax?:
>> 
>> ! caption of the table
>> | user  | password |
>> |-------|----------|
>> | frank | 123456   |
>> | mike  | mypass   |
> 
> I think it should be posisible to use tables with captions inside of a figure element: Therefore we need a
different syntax for the table caption.

Not at all. If we want to allow anything inside a figure element (as HTML5 permits), then all we have to do is
force the figure content to be indented. You could even nest figures that way.

Idea: use "!" to create a figure:

	[[ Figure 1: some image ]]
	!	![image_alt](image_url "image title")

	[[ Figure 2: some text ]]
	!	paragraph
	
		this is it
	
		blah bla
	
	[[ Figure 3: some code ]]
	!	~~~
		<html>
		~~~
	
	[[ Figure 4: some table ]]
	!	[ Table 1: passwords for all my friends ]
		user | password
		---- | --------
		mike | mypass
	
	[[ Figure 5: nested figures ]]
	!	[[ Figure X: another figure ]]
		!	[[ Figure Y: yet another ]]
			!	this is getting ridiculous

Now, just make the leading "!" and indentation optional for an image and you get this:

	[[ Figure 1: A simple image ]]
	![image_alt](image_url "image title")

And preceding the figure with a caption could be optional:

	!	some figure with text and without a caption

--

-- 
Michel Fortin
michel.fortin <at> michelf.com
http://michelf.com/
Jakob | 23 Jun 2012 16:18
Picon
Picon

Re: Definition list as image caption


> Not at all. If we want to allow anything inside a figure element (as HTML5
> permits), then all we have to do is force the figure content to be
> indented. You could even nest figures that way.

*That's maybe even better!* So the syntax would be just the inversion of my proposal: Instead of figure =>
caption you have caption => figure. This makes a lot more sense.

However, would we still be able to have multi-paragraph captions?

> Now, just make the leading "!" and indentation optional for an image and
> you get this:
> 
> 	[[ Figure 1: A simple image ]]
> 	![image_alt](image_url "image title")

The only problem with this would be that *every* image would get a figure. However i think `!
![image_alt](image_url "image title")` would do the job just fine: so only the indent would be optional.
--

-- 

NEU: FreePhone 3-fach-Flat mit kostenlosem Smartphone!                                  
Jetzt informieren: http://mobile.1und1.de/?ac=OM.PW.PW003K20328T7073a
Michel Fortin | 24 Jun 2012 01:36
Gravatar

Re: Definition list as image caption

Le 2012-06-23 à 10:18, Jakob a écrit :

>> Not at all. If we want to allow anything inside a figure element (as HTML5
>> permits), then all we have to do is force the figure content to be
>> indented. You could even nest figures that way.
> 
> *That's maybe even better!* So the syntax would be just the inversion of my proposal: Instead of figure =>
caption you have caption => figure. This makes a lot more sense.
> 
> However, would we still be able to have multi-paragraph captions?

That would require a syntax with a recurring prefix. For instance, we could mimic how blockquotes work and
use "]" as a prefix for captions:

	] Figure 1: some big figure caption
	]
	] second paragraph of the caption
	]
	] > blockquote in the caption
	]
	] etc.
	!	Here goes the figure's content
		Indented by one tab

But I fear this is complicating the syntax too much for something that is rarely needed. There's always HTML
as a fallback if you really need this.

>> Now, just make the leading "!" and indentation optional for an image and
>> you get this:
>> 
>> 	[[ Figure 1: A simple image ]]
>> 	![image_alt](image_url "image title")
> 
> The only problem with this would be that *every* image would get a figure. However i think `!
![image_alt](image_url "image title")` would do the job just fine: so only the indent would be optional.

What I was proposing is that an image alone on its line and preceded by a caption would become a figure. Not
every standalone images.

--

-- 
Michel Fortin
michel.fortin <at> michelf.com
http://michelf.com/
Jakob | 24 Jun 2012 05:33
Picon
Picon
Gravatar

Re: Definition list as image caption


Am 24.06.2012 um 01:36 schrieb Michel Fortin <michel.fortin <at> michelf.com>:

> Le 2012-06-23 à 10:18, Jakob a écrit :
> 
>>> Not at all. If we want to allow anything inside a figure element (as HTML5
>>> permits), then all we have to do is force the figure content to be
>>> indented. You could even nest figures that way.
>> 
>> *That's maybe even better!* So the syntax would be just the inversion of my proposal: Instead of figure =>
caption you have caption => figure. This makes a lot more sense.
>> 
>> However, would we still be able to have multi-paragraph captions?
> 
> That would require a syntax with a recurring prefix. For instance, we could mimic how blockquotes work and
use "]" as a prefix for captions:
> 
>    ] Figure 1: some big figure caption
>    ]
>    ] second paragraph of the caption
>    ]
>    ] > blockquote in the caption
>    ]
>    ] etc.
>    !    Here goes the figure's content
>        Indented by one tab
> 
> But I fear this is complicating the syntax too much for something that is rarely needed. There's always
HTML as a fallback if you really need this.

Yes, it shouldnt get too complicated. Just for the sake of understanding it: it would also be possible with a
marker just once, right? So like

"
 ? multi

    paragraph

   caption
! Figure
"

This would also make it possible to decide weather the caption is supposed to be on top or below.

> 
>>> Now, just make the leading "!" and indentation optional for an image and
>>> you get this:
>>> 
>>>    [[ Figure 1: A simple image ]]
>>>    ![image_alt](image_url "image title")
>> 
>> The only problem with this would be that *every* image would get a figure. However i think `!
![image_alt](image_url "image title")` would do the job just fine: so only the indent would be optional.
> 
> What I was proposing is that an image alone on its line and preceded by a caption would become a figure. Not
every standalone images.

Oops, sorry, i wasnt clear enough. Of course i didn mean inline images, but it could lead to unexpected
results if you have a "quasi inline image" at the end of a paragraph just due to line wrapping:

"
Here is my inline image
that i want to show you
and its by hazard at a break:
![alt](img)
"
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Klaus Mueller | 23 Jun 2012 14:39
Picon
Gravatar

Re: Definition list as image caption

Hi all,

at all, I think there is an wide need for captions and most solutions
are mostly "handmade" spans in paragraphs.

Am 22.06.2012 22:13, schrieb Jakob:
> That's why I changed my mind, that it would be better to use a **new**
> syntax with the exclamation mark instead of the colon, then there
> would be no ambiguity. 

Could we use the content of the title tag, or an extra caption field
inside the img-markdown instead?

![alternative text](/img/nicetree.jpg "this is the title" {this could be
the caption})

For the title tag there is already a css solution with [:after][1]

It could be a little bit confusing if more [img-tags][2] which will be
integrated some times.

greetz
klml

[1]:
http://stackoverflow.com/questions/3850156/add-title-attribute-on-next-line-via-after
[2]: http://www.w3schools.com/tags/tag_img.asp

--

-- 
Klaus Mueller
Heßstraße 90
80797 München

+49 89 18 98 58 21
+49 178 54 38 400
klml.de
Jakob | 23 Jun 2012 16:06
Picon
Picon

Re: Definition list as image caption

> Could we use the content of the title tag, or an extra caption field
> inside the img-markdown instead?
> 
> ![alternative text](/img/nicetree.jpg "this is the title" {this could be
> the caption})

This could be usefull in some cases, but you point out yourself, that there is a solution with css. In my
opinion the "title" attribute is mostly useless and stupid, as it leads to [Mystery meat
navigation](http://en.wikipedia.org/wiki/Mystery_meat_navigation), which sucks!

I think the `<figure>` element is a good example for a semantic element. I think it should be used; and I think
it should therefore be implemented into Markdown.

If you read the article about the [figure] element, you will soon find out, that it is more than just the
desription of an *image*. It can be used to describe *almost anything* that would not appear in flow text in
a printed paper: e.g. tables, quotes, poems. Therefore you could even have a figure element describing a
table that has a caption:

```
A. Mayers et al. reported an increase in cases of *some disease* in the early 1990s ...

|+  incidence   +|
| year |   cases |    
|-----:|--------:|
| 1990 | 123,456 |
| 1991 | 654,321 |

! **Incidence of some disease:** The numbers show, that in the year 1991 there was a strange increase of
cases, blah blah blah

Due to the lack of therapy, R. Ronald et al suggested another palliative treatment ...

![some disease image](http://example.com/img.jpg)
! **Some disease in a male patient**: See the *red* pustula, that explode when touched.
```

[figure]: http://html5doctor.com/the-figure-figcaption-elements/

> For the title tag there is already a css solution with [:after][1]
> 
> It could be a little bit confusing if more [img-tags][2] which will be
> integrated some times.

There already was a proposal to allow html tags in links, by just doing it like you do it in html: `[link]:
http://example.com "title goes here" style="color:red"`. I think [Multimarkdown] implemented it,
but i'm not sure.

[Multimarkdown]: https://github.com/fletcher/peg-multimarkdown
--

-- 

NEU: FreePhone 3-fach-Flat mit kostenlosem Smartphone!                                  
Jetzt informieren: http://mobile.1und1.de/?ac=OM.PW.PW003K20328T7073a
Klaus Mueller | 23 Jun 2012 20:46
Picon
Gravatar

Re: Definition list as image caption

Hi all,

> This could be usefull in some cases, but you point out yourself, that there is a solution with css. In my
opinion the "title" attribute is mostly useless and stupid, as it leads to [Mystery meat
navigation](http://en.wikipedia.org/wiki/Mystery_meat_navigation), which sucks!
I thougt about using the content title tag *as* caption. Not using the
title tag in its origin way. But I think this will mix the title-tag and
caption aka figure

> I think the `<figure>` element is a good example for a semantic element. I think it should be used; and I
think it should therefore be implemented into Markdown.
I totally agree. I only talk about the markdown syntax, not the
generated html. There for <figure> is great and the right thing.

Mainly I suggested an extra value inside the Markdown image, after the
title tag

> Due to the lack of therapy, R. Ronald et al suggested another palliative treatment ...
>
> ![some disease image](http://example.com/img.jpg)
> ! **Some disease in a male patient**: See the *red* pustula, that explode when touched.
> ```
in this case I would write:

![some disease image](http://example.com/img.jpg "useful title" {**Some disease in a male patient**:
See the *red* pustula, that explode when touched.})

But this will be only useful in images and not like your solution in all
elements. And if you have much formatted text, very confusing.

greetz
klml
Alan Hogan | 23 Jun 2012 20:09
Favicon
Gravatar

Re: Definition list as image caption

Generated content (:after) would be awkward for this purpose. It is not selectable in many browsers, and experiences more bugs and rendering issues than normal elements. 


Alan

On Saturday, June 23, 2012 at 5:39 AM, Klaus Mueller wrote:

Hi all,

at all, I think there is an wide need for captions and most solutions
are mostly "handmade" spans in paragraphs.

Am 22.06.2012 22:13, schrieb Jakob:
That's why I changed my mind, that it would be better to use a **new**
syntax with the exclamation mark instead of the colon, then there
would be no ambiguity.

Could we use the content of the title tag, or an extra caption field
inside the img-markdown instead?

![alternative text](/img/nicetree.jpg "this is the title" {this could be
the caption})


For the title tag there is already a css solution with [:after][1]

It could be a little bit confusing if more [img-tags][2] which will be
integrated some times.


greetz
klml

[1]:
http://stackoverflow.com/questions/3850156/add-title-attribute-on-next-line-via-after
[2]: http://www.w3schools.com/tags/tag_img.asp

--
Klaus Mueller
Heßstraße 90
80797 München

+49 89 18 98 58 21
+49 178 54 38 400
klml.de

_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss

_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Waylan Limberg | 22 Jun 2012 20:31
Picon
Gravatar

Re: Definition list as image caption

On Fri, Jun 22, 2012 at 12:05 PM, Thomas Humiston <tom <at> jumpingrock.net> wrote:
> It's a good idea, Jakob. Despite the name of this HTML element (which HTML5 moves to rename as "description
list"), it exists for exactly the sort of purpose you suggest -- or, as I like to say, "DT is some object, DD is
something *about* that object".
>
> No matter which implementation of Markdown (or anything else) one uses to wrap content in HTML, the
question is, "What HTML element is appropriate for the job?" The answer isn't always stark, and DL has long
been undervalued, misunderstood, and largely forgotten, but it is indeed the best choice in this case.
>
> And in situations where the text includes discrete bits, such as a photograph's copyright info and the
name of the photographer in addition to the caption, we see that it indeed becomes list-like, so that the
appropriateness of using DL becomes even more apparent.
>
> Here's an example of styling for a photo and caption info in a DL element. (Note: I made up the copyright
info. If Wikipedia even allows hotlinking to their photos, I'd first look up the correct way of doing it
before using this on a real site.)
>
>
> div#example {
>  max-width: 20em;
>  }
> dt {
>  padding: 5px;
>  border: 1px solid gray;
>  margin-bottom: 5px;
>  }
> dt img {
>  width: 100%;
>  height: auto;
>  }
> dd {
>  margin-left: 0; /* removes the indent */
>  color: gray;
>  font-size: small;
>  }
> dd.maker, dd.copyright {
>  font-style: italic;
>  font-size: x-small;
>  margin-top: 1em;
>  }
> dd.maker {
>  float: left;
>  margin-right: 2em;
>  }
> dd.copyright {
>  float: right;
>  }
>
>
> <div id=example>
> <dl>
> <dt><img src="http://upload.wikimedia.org/wikipedia/commons/f/fd/Fuzzy_Freddy.jpg"
alt="Foxy Freddy, from Wikipedia">
> <dd>Fox is a common name for many species of omnivorous mammals belonging to the Canidae family.
> <dd class=maker>Photo by Rob Lee
> <dd class=copyright>&copy;2012 Wikimedia / GPL
> </dl>
> </div>

Now, this is a proposal I can get behind - sort of. Of course its
really a non-proposal because it is already possible with no
modification to at least some implementations. The only proposal here
is to determine what hooks the CSS should expect. And I've never seen
markdown require specific classes as styling hooks. But, hey, if you
want to standardize internally within your organization, that is a
good starting place.

The best part is, any implementation that already supports definition
lists, markdown processing inside raw html blocks and attribute lists
[1] [2] can generate that output. The input would look like this:

<div class="example" markdown=1>

    ![Foxy Freddy, from Wikipedia]
    (http://upload.wikimedia.org/wikipedia/commons/f/fd/Fuzzy_Freddy.jpg)
    :    Fox is a common name for many species of
         omnivorous mammals belonging to the Canidae
         family.
    :    Photo by Rob Lee
         {: .maker }
    :    &copy;2012 Wikimedia / GPL
         {: .copyright }

    </div>

The key is that the wrapping div has a hook set (changed it to a
class, not an id - otherwise you could only have one
image-with-caption per page) identifying it as a image-with-caption.
Author a definition list without that div/class hook, and it is a
regular definition list. Either way, the markdown parser does the same
thing. Only the CSS cares and alters how it is displayed. Again, a
non-proposal as far as Markdown is concerned.

[1]: http://maruku.rubyforge.org/proposal.html#attribute_lists
[2]: http://packages.python.org/Markdown/extensions/attr_list.html

--

-- 
----
\X/ /-\ `/ |_ /-\ |\|
Waylan Limberg
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Lou Quillio | 23 Jun 2012 02:38
Favicon
Gravatar

Re: Definition list as image caption

On Fri, Jun 22, 2012 at 4:00 AM, Jakob <jakov <at> gmx.at> wrote:
>  recently though about image captions, then i realized that this could be
> achiebed by Markdown Extra's definition list feature:
>
> ![alttext](http://exampl.com/img.jpg)
> : here goes the *caption*
>
> What do you think?

For reference, here's Russ Weakly in 2004:

http://www.maxdesign.com.au/articles/definition/

LQ

--

-- 
Lou Quillio
http://quillio.com/
John MacFarlane | 25 Jun 2012 23:18
Picon

Re: Definition list as image caption

Pandoc has for some time supported the following convention.
A paragraph containing just an image (and nothing else) gets
treated as a figure, with the alt text as the caption.
(If you don't want this, you can defeat it by including
a nonbreaking space or empty comment in the paragraph alongside
the image.)

One advantage of this extension is that it degrades well when
you process it with standard markdown processors.

Pandoc also supports a syntax for captioning tables, described here:
http://johnmacfarlane.net/pandoc/README.html#tables

John

+++ Lou Quillio [Jun 22 12 17:38 ]:
> On Fri, Jun 22, 2012 at 4:00 AM, Jakob <jakov <at> gmx.at> wrote:
> >  recently though about image captions, then i realized that this could be
> > achiebed by Markdown Extra's definition list feature:
> >
> > ![alttext](http://exampl.com/img.jpg)
> > : here goes the *caption*
> >
> > What do you think?
> 
> For reference, here's Russ Weakly in 2004:
> 
> http://www.maxdesign.com.au/articles/definition/
> 
> LQ
> 
> 
> -- 
> Lou Quillio
> http://quillio.com/
> _______________________________________________
> Markdown-Discuss mailing list
> Markdown-Discuss <at> six.pairlist.net
> http://six.pairlist.net/mailman/listinfo/markdown-discuss
> 
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Fletcher Penney | 25 Jun 2012 23:34

Re: Definition list as image caption

MultiMarkdown does the same sort of thing in version 3.

F-

On Jun 25, 2012, at 5:18 PM, John MacFarlane wrote:

> Pandoc has for some time supported the following convention.
> A paragraph containing just an image (and nothing else) gets
> treated as a figure, with the alt text as the caption.
> (If you don't want this, you can defeat it by including
> a nonbreaking space or empty comment in the paragraph alongside
> the image.)
> 
> One advantage of this extension is that it degrades well when
> you process it with standard markdown processors.
> 
> Pandoc also supports a syntax for captioning tables, described here:
> http://johnmacfarlane.net/pandoc/README.html#tables
> 
> John
> 
> +++ Lou Quillio [Jun 22 12 17:38 ]:
>> On Fri, Jun 22, 2012 at 4:00 AM, Jakob <jakov <at> gmx.at> wrote:
>>>  recently though about image captions, then i realized that this could be
>>> achiebed by Markdown Extra's definition list feature:
>>> 
>>> ![alttext](http://exampl.com/img.jpg)
>>> : here goes the *caption*
>>> 
>>> What do you think?
>> 
>> For reference, here's Russ Weakly in 2004:
>> 
>> http://www.maxdesign.com.au/articles/definition/
>> 
>> LQ
>> 
>> 
>> -- 
>> Lou Quillio
>> http://quillio.com/
>> _______________________________________________
>> Markdown-Discuss mailing list
>> Markdown-Discuss <at> six.pairlist.net
>> http://six.pairlist.net/mailman/listinfo/markdown-discuss
>> 
> _______________________________________________
> Markdown-Discuss mailing list
> Markdown-Discuss <at> six.pairlist.net
> http://six.pairlist.net/mailman/listinfo/markdown-discuss

--

-- 
Fletcher T. Penney
fletcher <at> fletcherpenney.net 

Attachment (smime.p7s): application/pkcs7-signature, 4899 bytes
_______________________________________________
Markdown-Discuss mailing list
Markdown-Discuss <at> six.pairlist.net
http://six.pairlist.net/mailman/listinfo/markdown-discuss
Jakob | 26 Jun 2012 08:32
Picon
Picon
Gravatar

Re: Definition list as image caption


>> Pandoc also supports a syntax for captioning tables, described here:
>> http://johnmacfarlane.net/pandoc/README.html#tables

Thats great! However, we should differ between what i would call "title" and "caption": I think a table
should have a title like "economic growth" and a caption like "in the years 1970--1980, the nationional
gross rpoductd rose from blah to blah due to blahblah" (which i think is essentially the part of the
<figcaption>). Therefore i would propose to stick to the wikipedia style table captioning "|+ title +|"
which is easierly identified as part of the table.

I do like the different table styles pandoc provides! They should feature rowspan and colspan!
Jakob | 26 Jun 2012 08:19
Picon
Picon
Gravatar

Re: Definition list as image caption


Am 25.06.2012 um 23:18 schrieb John MacFarlane <fiddlosopher <at> gmail.com>:

> Pandoc has for some time supported the following convention.
> A paragraph containing just an image (and nothing else) gets
> treated as a figure, with the alt text as the caption.
> (If you don't want this, you can defeat it by including
> a nonbreaking space or empty comment in the paragraph alongside
> the image.

I think the alt-text should be used to describe what's on the image, like "a monkey with a banana in his hand"
so the blind and the markdown reader knows what is on the image. The image caption however could say
someting like "Male monkey *frank* in his new area: when kept in nature-like areas, the monkeys show much
fewer stress symptoms".

In my opinion the title tag of the img element should be thrown away and be replaced by a structure like this:
(as it should be now):
"<figure>
<img alt='a monkey with a banana' title='Male monkey *frank* in his new area' />
<img alt='graph showing stress levels of male monkeys in blue and those of female in red as well as a
pictogram of an aggressive monkey' title='blood levels of cortisol in male and female monkeys t
different times of the day in nature-like areas' />
<figcaption>when kept in nature-like areas, the monkeys show much fewer stress symptoms</figcaption>
</figure>"
(as i think it should be in the future):
"<figure>
<pic><img alt='a monkey with a banana'/><pictitle>Male monkey *frank* in his new area</pictitle></pic>
<pic><img alt='graph showing stress levels of male monkeys in blue and those of female in red as well as a
pictogram of an aggressive monkey'><pictitle>blood levels of cortisol in male and female monkeys t
different times of the day in nature-like areas</pictitle></pic>
<figcaption>when kept in nature-like areas, the monkeys show much fewer stress symptoms</figcaption>
</figure>"

Gmane