I have made an iPhone friendly version of my site, that I want to direct my users to.
The big question now is how to direct my users to this site. There are a few alternatives:
Redirect the user based on the user agent, e.g. if the user agent sent by the browser contains "iPhone" or android or whatever.
If the user agent matches the above criteria, display a notice on the original site telling the user that an iPhone version is available.
Which one is the most user-friendly? Another dimension to consider is the SEO aspect. How do I show Google that my site is iPhone capable?
I recently found some relevant posts on the Google Webmaster Tools homepage:
Help Google index your mobile site
Running Desktop and mobile versions of your site
phidah above has some good links, but remember: always include a link to view the desktop version. nothing is more frustrating than a limited mobile version when the desktop works just fine on the iPhone. there are exceptions, of course - for example if your desktop is mostly flash :p
This strikes me as more of a user experience question than a programming design decision. I would build either solution depending on what makes sense for your site, and your users. If you do go the redirect route, and the content on both version of the site are the same, I wouldn't worry to much about google. If the content is different, I would make sure both sites are visible to googlebot.
Nearly every site that I visit that has a mobile/iPhone version that just redirects me automatically, and then at the bottom there is a link to go to the full version if I want.
For SEO I don't think this would hurt anything, since web crawlers aren't run on mobile devices.
Check out the links below.
web dev kit
and for css info on detection
css Info
it is some of the better info I have found, hope it helps.
Kirk
Related
I have been going back and forth with my dev teams today to determine an issue that has come up. It appears that links shortened by bit.ly are not being directed to the proper URL on mobile devices only. This URL http://bit.ly/1aRvnqH will take you to the appropriate place on a desktop computer, but put it into a mobile device browser on your phone and it is broken. The URL that the mobile device renders is a very old link from our old web structure from more than a year ago.
Further it is appending a GA tag for our affiliate program platform as well as a reference code that does not exist in our affiliate program.
My dev guys think it may be something to do with this new deep linking on mobile that bit.ly recently rolled out. When I called bit.ly, they said they've never heard or seen of this before and asked I send an email to their support group which I've done.
Was hoping someone here may have some ideas as well.
Thanks in advance.
Brian
DISCLAIMER: I'm a developer at Bitly
This is a bug caused by our on-going affiliate test.
We're pushing out a fix for this link now and it should be working properly within the next 30 minutes.
If other links stop working for you in the future, please contact us at support#bit.ly or http://support.bitly.com and we'd be happy to look into it.
My website is really very simple HTML based site. My site is located here: http://www.threesite.com
How can I convert this simple HTML site compatible with iPhone or Droid? Do I need to convert the same into PHP based site and then convert? Your help will be much appreciated.
5 Ways to Create or Convert into Mobile Phone Website.
The easiest way is to use Google's tool, because it converts your existing site automatically. I've tried it on your site and it looks nice.
If you want to tailor the site yourself, you have two options: Building an app or rewriting HTML. A site app makes your site highly customizable and professionally-looking, but it requires a lot of effort and separate development for each platform (iPhone, Android, Blackberry, Symbian, ...), and. it requires your users to specifically download your app.
If you choose to convert the existing HTML to a mobile-friendly site, it will be (mostly) cross-platform, and you can follow the guidelines here.
This is very interesting question especially these days when mobile visibility has never been more important.
For more complex website I would use some online mobile site converter service, such as duda mobile or bmobilized.
These services will give you just mobile - 'm' version of a website, but with long bad urls, and unless you pay for responsive package, the site won't work on tablets.
Maybe the best solution is to use joomla or word press and pick some responsive template and build the website from scratch. Building one responsive site is better solution than having multiple instances for each device...
examples:
a) duda service
If you wander what duda can do for you, just as an example, check this site crazyscarygames.com and check out his 'm' counterpart "m.crazyscarygames" for mobile devices. this is just an example.
b) script
If you would go for full responsive site, this is an example of purity III template on this website monkeygamesworld.com ... m.monkeygamesworld.com
And remember, always do all redirects from htaccess.
There's a google tool that you can use in the end to verify how your site works on android
google.com/webmasters/tools/mobile-friendly
just enter url and hit 'analyze'
also make sure that your robots.txt is setup well, in order to allow google bot do its scan properly throughout necessary directory structure in order to access all resources.
ok, hope that helps
What's the best way to automatically detect mobile vs. full screen devices and redirect to mobile site automatically? I'm concerned about SEO so it is safe to do a detection with PHP and redirect to mobile version without unwillingly sending Google to that mobile version?
If PHP is ok, what are good libraries to use?
It is good for usability to configure redirection to your mobile website.
The google webmaster blog has a very important topic on best practices for mobile sites, concerning redirection and duplicate content (!!!)
In my opinioun, a very comprehensive and up-to-date database (including source code in multilple languages) is WURLF: http://wurfl.sourceforge.net/
You don't need any special libraries to do that. User-Agent header will do the trick.
Are there any resources or guidance out there on how to make iPhone friendly web applications?
In my case specifically, I'd like to use ASP.NET MVC, but since that all runs on the server, I know it'll boil down to just markup/css/javascript considerations.
edit: as I find other resources not mentioned here, I will update the question text :-)
CSS-Tricks ScreenCast on Designing for the iPhone
There’s an iPhone article on Sitepoint (which usefully shows you how to target stylesheets at just the iPhone, whilst hiding them from Internet Explorer—Apple's documentation doesn't).
Craig Hockenberry wrote Put Your Content In My Pocket at A List Apart.
A Flickr developer posted some lessons learned: http://code.flickr.com/blog/2008/10/27/lessons-learned-while-building-an-iphone-site/
+1 for Apple’s documentation as mentioned by Boot To The Head—horses’ mouth and all that: they have pretty comprehensive stuff on neat CSS properties that are only really supported by Safari, like CSS animations and CSS Transitions.
Scot Hanselman had a great presentation at Mix 09. Click here link.
Also look at the Mobile Device Browser File=>LINK. It is open source at codeplex.
"What is the Mobile Device Browser Definition File?
The Mobile Device Browser Definition File contains capability definitions for individual mobile devices and browsers. At run time, ASP.NET uses this .browser file, along with the information in the HTTP request header, to determine what type of device/browser has made the request and what the capabilities of that device are. This information is exposed to the developer through the Request.Browser property and allows them to tailor the presentation of their web page to suit the capabilities of the target device." - Codeplex
The definitive resource is Apple's Safari Dev Center.
My planned iphone application will work a remote https web service quite hard so until a user decides to upgrade from the free to pro version of my app I need to generate a trickle of click revenue per free user.
I would like to embed a single line adsense widget within a native cocoa-touch iPhone application. The UI control I have in mind might not exist but would work something like this. The control would occupy a fixed portion of my application's default view and would be initialized by my code and provided with key words determined by my application. The control would then periodically ping Google's adsense system and display a single clickable advert link.
If the user was interested in a link a click would result in an exit of my application followed by the opening of the advertiser's link in Safari.
Has anything like this been done before?
You have to use a UIWebView with a Adsense unit inside it. I think when you are setting up a ad unit you can enter keywords.
This is most probably a violation of their terms, though. It may be a better idea to try using something else like http://www.admob.com/.
Since AdSense requires the content of the page it's on to serve up relevant ads, you're likely to get nothing but PSA ads, since Google can't crawl your app.
And like Isaac says, I'm sure it's against the AdSense terms.
Google's Mobile Adsense is on the run:
TechCrunch article