On Aug 24, 2010, at 1:51 PM, Patrick H. Lauke wrote: > On 24/08/2010 21:33, tee wrote: >> Despite what I have learned from David Story about Opera Mini, media >> queries along cannot make a usable mobile version of site that is >> truly targets mobile user. Content negotiation and adaption cannot be >> forgone, there are more to it to make usable mobile version site than >> displaying none to elements you don't want the mobile users see. > > Of course that depends on the type of site and the content that's currently > there. A site that's very focussed on just the essential actions (say a very > specific web application or single-purpose site) will have the same content > on both desktop and mobile devices. What's often the case is that desktop > versions of sites (remembering my days as university web editor here) start > to bloat dramatically (with departments angling for a bit of space on the > homepage, then slapping on videos and "welcome from the Vice Chancellor" type > messages), when really both on mobile and desktop they should be pared down > to the absolute essentials of what visitors come there to do. It's just that > on desktop, with our large monitors and mice (leaving accessibility > considerations to the side for a minute) we've become adept at quickly moving > past the cruft to the actual bits we want. These are then the ones that > developers want to hide from mobile views. > > This sort of approach has recently been expounded by Luke Wroblewski with his > "mobile first" philosophy. It's a good wake-up call (but of course this is > only applicable in certain situations). http://www.lukew.com/ >
A laudable presentation. I have reached a state where everything heading towards subtraction, this state of mind helps problem solving and clarity, be it personal issue or web development. I was using the similar approach, not in the first mobile site though. The first time it was unclear, a bit uneasy what to expect, what to show due to un-familiarity of mobile devices and what can mobile browsers do and was very much in the "desktop mode". It got better each time, then the third, the fourth, before I begun I knew what elements not to include or include but using different approach than I would normally do. Even that, there are still situation this Mobile First approach may not work out quite well using only media queries. Two examples: 1. An element that you want display both in desktop and mobile version, it maybe a long list of menu items (this maybe easier to solve by using a dropdown list) or a block of content that you want it place above the main content structurally for desktop version (in the header perhaps), not through source ordered and CSS manipulation, then in the mobile version, you want it placed after the content [1] , I have not figured a smart and clean way to do this using media queries or CSS manipulation (absolution positions can do this but it requires precise calculation for height which I think is ugly and bad) than content adapation. 2. Using a blog site for example, a site may want to display 5 popular posts but in the mobile version to display only two, the same can be for homepage that a site may want to show a handful of recent articles for desktop version but 1 for mobile version. Maybe displaying none using :nth-child could do that. Can Opera Mini handles it I have not tested; I wouldn't go this route though, and the moment you start thinking to solve this in the template, it's a content negotiation [1] It may not be so important structurally long as visually it's placed after the content, but if google or any search engine service offers a mobile search than this might be something worth consider especially if SEO gurus buzz about it and then clients come to tell you they want it done this way or that way. > As ever, your mileage may vary, My mileage is good, though can always improved :-) tee ******************************************************************* List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *******************************************************************