W3C home > Mailing lists > Public > www-svg@w3.org > March 2014

Re: Media queries in <switch> elements

From: Satoru Takagi <sa-takagi@kddi.com>
Date: Fri, 14 Mar 2014 15:11:02 +0900
To: www-svg@w3.org
Message-Id: <201403141511.AED16316.BBtULHTBJ@kddi.com>
Hi,

I wonder that the current implementations can offer the similar effect, although it 
does not use 'switch'.
https://www.w3.org/Graphics/SVG/WG/wiki/Proposals/Zoom_feature_for_media_queries#min.
2Fmax-width.2Fheight_properties_in_CSS_Media_Queries
Of course, it does not carry out conditional dynamic resource loading.
Then, we had a discussion on dynamic loading based on the document which
you pointed out. http://www.w3.org/2013/06/03-svg-minutes.html#item18

In the meantime, the editor's draft of resource priorities was published.
http://www.w3.org/TR/resource-priorities/

Since it had roughly aligned with the argument on previous our discussion, discussion 
regarding that is going.
https://www.w3.org/Graphics/SVG/WG/wiki/Proposals/ResourcePriorities_for_SVG
http://www.w3.org/2013/11/14-svg-minutes.html#item02
http://www.w3.org/Search/Mail/Public/search?type-index=public-web-perf&index-type=t&
keywords=svg&search=Search

I have not made reference about 'switch' element because our use case was
not only choosing only one resource in them. Our use case is being able to
choose some of divided fragments of graphics based on the conditions by
zooming and panning.
http://lists.w3.org/Archives/Public/public-web-perf/2013Sep/0087.html
It is like introducing it to this page.
http://www.microsoft.com/web/solutions/zoomit.aspx
The source code by SVG may be such a thing.
http://lists.w3.org/Archives/Public/public-web-perf/2013Sep/0103.html
I wonder that it is a superordinate concept that were examined as
responsive/adaptive images until now.

Regards,

Satoru


> 
> 
> That sounds like a nice idea! Also, it would be nice to have a way to
> control loading of media so that those image and video elements which are
> not displayed are not fetched. I believe the current browsers fetch all
> even if they are not displayed.
> 
> <switch>
>   <!-- some way not to load big.png if small.png is displayed would be nice
> for mobile phones -->
>   <image xlink:href="big.png" media="screen and (max-width: 10em)"/>
>   <image xlink:href="small.png"/>
> </switch>
> 
> This section doesn't mention the poor switch element at all:
> http://www.w3.org/Graphics/SVG/WG/wiki/Proposals/IFrame_Like_Syntax#5.10_Specifying_
whether_external_resources_are_required_for_proper_rendering
> 
> Cheers,
> Kari
> 
> 
> 
> 2014-03-06 17:25 GMT+02:00 Manuel Strehl <svg@manuel-strehl.de>:
> 
> > Ah, the correct link to Robin's presentation:
> >
> > http://berjon.com/presentations/20130910-ricg-switch/
> >
> > Thanks, David, for pointing it out!
> >
> > Manuel
> >
> > Am 6.3.2014 11:15, schrieb Manuel Strehl:
> >
> >  Hi,
> >>
> >> recently several posts and tutorials sing the song of "responsive
> >> SVG", e.g. Clown Car,
> >> <http://coding.smashingmagazine.com/2013/06/02/clown-car-technique-
> >> solving-for-adaptive-images-in-responsive-web-design/>,
> >> Responsive Icons, <http://responsiveicons.co.uk/> or more recently,
> >> <http://coding.smashingmagazine.com/2014/03/05/rethinking-responsive-svg/
> >> >.
> >>
> >> In all these articles some combination of CSS media queries and JS are
> >> leveraged. The humble <switch> element is never even mentioned. And
> >> that's because it's useless here. I've found this brainstorming:
> >>
> >> http://www.w3.org/Graphics/SVG/WG/wiki/Proposals/IFrame_
> >> Like_Syntax#5.9.2_The_.27switch.27_element
> >>
> >> and this presentation from Robin Berjon:
> >>
> >> http://coding.smashingmagazine.com/2014/03/05/rethinking-responsive-svg/
> >>
> >> where a "media" attribute is mentioned, and I'd like to ask, if there
> >> are any ongoing discussions towards adding it. It may be useful inside
> >> a <switch> element to complete requiredFeature and requiredExtension
> >> and mirror <video> in HTML, or even stand-alone, on arbitrary
> >> rendering elements.
> >>
> >> The advantage is straight-forward in-markup ways to declare, which
> >> parts of the image to render, and which to discard in some viewing
> >> circumstances. Since evaluation of media queries is already
> >> implemented in browsers and the result is basically a simple "display
> >> full"/"display none" switch, I'd suspect implementations to be not
> >> completely insanely hard.
> >>
> >> Reference SVG of what I'm talking about:
> >>
> >> <svg>
> >>
> >>   <!-- inside switch element: -->
> >>   <switch>
> >>     <rect media="screen and (max-width: 1em)"/>
> >>     <rect media="print" />
> >>   </switch>
> >>
> >>   <!-- or standalone: -->
> >>   <rect media="print" />
> >>
> >> </svg>
> >>
> >> Cheers,
> >> Manuel
> >>
> >
> >
> 
> 
> 
> 
Received on Friday, 14 March 2014 06:12:11 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:54:51 UTC