Wikipedia talk:Image markup with HTML
I've (Tarquin) made a suggestion to the tech mailing list which would simplify image markup for floated images. but this comes at a small cost. I'll explain the proposed changes here & people can comment on whether they like this trade-off or now.
Current
Here's what we currently have. For a floating image with a small caption:
<div style="float:right;margin:0 0 1em 1em;">[[Image:image name|alt text]]
''Caption''</div>
With a logner caption, you need to add in the width of the image, to limit the width of the div element. (otherwise it displays as wide as the caption and looks odd). This is the markup for a long caption, 300px for example:
<div style="float:right;margin:0 0 1em 1em;width:300px">[[Image:image name|alt text]]
''Caption''</div>
Proposed
All this involves is adding a CSS class to our stylesheet. For small-caption images, we'd write:
<div class="floatright">[[Image:image name|alt text]]
''Caption''</div>
I think this is much simpler. But for wide captions, we'd need to write:
<div class="floatright" style="width:300px">[[Image:image name|alt text]]
''Caption''</div>
Whether this is better, worse, or about the same as before is debatable.
PS I should have said that as I see it, this is very much a halfway house before we get better image markup!
Comments
I think every picture that has a caption should have a width specification, otherwise effects are unpredictable depending on browser, font size etc. Even a slightly overflowing picture box is highly annoying because it invades article space. I also think that the "margin:0 0 1em 1em" is not necessary, it's sufficient to just say "margin:10px" to get a margin of 10 pixels on all sides. Under these circumstances, I don't really see much of a simplification.
I would support this change anyway, if I wouldn't think that current image handling is fairly braindead and should be rewritten to a large extent. After that, DIVs will probably not be directly entered anymore, so I consider minor optimizations in that area of little help. But I won't scream if it gets into our stylesheet regardless. --Eloquence 11:08 24 Jun 2003 (UTC)
Why don't we modify the wiki markup to create the div and apply the style? [[Image:image name|left|alt text]] or something? I think any impure wiki markup is a bad idea. CGS 12:05 24 Jun 2003 (UTC).
Table auto-size
alt text This is a rather long caption, but thanks to the table tag (replacing the div tag), it does not increase the width of the whole construct! |
Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla Bla
Tables are for tabular data. You can tell this because it is called the table element. Pet peeve. CGS 12:24 24 Jun 2003 (UTC).
I'd also like to see text-align:center in the floatright class. It's not always what's desired, but it can always be overridden by a style="text-align:left" if need be. -- John Owens 12:34 24 Jun 2003 (UTC)
- very tricky. The text can be centered, but if I combine this with the suggestion below to set the width of the caption paragraph, it looks odd. (non-centered block with centered text). I suspect there is no way to center the caption block within the floating block. -- Tarquin 16:05 24 Jun 2003 (UTC)
Ideally, we'd have practically no HTML in Wikipedia code. I really like the [[Image:blah|left|alt-text]]
idea, since it could be done without any DIVs at all (but gets tricky if a caption is needed). The DIV width hack just seems ugly to me, but I am not sure how it can be worked around. Here's one possibility that may make things simpler:
<div class="floatleft">[[Image:blah|alttext]]<p style="width: 200px;">This is a really long caption which will be restricted to 200px in width</p></div>
That way, the div code can stay the same, and only the paragraph containing the caption need be modified. Even better, perhaps we could define a "caption" class that causes all captions to be displayed in a certain way (small font, emphasized maybe), but again, there's that width problem. I really dunno. All I'm sure of is that I strongly vote against using tables of any kind for this. -- Wapcaplet 13:36 24 Jun 2003 (UTC)
- *reads again* Ah, that's quite a neat idea. The caption paragraph can be selected with ".floatright p " -- Tarquin 16:05 24 Jun 2003 (UTC)
- ... but some images may be narrower than 200px. Any further thoughts on this? A rough show of for /against would be interesting -- Tarquin 13:53 27 Jun 2003 (UTC)
- I'm for, but I think it should be incorporated into the [[Image:...]] markup. Having HTML in the Wiki should be a last resort, not common practice. CGS 15:22 27 Jun 2003 (UTC).
- it's meant as a halfway step until we get better markup. The idea is that the CSS classes are the same as for future "smart" wiki markup. -- Tarquin 16:03 27 Jun 2003 (UTC)
First off, I think that the "Proposed" is far superior to the "Current", because the current form of the style attribute is highly abstruse.
As far as replacing the whole div construct with a Wikitax construct, I don't think it's necessary. How to edit a page includes a good number of practically irreplaceable HTML tags, such as <table> and <math>, not to mention the special-character codes. If we're going to eliminate the HTML, we need to eliminate all that too.
On top of that, it would require a dramatic expansion of Wikitax. Wikitax has very half-hearted tags - they're made up entirely of special characters, and have a very primitive implementation of attributes. I think it would be nice to have something like this:
[[imgbox img="coolpic.png" alt="some text" style="center" cite="a special attribute for citing sources" caption="write the caption here"]]
but it looks like such a fundamental rewriting of wiki code that nobody would want to do it. So we might as well do the same thing as a stylesheet-defined HTML tag. (Stylesheets can define brand-new tags, right?) -Smack 22:32 1 Jul 2003 (UTC)