- This topic is empty.
-
AuthorPosts
-
March 27, 2011 at 4:40 pm #32151
tannercampbell
ParticipantI’ve never had a client ask to have a mobile or ipad version of a main website … until today. As such, this might be an easy question: How do I instruct the browser to detect if a visitor is using a mobile phone or an iPad and, if they are, direct them to a site built specifically for mobiles/iPads?
A second question: http://3rconcepts.com/test
Why won’t the drop downs on this website work on iPad? What have I done incorrectly?
March 27, 2011 at 5:00 pm #53471DogsGhost
Memberyou use a media query to check for something like what kind of device the person is using or, as I usually do, check the current width of their browser. You then attach a stylesheet that has the altered styling for that screen size.
The first link is the full stylesheet for desktop browsers. then if the screen width goes to 768 or lower (ipad) the third stylesheet comes into play. Then if the screen goes belows 320px (phone) the 2nd sheet is activated.
March 27, 2011 at 6:31 pm #53448TT_Mark
MemberAs DogsGhost says, you should be using media queries based on screen res rather than forcing a redirect in the htaccess. That way you will only have to maintain one site instead of 4+ and you’ll include all manner of different devices instead of just the 4 above
Check out http://mediaqueri.es/
October 27, 2011 at 5:49 am #89744Brightonmike
MemberYou should be able to just add some simple responsive CSS that just adjusts things slightly.
If you’re building from the ground up too, do it now. I’ve made the mistake of deciding to “mobilise” a website after it’s already been built using responsive CSS, which resulted it a few hacky methods and probably a few too many uses of “!important”.
Make it responsive from the ground up. No excuse not to do so – except laziness.
October 27, 2011 at 11:02 am #89756KarimCossutti
MemberIf it is iPhone/iPod & iPad specific i personally use this javascript snippet
code by Scott Rockers
If you are going Mobile in a wider sense u suggest using this http://code.google.com/p/php-mobile-detect/
Also for some business categories (eg: cafe, restaurant, cinema) i think that the content users look for while on mobile is the same that as desktop browsers, most likely people search for specific info while on mobile (address, phone numbers, schedules) and probably all the secondary content just slows down the site and bugs the user.
Obviously this does not apply to all sites, just some specific cases…
But it’s just my opinion.October 27, 2011 at 12:00 pm #89762joelmb
MemberI too like brightonmike, have in the past only thought about the mobile version afterwards which is a pain and never as satisfactory.
Make it responsive.
Yesterday i posted a link to quite exciting Foundation from Zurb
Use html5 Boilerplate as your foundation.Design once and forget about it. One size fits all… and 100 other cliche’s. But its clearly the way forward.
November 7, 2011 at 5:45 pm #90310kb04090
MemberI’ve built a test mobile page with media query which seems so much more appropriate. Of course my computer is up-to-date and I have IE9. When I view the page on IE8, it appears that none of the display:none CSS in the 3 size-driven style sheets work. The entire structure of the page is showing. I’ve tried
AuthorPostsViewing 7 posts - 1 through 7 (of 7 total)- The forum ‘Other’ is closed to new topics and replies.