<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<!DOCTYPE bugzilla SYSTEM "https://www.w3.org/Bugs/Public/page.cgi?id=bugzilla.dtd">

<bugzilla version="5.0.4"
          urlbase="https://www.w3.org/Bugs/Public/"
          
          maintainer="sysbot+bugzilla@w3.org"
>

    <bug>
          <bug_id>18384</bug_id>
          
          <creation_ts>2012-07-24 13:01:30 +0000</creation_ts>
          <short_desc>Add an adaptive image mechanism</short_desc>
          <delta_ts>2013-01-28 19:13:32 +0000</delta_ts>
          <reporter_accessible>1</reporter_accessible>
          <cclist_accessible>1</cclist_accessible>
          <classification_id>1</classification_id>
          <classification>Unclassified</classification>
          <product>HTML WG</product>
          <component>HTML5 spec</component>
          <version>unspecified</version>
          <rep_platform>All</rep_platform>
          <op_sys>All</op_sys>
          <bug_status>RESOLVED</bug_status>
          <resolution>LATER</resolution>
          
          <see_also>https://www.w3.org/Bugs/Public/show_bug.cgi?id=18384</see_also>
          <bug_file_loc></bug_file_loc>
          <status_whiteboard></status_whiteboard>
          <keywords>a11y, a11y_text-alt</keywords>
          <priority>P2</priority>
          <bug_severity>normal</bug_severity>
          <target_milestone>---</target_milestone>
          
          <blocked>18171</blocked>
          <everconfirmed>1</everconfirmed>
          <reporter name="Laura Carlson">laura.lee.carlson</reporter>
          <assigned_to name="Edward O&apos;Connor">eoconnor</assigned_to>
          <cc>attiks</cc>
    
    <cc>devarshipant</cc>
    
    <cc>eoconnor</cc>
    
    <cc>faulkner.steve</cc>
    
    <cc>mat</cc>
    
    <cc>me</cc>
    
    <cc>mike</cc>
    
    <cc>mjs</cc>
    
    <cc>odinho</cc>
    
    <cc>Paul.Cotton</cc>
    
    <cc>paul.irish</cc>
    
    <cc>peter.winnberg</cc>
    
    <cc>public-html-a11y</cc>
    
    <cc>public-html-admin</cc>
    
    <cc>public-html-wg-issue-tracking</cc>
    
    <cc>robin</cc>
    
    <cc>rubys</cc>
    
    <cc>w3c</cc>
    
    <cc>xn--mlform-iua</cc>
          
          <qa_contact name="HTML WG Bugzilla archive list">public-html-bugzilla</qa_contact>

      

      

      

          <comment_sort_order>oldest_to_newest</comment_sort_order>  
          <long_desc isprivate="0" >
    <commentid>71375</commentid>
    <comment_count>0</comment_count>
    <who name="Laura Carlson">laura.lee.carlson</who>
    <bug_when>2012-07-24 13:01:30 +0000</bug_when>
    <thetext>Proposal:
http://www.w3.org/community/respimg/wiki/Picture_Element_Proposal

Details:
http://www.w3.org/community/respimg/2012/06/18/florians-compromise/

June 2012 public-html Email Thread:
http://lists.w3.org/Archives/Public/public-html/2012Jun/thread.html#msg105

July 2012 public-html Email Thread:
http://lists.w3.org/Archives/Public/public-html/2012Jul/thread.html#msg123l</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71376</commentid>
    <comment_count>1</comment_count>
    <who name="Laura Carlson">laura.lee.carlson</who>
    <bug_when>2012-07-24 13:04:19 +0000</bug_when>
    <thetext>Two things that may be worth consideration: 

1. The possibility of responsive text alternatives that could parallel the responsive images if needed. The &lt;picture&gt; proposal allows for different sources for images at different sizes. But authors could use different images at different sizes and not just a cropped down version of a single image. No text alternative mechanism is provided for that use case. Allowing alt on &lt;source&gt; could provide for that use case. Something like the following might work:

