SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Zealot ComposerRyan's Avatar
    Join Date
    Oct 2003
    Location
    USA
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Tutorial on display web site different on iPhone and mobile devices?

    Hi, I finished my client's website months ago and now they are interested in displaying their website in a more simplistic form on the iPhone and mobile devices (cell phones and small screens.)

    I am looking for a tutorial that would help me accomplish this. For starters, I just want to display a landing page ONLY for the iPhone that display simple information about their company and then a button that says "ENTER SITE" and it would continue them onto the full HTML site.

    Any ideas on where I can learn more about this? Thanks for the help,

    Ryan

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,598
    Mentioned
    411 Post(s)
    Tagged
    7 Thread(s)
    There are two main options for a mobile version of a site:

    - use CSS to serve up different styles depending on screen size, or
    - create a separate mobile site/page and redirect mobile browsers to that site/page.

    If you want a different landing page for the mobile browsers, you'll probably need to use the second method. It requires some programming, though. I'll move this thread to the Developing for Mobile Devices forum.

  3. #3
    padawan silver trophybronze trophy markbrown4's Avatar
    Join Date
    Jul 2006
    Location
    Victoria, Australia
    Posts
    4,095
    Mentioned
    28 Post(s)
    Tagged
    1 Thread(s)
    Hey Ryan,

    Both techniques that Ralph mentioned have their place.
    Personally I like Responsive Web Design and opt for that first, but it can become complicated.
    I'm finding myself swing between these two options and am moving towards having separate views so that you have complete control of the views and can optimise them for mobile. If the use case for the site is different on mobile(people want to do different things) or the site has a certain level of complexity that doesn't make sense on mobile then separate sites with separate views are the right choice.

    Very roughly speaking web sites for information should be responsive, web apps that have a lot of user interaction should be separate apps.

    Each programming platform on the web(Rails, .NET, PHP etc..) has different options for detecting mobile devices using the userAgent string in the browser.
    This list needs to be well maintained to pick up the right devices, so you don't want to roll this sort of thing yourself.
    As I work with Rails apps I use the mobile-fu gem which just gives you a helper method is_mobile_device? which you can use in your code to redirect / render different views etc.
    https://github.com/brendanlim/mobile-fu

    Hope it helps,


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •