Hi, Just wondering if anyone here has experience with detecting AND displaying for mobile and portable devices. I'm looking to come up with some display options for my sites ...
It's called @media-queries, and it's done in CSS - have a look at Google for "responsive design" and "@media css" or something similar
Thing is if you want to start implementing the modern approach to this, your websites may or may not be compatible with the concepts needed to pull off a responsive layout. (As PoPSiCLe suggests). It is the right approach, but beware that if you have outdated presentational markup reeking of the worst of being in transition from 1997 to 1998 practices; basically 99% of what people vomit up in 4 Tranny or 5 Lip-service, you may end up having to throw out ALL your existing templates/layouts to even come CLOSE to doing it properly... anything else can quickly degenerate to trying to treat a chainsaw wound with Band-aids and Bactine. IF you have a fluid or semi-fluid layout, IF you have dynamic fonts and elastic layout, IF you have semantic markup progressively enhanced to create the layouts and add scripting, responsive layout is just the next logical step and easy-peasy to add... However if it's slapped together with a WYSIWYG, or you started out dicking around in Photoshop before even thinking content and logical document structure, or are knee deep in presentational bloated non-semantic markup -- you are facing an uphill battle Though at that point you SHOULD be tossing it and starting over as it would be an inaccessible mess that consumes more bandwidth than it needs to, fails to leverage caching models, is harder to maintain and/or update, and on the whole would be a train wreck of /FAIL/. Though it's hard to say if that's what you have or not without seeing some examples of the sites you want to update. There are a LOT of things that if you are building accessible semi-fluid elastic responsive design simply flat out have no business on the website no matter what the artsy fartsy types and script-tards will tell you; like perfect equal height equal width elements across a page, full width image sliders (that particular bit of crap really needs to be axed internet-wide), fixed height or width backgrounds between content text, and so forth. If you have those it just makes it all that harder to do. Again why I advocate building semantic markup and the corresponding logical document structure FIRST, before you even THINK about what the layoutS (yes, PLURAL) are going to be. Then one should progressively enhance the page with CSS for the different media targets and device capabilities, following the unwritten rule of CSS and Javascript when it comes to making websites; if you can't make the page functional without them, you have no business adding them. ... as opposed to crapplets which operate under slightly different circumstances -- which is why they suck. ... and be extremely leery if not outright distrustful of any 'off the shelf' solution or tool people tell you to try; they are universally useless buggy broken crap that just makes things worse. IN PARTICULAR idiotic halfwit CSS "frameworks" like Blueprint, YUI or Bootstrap should be avoided at all costs -- they do nothing but piss all over any website that tries to use them. Really though, I'd have to see what you have before I could suggest anything more.