&lt;picture&gt;
&lt;source src=&quot;mobile.jpg  alt=&quot;text alternative&quot;&gt;
&lt;source src=&quot;medium.jpg&quot;  alt=&quot;text alternative&quot; media=&quot;min-width: 600px&quot;&gt;
&lt;source src=&quot;fullsize.jpg&quot;  alt=&quot;text alternative&quot; media=&quot;min-width: 900px&quot;&gt;
&lt;img src=&quot;mobile.jpg&quot; alt=&quot;text alternative&quot;&gt;
&lt;/picture&gt;

2. A picture element could allow for semantic programmatically determinable in-page rich text long description, if a description element was added to the proposal:

&lt;picture&gt;
&lt;img src=&quot;image.jpg&quot; alt=&quot;text alternative&quot;&gt;
&lt;desc&gt;structured rich text description with headings, lists, tables, etc.&lt;/desc&gt;
&lt;/picture&gt;</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71377</commentid>
    <comment_count>2</comment_count>
    <who name="steve faulkner">faulkner.steve</who>
    <bug_when>2012-07-24 13:08:54 +0000</bug_when>
    <thetext>copied from email http://lists.w3.org/Archives/Public/public-whatwg-archive/2012Jul/0127.html

I am concerned about the use of the
alt attribute on &lt;picture&gt; when it would be much better to allow text
alternatives inside the picture element.
Some of the advantages are:
Markup can be used to structure text alternative content.
The length of the alt text is no longer a constraint, as it is currently
for assistive tech.

current example
&lt;picture alt=&quot;Description of image subject.&quot;&gt;
&lt;source srcset=&quot;small.jpg 1x, small-highres.jpg 2x&quot;&gt;
&lt;source media=&quot;(min-width: 18em)&quot; srcset=&quot;med.jpg 1x, med-highres.jpg 2x&quot;&gt;
&lt;source media=&quot;(min-width: 45em)&quot; srcset=&quot;large.jpg 1x, large-highres.jpg
2x&quot;&gt;
&lt;img src=&quot;small.jpg&quot; alt=&quot;Description of image subject.&quot;&gt;
&lt;/picture&gt;

Is there any reason why you think the use of alt attribute on picture is
preferable to

&lt;picture role=&quot;img&quot;&gt;

&lt;p&gt;alt text&lt;/p&gt;

&lt;source srcset=&quot;small.jpg 1x, small-highres.jpg 2x&quot;&gt;
&lt;source media=&quot;(min-width: 18em)&quot; srcset=&quot;med.jpg 1x, med-highres.jpg 2x&quot;&gt;
&lt;source media=&quot;(min-width: 45em)&quot; srcset=&quot;large.jpg 1x, large-highres.jpg
2x&quot;&gt;
&lt;img src=&quot;small.jpg&quot;&gt;

&lt;/picture&gt;

note:role=img is just of polyfill purposes.

or


&lt;figure&gt;
&lt;picture&gt;
&lt;source srcset=&quot;small.jpg 1x, small-highres.jpg 2x&quot;&gt;
&lt;source media=&quot;(min-width: 18em)&quot; srcset=&quot;med.jpg 1x, med-highres.jpg 2x&quot;&gt;
&lt;source media=&quot;(min-width: 45em)&quot; srcset=&quot;large.jpg 1x, large-highres.jpg
2x&quot;&gt;

&lt;img src=&quot;small.jpg&quot;&gt;

&lt;/picture&gt;
&lt;figcaption&gt;caption text&lt;/figcaption&gt;
&lt;/figure&gt;

I can understand that backwards compatibility may be of concern in the
first example, but that can be resolved through the use of CSS to clip or
hide text content if so desired.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71378</commentid>
    <comment_count>3</comment_count>
    <who name="Laura Carlson">laura.lee.carlson</who>
    <bug_when>2012-07-24 13:19:58 +0000</bug_when>
    <thetext>
&gt; I am concerned about the use of the
&gt; alt attribute on &lt;picture&gt; when it would be much better to allow text
&gt; alternatives inside the picture element.

I agree Steve. Check consult comment 1. 

I think we would to think about the best way to handle both short and long text alternatives and well as the adaptive functionality of the element.

Getting a picture element with accessibility thought out from the start would be a big win.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71380</commentid>
    <comment_count>4</comment_count>
    <who name="Leif Halvard Silli">xn--mlform-iua</who>
    <bug_when>2012-07-24 14:10:24 +0000</bug_when>
    <thetext>(1) Proposal:  Perhaps someone should file a separate bug to track the accessibility of &lt;picture&gt;?

