Re: Media Queries and optimizing what data gets transferred

On 25 January 2013 15:09, Fred Andrews <fredandw@live.com> wrote:

>
>
> > Date: Fri, 25 Jan 2013 14:20:49 +0200
> > From: hsivonen@iki.fi
> > To: www-style@w3.org
> > CC: ilya@igvita.com
> > Subject: Media Queries and optimizing what data gets transferred
>
> >
> > Media Queries solve the problem of applying the style rules that are
> > relevant to the current state of the user agent. Media Queries don't
> > solve the problem of promising to avoid the transfer of data that is
> > not relevant to the state of the user agent at the time of the page
> > load.
>
> Really, media queries are a really poor design direction and should be
> deprecated not enhanced.  Development would be better put into fluid
> design support, allowing media queries to be avoided entirely.
>

Fluid designs (using percentages for element sizes instead of absolute
pixel dimensions) only go so far.

For example if you have a 3-column layout, you might want to enable that
only if the screen resolution is wide enough. Therefore, you can write:

@media screen and (min-width: 790px)
{
    ul.columns3 li
    {
        float: left;
        width: 31%;
    }
}

Then if you are on smaller resolutions (e.g. tablets and mobile devices)
you will still have a readable layout (rendered linearly instead of in
columns) and can serve a single HTML page to any device. The same applies
to things like side panes.

And what about the print and speech media queries? How would those be
replaced to target printed media (esp. black & white printers) and
text-to-speech/assistive technology applications?

Thanks
- Reece