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,
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.
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.