(2) To reuse @alt would have backward compatibilty issues for AT tools. How? 
     FIRSTLY: Today @alt is only supported on a finite number of elements. And, frankly, it is only supported (quite) well on the &lt;img&gt; elemetn. (It is not at all supported that well on &lt;area&gt; and &lt;input&gt; - I could mention a numnber of issues.) Even screenreaders do - at least in theory - only look for @alt on elements where they know that it ought to exist. 
     SECONDLY: If instead we use mark-up as fallback/alternative text, the - until support is there - one can use @aria-describedby and @aria-labelledby in order to point to the fallback. By contrast, if one went for @alt, then the only way to be backward compatible would be by duplicating the @alt content with an @aria-label - like so: &lt;picture alt=&quot;alternativ text&quot; aria-label=&quot;alternative-text&quot; &gt;... &lt;/picture&gt;

(In reply to comment #2)

&gt; &lt;picture role=&quot;img&quot;&gt;
&gt; 
&gt; &lt;p&gt;alt text&lt;/p&gt;
&gt; 
&gt; &lt;source srcset=&quot;small.jpg 1x, small-highres.jpg 2x&quot;&gt;
&gt; &lt;source media=&quot;(min-width: 18em)&quot; srcset=&quot;med.jpg 1x, med-highres.jpg 2x&quot;&gt;
&gt; &lt;source media=&quot;(min-width: 45em)&quot; srcset=&quot;large.jpg 1x, large-highres.jpg
&gt; 2x&quot;&gt;
&gt; &lt;img src=&quot;small.jpg&quot;&gt;
&gt; 
&gt; &lt;/picture&gt;


&gt; I can understand that backwards compatibility may be of concern in the
&gt; first example, but that can be resolved through the use of CSS to clip or
&gt; hide text content if so desired.


Is it not as simple as setting  

    &lt;p&gt;alt text&lt;/p&gt;

to
    &lt;p style=&quot;display:none&quot;&gt;alt text&lt;/p&gt;

?

Keep in mind that whenever one do &lt;foo role=&quot;img&quot;&gt;, then the content of &lt;foo&gt; is considered hidden from AT *anyway*. For an &lt;foo role=img&gt;, then one *MUST* use an @aria- attribute in order to hold or point to the accessible text. *OR* one must use an attribute (such as @alt) and - perhaps?- even an element that is especially designated for alterantive text.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71444</commentid>
    <comment_count>5</comment_count>
    <who name="Peter Winnberg">peter.winnberg</who>
    <bug_when>2012-07-25 12:44:35 +0000</bug_when>
    <thetext>Some comments about this. First of all I think it&apos;s great if we can get so called &quot;responsive images&quot; into a spec so that there is a recommended way to do it. But I see some issues about this and alternate text.

In the proposal [1] it is said that all source elements in a picture element should represent the same subject matter. I don&apos;t think that will be the case. Take this example, someone makes a so called &quot;mobile&quot; design for their site. Both the regular site and the mobile design have a top banner image (but the mobile design&apos;s banner image takes up less space than the regular one). But they don&apos;t share the same subject matter. When the site is viewed with a width that is less than say 15em then the site switches to the mobile design. 

The problem now is that if we only have alt text for 1 image and the mobile design doesn&apos;t have the same content then the alt text would be incorrect. One way to solve this would of course be to have a alt attribute for each source attribute.

On the other hand the specification could clearly state that all different source elements needs to share the same subject matter. But if people start (ab)using it the way I described above then there is no way for a validator to check this.

I generally feel that if style=&quot;display:none&quot; is needed then the design usually needs to be rethinked because it assumes that CSS is available everywhere, which it isn&apos;t. So it really only solves it for a subset of the user agents.

[1] http://www.w3.org/community/respimg/wiki/Picture_Element_Proposal</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71445</commentid>
    <comment_count>6</comment_count>
    <who name="Laura Carlson">laura.lee.carlson</who>
    <bug_when>2012-07-25 13:10:00 +0000</bug_when>
    <thetext>
(In reply to comment #5)
&gt; On the other hand the specification could clearly state that all different
&gt; source elements needs to share the same subject matter. But if people start
&gt; (ab)using it the way I described above then there is no way for a validator to
&gt; check this.

Hi Peter,

I too worry that nothing is stopping authors from using different images and suggested possibility using responsive alt on source (see comment #1).

Alternatively we would need some very strong spec text to outlaw different images. Suggestions? Maybe in the future it could be made machine testable? There are such things as TinEye.
https://addons.mozilla.org/en-US/firefox/user/3304309/?src=api</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71447</commentid>
    <comment_count>7</comment_count>
    <who name="Mat Marquis">mat</who>
    <bug_when>2012-07-25 13:41:40 +0000</bug_when>
    <thetext>(In reply to comment #6)
&gt; (In reply to comment #5)
&gt; &gt; On the other hand the specification could clearly state that all different
&gt; &gt; source elements needs to share the same subject matter. But if people start
&gt; &gt; (ab)using it the way I described above then there is no way for a validator to
&gt; &gt; check this.
&gt; 
&gt; Hi Peter,
&gt; 
&gt; I too worry that nothing is stopping authors from using different images and
&gt; suggested possibility using responsive alt on source (see comment #1).
&gt; 
&gt; Alternatively we would need some very strong spec text to outlaw different
&gt; images. Suggestions? Maybe in the future it could be made machine testable?
&gt; There are such things as TinEye.
&gt; https://addons.mozilla.org/en-US/firefox/user/3304309/?src=api

I think it’s going to be important that this be posed as a means of providing alternate sources for *content* images ( http://www.bostonglobe.com/magazine/2012/07/22 or http://www.apple.com, for example ). A banner that displays different decorative banners would be most appropriately done in CSS -- this would likely be simpler for the authors as well, especially given the new `img-set` CSS syntax. I’m sure we’re apt to see `picture` used incorrectly for decorate images but no more than we already see with `img`, I wouldn’t think.

It doesn’t hurt our case that this is such a high-profile issue in the dev community, and that `picture` is likely to see use from advanced and highly visible developers right away -- I think we’re likely to see a number of great examples of `picture` usage springing up almost immediately, paving the way for responsible usage in the future.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>71652</commentid>
    <comment_count>8</comment_count>
    <who name="Peter Droogmans">attiks</who>
    <bug_when>2012-07-30 08:05:47 +0000</bug_when>
    <thetext>2 questions:

1/ Is it possible to allow width and height attributes on the source tags, this way the browser knows the dimensions before loading the image?

2/ Is it possible to allow the class attribute on the source tag and/or the picture tag?</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>72109</commentid>
    <comment_count>9</comment_count>
    <who name="Peter Droogmans">attiks</who>
    <bug_when>2012-08-13 08:53:45 +0000</bug_when>
    <thetext>Regarding 1, see also http://www.w3.org/community/respimg/2012/06/18/florians-compromise/#comment-1673

Strike question 2, class is supported on picture tag


(In reply to comment #8)
&gt; 2 questions:
&gt; 
&gt; 1/ Is it possible to allow width and height attributes on the source tags, this
&gt; way the browser knows the dimensions before loading the image?
&gt; 
&gt; 2/ Is it possible to allow the class attribute on the source tag and/or the
&gt; picture tag?</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>75127</commentid>
    <comment_count>10</comment_count>
    <who name="Edward O&apos;Connor">eoconnor</who>
    <bug_when>2012-10-02 22:33:55 +0000</bug_when>
    <thetext>EDITOR&apos;S RESPONSE: This is an Editor&apos;s Response to your comment. If you are
satisfied with this response, please change the state of this bug to CLOSED. If
you have additional information and would like the Editor to reconsider, please
reopen this bug. If you would like to escalate the issue to the full HTML
Working Group, please add the TrackerRequest keyword to this bug, and suggest
title and text for the Tracker Issue; or you may create a Tracker Issue
yourself, if you are able to do so. For more details, see this document:

   http://dev.w3.org/html5/decision-policy/decision-policy.html

Status: Rejected
Change Description: No spec change.
Rationale: There are now a couple of extension specifications being
actively pursued by members of the WG which address this feature
request:

http://dvcs.w3.org/hg/html-proposals/raw-file/tip/responsive-images/responsive-images.html
http://dev.w3.org/html5/srcset/

Instead of trying to separately address this feature in HTML5, we should
wait for one or both of the extension specifications meet the CR exit
criteria. This is why I&apos;ve resolved this as LATER, instead of moving the
bug into the HTML.next component (as we&apos;ve been doing with other feature
requests).</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>75211</commentid>
    <comment_count>11</comment_count>
    <who name="Marcos Caceres">w3c</who>
    <bug_when>2012-10-03 10:38:51 +0000</bug_when>
    <thetext>(In reply to comment #10)
&gt; Instead of trying to separately address this feature in HTML5, we should
&gt; wait for one or both of the extension specifications meet the CR exit
&gt; criteria. This is why I&apos;ve resolved this as LATER, instead of moving the
&gt; bug into the HTML.next component (as we&apos;ve been doing with other feature
&gt; requests).

I think this is the right approach. 

I don&apos;t want the Responsive Images CG (RICG) to replicate work; And I think Hixie is in a much better position to specify the normative text needed to meet the use cases that the RiCG is pursuing. The RICG is focusing on the use cases to see if img@srcset meets all of them. 

The RIGC are working from the hypothesis that img@srcset does meet the use cases, but have identified a few places where it may not (Work in Progress): 

https://github.com/Wilto/draft-prop/blob/master/UseCaseComparisons.md

We&apos;ve also moved work to github: 
https://github.com/Wilto/draft-prop/</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>75309</commentid>
    <comment_count>12</comment_count>
    <who name="Laura Carlson">laura.lee.carlson</who>
    <bug_when>2012-10-04 17:52:30 +0000</bug_when>
    <thetext>Suggested Tracker Title: Add an adaptive image mechanism to HTML5.0

Suggested Tracker Description: Add an adaptive image mechanism per:
http://dvcs.w3.org/hg/html-proposals/raw-file/tip/responsive-images/responsive-images.html

This mechanism should be incorporated into HTML5.0 proper and not pushed off into a ghettoized &quot;extension&quot;.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>75310</commentid>
    <comment_count>13</comment_count>
    <who name="Sam Ruby">rubys</who>
    <bug_when>2012-10-04 18:25:33 +0000</bug_when>
    <thetext>Does this feature have either a thorough test suite or a single reasonably complete implementation?</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>75547</commentid>
    <comment_count>14</comment_count>
    <who name="Robin Berjon">robin</who>
    <bug_when>2012-10-08 09:09:55 +0000</bug_when>
    <thetext>(In reply to comment #12)
&gt; This mechanism should be incorporated into HTML5.0 proper and not pushed off
&gt; into a ghettoized &quot;extension&quot;.

There&apos;s nothing &quot;ghetto&quot; about being in an extension spec. What matters is that a feature is implemented. Fighting over which document it goes into is the wrong battle.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>81465</commentid>
    <comment_count>15</comment_count>
    <who name="Maciej Stachowiak">mjs</who>
    <bug_when>2013-01-16 08:57:39 +0000</bug_when>
    <thetext>https://www.w3.org/html/wg/tracker/issues/207</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>81538</commentid>
    <comment_count>16</comment_count>
    <who name="Laura Carlson">laura.lee.carlson</who>
    <bug_when>2013-01-17 17:06:55 +0000</bug_when>
    <thetext>(In reply to comment #14)
&gt; (In reply to comment #12)
&gt; &gt; This mechanism should be incorporated into HTML5.0 proper and not pushed off
&gt; &gt; into a ghettoized &quot;extension&quot;.
&gt; 
&gt; There&apos;s nothing &quot;ghetto&quot; about being in an extension spec. What matters is
&gt; that a feature is implemented. Fighting over which document it goes into is
&gt; the wrong battle.

If the responsive images group wants to pursue incorporating the picture element into HTML5.0, they can do so. But I withdraw my tracker request. I wish them the best.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>82203</commentid>
    <comment_count>17</comment_count>
    <who name="Paul Cotton">Paul.Cotton</who>
    <bug_when>2013-01-26 16:53:20 +0000</bug_when>
    <thetext>ISSUE-207 covering the questions of whether an adaptive image mechanism should be included in HTML 5.0 or published as an extension specification was resolved by a WG CfC:
http://lists.w3.org/Archives/Public/public-html-admin/2013Jan/0185.html</thetext>
  </long_desc>
      
      

    </bug>

</bugzilla>