Page MenuHomePhabricator

gallery should not use ul/li
Open, MediumPublic

Description

The gallery tag currently generates an unnumbered list containing the images. In the browser the bullets are hidden by CSS. When you copy a gallery from web page to a word processing you get a unnumbered list with annoying bullets.

Example from https://www.mediawiki.org/w/index.php?title=Help:Images&oldid=4781793#Gallery_syntax

<gallery>
File:Example.jpg|Item 1
File:Example.jpg|a link to [[Help:Contents]]
File:Example.jpg
File:Example.jpg|alt=An example image. It has flowers
File:Example.jpg|''italic caption''
Example.jpg|on page "{{PAGENAME}}"
File:Using Firefox.pdf|page=72
</gallery>

copied from Mozilla Firefox and pasted to LibreOffice Writer on Microsoft Windows 10 looks like:

grafik.png (872×210 px, 148 KB)

The unnumbered list is not necessary for semantic reasons. For HTML4, div/div instead of ul/li should be satisfactorily and has no disadvantages.

For HTML5 the figure element would be the right element:
http://www.w3.org/TR/html5/the-figure-element.html#the-figure-element

<gallery title="Caption">
File:Image1.jpg|First Image
File:Image2.jpg|Second Image
</gallery>

should turn to

<figure class="gallery">
 <figcaption>Caption</figcaption>
 <figure>
  <img src="Image1.jpg" />
  <figcaption>First Image</figcaption>
 </figure>
 <figure>
  <img src="Image2.jpg" />
  <figcaption>Second Image</figcaption>
 </figure>
</figure>

See Also:

Details

Reference
bz36755

Event Timeline

bzimport raised the priority of this task from to Medium.Nov 22 2014, 12:28 AM
bzimport set Reference to bz36755.
bzimport added a subscriber: Unknown Object (MLST).

Related URL: https://gerrit.wikimedia.org/r/62207 (Gerrit Change Ida8ed0436626d3455b7d28ebac7c8fc6e0b47acd)

This is a special case of bug 23932. Apparently, styling such tags (new to HTML5) works pretty much everywhere, except IE before 9 *without JS*. The last consensus at 23932 was that we still need to worry about that. Anyway, we should probably determine a broad course there rather than doing this piecemeal.

I disagree with the part of the premise of this ticket and the
solution that was identified.

If your copy paste gives you something ugly, then that's a bug in your copy paste, not in the definition of the html structure.

If you want to wrap the blocks in figures, then that would be nice, but it doesn't replace the original intent of using ul and li. It's just one of many ways to loose ugly bullet points, but in terms of structure, other then being html5, it's not necessarily better.

The gallery is semantically a list in at least Special:NewFiles and Category pages and actually using a list for it has benefits for assistive technology in these cases. Now I guess there could be made a case that inside articles, our gallery aren't really lists but rather groups of images, but then we should split the gallery generator into two modes that can work independent of eachother.

Using figure and figcaption are totally independent issues as far as i'm concerned. They are just div's with extra meaning.

IE8 does not support <figure> and <figcaption>: http://caniuse.com/#search=figure. The elements get ignored and are not styleable.

waldyrious set Security to None.
waldyrious updated the task description. (Show Details)

IE8 does not support <figure> and <figcaption>: http://caniuse.com/#search=figure. The elements get ignored and are not styleable.

html5shiv could solve that.

IE8 does not support <figure> and <figcaption>: http://caniuse.com/#search=figure. The elements get ignored and are not styleable.

html5shiv could solve that.

html5shiv uses JavaScript. Since MediaWiki 1.27 JavaScript is disabled on IE8.

Hmm, time to drop IE≤8 support completely obviously... (AFAIK, January 12, 2016 was the day, when MS dropped IE8's support, others have been killed ages ago)

For the record, we already use some HTML5 semantic tags as shown in chart in T25932: Allow use of semantic HTML5 elements in wikitext and mentioned in T25932#1325024 and T25932#1316167

Just because we don't support javascript in general on IE8, does not mean we would not be able to add html5shim for IE8 browsers.

Just because we don't support javascript in general on IE8, does not mean we would not be able to add html5shim for IE8 browsers.

I'm in favour of that.

Just because we don't support javascript in general on IE8, does not mean we would not be able to add html5shim for IE8 browsers.

Technical possible. Yes. But after setting browser support for IE8 to grade C all JavaScript-based workarounds for IE8 have been removed from MediaWiki. Example for hlist.

Since rMW3a30e03645f8 html5shiv is activated for IE8. Now it may be possible to use <figure> and <figcaption>.

This will probably be fixed in T268250 as a follow up to the changes coming for T51097, yes.

Hey I am very confused as i know about the techstack used here but how to contribute this is the main problem as I found the repo link too git clone "https://gerrit.wikimedia.org/r/mediawiki/core" now what to do next how to setup project and run it? actually I m very confused that how to contribute? Please guide me

@Anomode: Hi and welcome. Please ask general setup questions in support forums instead, as they are not directly related to fixing this task. Thanks.