Re: ACTION-994: Some evidence of CSS MQ in the wild

On 13 Jul 2009, at 13:31, Appelquist, Daniel, VF-Group wrote:

> Thanks all for chiming in on this topic. I think we need to try to  
> draw this
> topic to a close so we can possibly come to a resolution on what to  
> put into
> the document tomorrow.
>
> David -- You mentioned one use case (choosing which image to fetch)  
> as an
> example of their use. Would you be able to write or contribute some  
> text
> from Opera that could summarize other examples of when MQs can be  
> useful?

Sure.  Although I'm in the middle of some heavy documentation writing,  
so it may not be until next week.
>
> Eduardo -- Could you write up the example of the usage you mentioned -
> choosing a stylesheet using MQs?
>
> Francois -- Is there an implementation matrix from the CSS group  
> which gives
> us some further data on which MQ features are supported in the  
> browsers that
> could give us some further insight on what to recommend developers  
> use / not
> use?
>
> Dan
>
>
> On 13/07/2009 10:13, "David Storey" <dstorey@opera.com> wrote:
>
>>
>>
>> On 11 Jul 2009, at 00:52, Jo Rabin wrote:
>>
>>>> Yes, and this is why I argue that a best practice must be
>>>> based on techniques that
>>>> a) are sufficiently widely available;
>>>> b) demonstrably "work", i.e. sufficiently solid experience
>>>> about them, and how and when to best apply them is
>>>> available;
>>>> (b) being more important than (a).
>>>
>>> They've been around a long time, they are not very widely supported
>>> or used.
>>
>> Excuse me?  Not widely supported is Presto (Opera), WebKit, and Gecko
>> (Mozilla)?  As mentioned in a previous mail, by some stats, this is
>> over 80% of the global mobile market, and that is before Mozilla are
>> even out of the starters block.  It is even higher with more focused
>> regional markets, and when only looking at recent months.
>>
>> They're certainly supported more widely than the handheld media type,
>> which isn't supported by WebKit or Gecko and is only supported by
>> Opera in a special mode.
>>
>> I'd doubt that the WebKit and Gecko devs would have spent the time
>> implementing MQs very recently, if they didn't see a use case for  
>> them.
>>
>>> There's no convenient way of assessing whether a user agent supports
>>> it or not, so you have to have an alternative strategy that in all
>>> likelihood covers all the options anyway.
>> I would hazard a guess that this should be pretty trivial to test via
>> JavaScript if media queries are supported, or at least if they've  
>> been
>> applied.  Even if MQs are not supported, it doesn't break the page in
>> question - you just don't get the mobile optimised stylesheet, and it
>> is left to the browser in question to adapt the page (whether it is
>> via a zoom interface, single column mode or what have you).
>>>
>>> The idea of CSS media queries seems to fall into a rather poorly
>>> evidenced class "declarative client side adaptation" which needs to
>>> be compared with successful techniques like using Javascript to
>>> assess the self same things and act accordingly. How many things can
>>> you do in a reasonably functional CSS Media Queries enabled browser
>>> that you can not do in the same browser, and others besides, using
>>> script?
>>
>> Depends how well supported scripting is in the browser, if it is at
>> all, especially for client-server browsers. MQs also work with JS
>> turned off.  It is also much easier to override a large screen
>> optimised image with a mobile optimised one, before the original  
>> image
>> is downloaded and applied using MQs.  I'm not a good enough scripter
>> to know if JavaScript offers all the functionality to detect
>> everything that can be detected by media queries. For me MQs are much
>> easier to use as I don't have to learn JS to use them.
>>>
>>> I think CSS Media Queries have been over taken by the tide of
>>> history and whether they were at one time a good idea or not, there
>>> is no need for them now.
>>
>> Don't think I can agree. For example if you think who may be the
>> biggest phone operator in the world, one name that might spring to
>> mind is maybe Vodafone.  They're pretty influential in this whole
>> mobile web ball game. If one looks an an abstract from Vodafone from
>> an upcoming conference [1] you will find:
>>
>> "In a typical Vodafone widget, SVG will be used for buttons and all
>> sorts of others graphics that make sense to be vector. By the use of
>> clever CSS and Media Queries it helps a lot to design for multiple
>> platforms, resolutions, screen-sizes and aspect-ratios."
>>
>> Although Widgets are cross-platform and cross-device (and sometimes  
>> it
>> is good to look up from the trees and see the forest, not just the
>> mobile landscape), widgets to Vodafone are Mobile Widgets, which are
>> seemingly only focused at mobiles (Dan will correct me if I'm wrong).
>> It is clear that Vodafone have found a real use case for them.
>>
>> [1] https://www.svgopen.org/2009/registration.php?section=conference_speakers
>>>
>>> Jo
>>>
>>> On 10/07/2009 17:40, Eduardo Casais wrote:
>>>>>> I think 3 million, but will get the figures next week.
>>>> --
>>>>> I'm not sure about the main use, but I was using Media
>>>>> Queries long before the iPhone even existed,
>>>> That would make about 0.5% rate of utilization -- I gather in the
>>>> general Web where MAMA collects its data. This is
>>>> not exactly impressive if MQ have been available long
>>>> before the emergence of the iPhone, but perhaps this just means
>>>> that MQ are not very useful for desktops.
>>>>> I don't see how we can tell that a media query is designed to
>>>>> offer custom style sheets to iPhones rather
>>>>> than any other phone or mobile device.
>>>> This is not exactly what I meant, rather I observed that
>>>> many examples of CSS media queries seemed primarily intended for
>>>> the iPhone _at this point in time_
>>>> (probably because of the popularity of the iPhone).
>>>>> it certainly doesn't require the viewport meta tag to be
>>>>> useful.
>>>> Correct. Remember that the discussion started when someone
>>>> suggested mentioning CSS MQ in "3.6.2 Use Client-side Capability
>>>> Detection for Dynamic Device State"
>>>> What I was hinting at was that for truly dynamic
>>>> capability handling, CSS MQ are probably insufficient by themselves
>>>> and require other features (such as JavaScript,
>>>> Viewport, etc). The only example given that actually deals
>>>> with dynamic capability handling (screen orientation) must
>>>> also rely upon viewport. Just an observation, not the final word.
>>>>> I forgot about the issue of mobile phone makers
>>>>> ramping up the pixel density
>>>> For quite some time now, far-eastern manufacturers (Korea and
>>>> Japan) have been shipping phones with
>>>> subsantially higher pixel counts than the iPhone or
>>>> anything available in European/USA markets. 480x854 seems to have
>>>> become typical for DoCoMo and Softbank.
>>>>> Using actual screen width in cm/mm/inches would probably be better
>>>> I am not thrilled by this approach...
>>>>>> (On a side-note, I  disagree that Best Practices must be derived
>>>>>> from widely-used techniques.
>>>> ....
>>>>> Personally, I promote a way of creating mobile apps and services
>>>>> based on exploiting what works
>>>> Yes, and this is why I argue that a best practice must be
>>>> based on techniques that
>>>> a) are sufficiently widely available;
>>>> b) demonstrably "work", i.e. sufficiently solid experience
>>>> about them, and how and when to best apply them is
>>>> available;
>>>> (b) being more important than (a).
>>>> E.Casais
>>>>
>>
>> David Storey
>>
>> Chief Web Opener / Product Manager, Opera Dragonfly
>> W3C WG:  Mobile Web Best Practices / SVG Interest Group
>>
>> Opera Software ASA, Oslo, Norway
>> Mobile: +47 94 22 02 32
>>
>>
>>

David Storey

Chief Web Opener / Product Manager, Opera Dragonfly
W3C WG:  Mobile Web Best Practices / SVG Interest Group

Opera Software ASA, Oslo, Norway
Mobile: +47 94 22 02 32

Received on Monday, 13 July 2009 11:36:06 UTC