7 ms·

How To Build A Mobile Website

95 points by vladocar 16y ago

davidw 16y ago
Symbian's share seems suspiciously small. Maybe it's US only or something like that.
- blutonium 16y ago
  It's probably right - Symbian users don't browse the web nearly as much folks with newer mobile OSes.
- hopeless 16y ago
  When I owned a Symbian phone I did use it to browse the web but I used Opera Mini. The symbian browser was pitifully slow and awkward. That might also account for the small percentage.
- asmosoinio 16y ago
  Yes, the Nielsen Study they are citing is US only. Global market share for Symbian in smart phones is around 30-40 depending on the source. (44% in 1Q10 according Gartner: http://www.gartner.com/it/page.jsp?id=1372013 http://www.gartner.com/it/page.jsp?id=1372013)
davidedicillo 16y ago
I wish they took in consideration in the first chart the percentage of users of those platforms who actually surf the web with their phone.
- RyanMcGreal 16y ago
  They do address this later: "With a market share of 28% and estimates of as much as 50% of mobile browsing going through iPhone, it makes sense that developers make special accommodations for the mobile giant."
tnorthcutt 16y ago
One thing I didn't see covered in the "User Initiated Method" section is detecting mobile browsers, and prompting the user to choose between the full site and the mobile site. I like this method, since most of the time, the detection will probably work, and thus users will be made aware that there is a mobile version, whereas they might miss a small link in the header or footer (even moreso on a small mobile screen). Additionally, it still allows choosing for those mobile users who wish to view the full site (or desktop users who wish to view the mobile site), and you can still have the "view mobile site" link on the full site for the users who were somehow missed by the browser detection method. IMO, this is the best combination of automagically changing things and allowing the user to choose. ESPN.com is a good example of using this method.
- djb_hackernews 16y ago
  I do this for one of my webapps. I detect based on the user agent, and just pass off to different templates (I'm using django). So it doesn't really matter what url you use, it just matters what device. I also have an 'm' subdomain that automatically goes to the mobile version. I stayed away from the prompt, because mobile browsers are really terrible, and dialogs are that much more terrible.
chadgeidel 16y ago
How NOT to build a mobile website: When I click a direct link to an article on my phone, just redirect me (without prompting) to your mobile home page because you are too lazy to remember the article I wanted to read. Bonus points if your mobile site is actually hosted on another domain (and, presumably handled by a 3rd party). I guess you just don't want my mobile traffic then?
- jfarmer 16y ago
  This is absolutely the most annoying thing I've found on the mobile web. Newspapers seem to be particularly bad at it.
- thwarted 16y ago
  JavaScript based redirects to a mobile version are annoying also, because they seem break the back button in mobile browsers. When I hit back, it goes back to the page that redirected me, and I end up right back at the place I don't want to be anymore. I hate Wikipedia's mobile browsing because of this.
mishmax 16y ago
Speaking of mobile design. Anyone here experienced with converting static websites to mobile-friendly sites? I have a few paid projects to do this and it's been hard finding a good contracter in this space. If interested, please email me. My email's in my profile.
- Concours 16y ago
  My startup ( http://www.gmbhnews.net http://www.gmbhnews.net ) offers a solution for dynamic sites at this point. We are working to find a way to offer the same service for static sites and have this on our developpment roadmap.
Isofarro 16y ago
How to build a mobile website: 1.) Open website in a mobile browser.
bretthopper 16y ago
Like most Smashing Magazine articles, this is good advice overall but gets some details wrong. They recommend using display: none on images to reduce bandwidth. Except browsers still load images which are set to display: none.
- iamjpg 16y ago
  I think my problem with development articles on Smashing Magazine is that they most often tend to be "good advice" and a little thin on content. While a lot of the information in that article is relevant/important from a foundational aspect, it only scratches the surface of mobile development. Additionally - to barely mention mobile frameworks like jqTouch, jQuery Mobile, & Sencha Touch under a section called "Special iPhone / iPad Enhancements" is not only misleading (WebKit is also on Android, hello) but , if expanded on, could have been the most helpful part of that article for someone who really wants to learn about mobile development. The conclusion of the article talks about the infancy of mobile and how standards are emerging. I would argue that frameworks like the ones above can help drive mobile standards and also enable developers to build applications within the mobile space with confidence.

95 points by vladocar 16y ago

davidw 16y ago

Symbian's share seems suspiciously small. Maybe it's US only or something like that.

blutonium 16y ago
It's probably right - Symbian users don't browse the web nearly as much folks with newer mobile OSes.
hopeless 16y ago
When I owned a Symbian phone I did use it to browse the web but I used Opera Mini. The symbian browser was pitifully slow and awkward. That might also account for the small percentage.
asmosoinio 16y ago
Yes, the Nielsen Study they are citing is US only. Global market share for Symbian in smart phones is around 30-40 depending on the source. (44% in 1Q10 according Gartner: http://www.gartner.com/it/page.jsp?id=1372013 http://www.gartner.com/it/page.jsp?id=1372013)

davidedicillo 16y ago

I wish they took in consideration in the first chart the percentage of users of those platforms who actually surf the web with their phone.

RyanMcGreal 16y ago
They do address this later: "With a market share of 28% and estimates of as much as 50% of mobile browsing going through iPhone, it makes sense that developers make special accommodations for the mobile giant."

tnorthcutt 16y ago

One thing I didn't see covered in the "User Initiated Method" section is detecting mobile browsers, and prompting the user to choose between the full site and the mobile site. I like this method, since most of the time, the detection will probably work, and thus users will be made aware that there is a mobile version, whereas they might miss a small link in the header or footer (even moreso on a small mobile screen). Additionally, it still allows choosing for those mobile users who wish to view the full site (or desktop users who wish to view the mobile site), and you can still have the "view mobile site" link on the full site for the users who were somehow missed by the browser detection method. IMO, this is the best combination of automagically changing things and allowing the user to choose. ESPN.com is a good example of using this method.

djb_hackernews 16y ago
I do this for one of my webapps. I detect based on the user agent, and just pass off to different templates (I'm using django). So it doesn't really matter what url you use, it just matters what device. I also have an 'm' subdomain that automatically goes to the mobile version. I stayed away from the prompt, because mobile browsers are really terrible, and dialogs are that much more terrible.

chadgeidel 16y ago

How NOT to build a mobile website: When I click a direct link to an article on my phone, just redirect me (without prompting) to your mobile home page because you are too lazy to remember the article I wanted to read. Bonus points if your mobile site is actually hosted on another domain (and, presumably handled by a 3rd party). I guess you just don't want my mobile traffic then?

jfarmer 16y ago
This is absolutely the most annoying thing I've found on the mobile web. Newspapers seem to be particularly bad at it.
thwarted 16y ago
JavaScript based redirects to a mobile version are annoying also, because they seem break the back button in mobile browsers. When I hit back, it goes back to the page that redirected me, and I end up right back at the place I don't want to be anymore. I hate Wikipedia's mobile browsing because of this.

mishmax 16y ago

Speaking of mobile design. Anyone here experienced with converting static websites to mobile-friendly sites? I have a few paid projects to do this and it's been hard finding a good contracter in this space. If interested, please email me. My email's in my profile.

Concours 16y ago
My startup ( http://www.gmbhnews.net http://www.gmbhnews.net ) offers a solution for dynamic sites at this point. We are working to find a way to offer the same service for static sites and have this on our developpment roadmap.

Isofarro 16y ago

How to build a mobile website: 1.) Open website in a mobile browser.

bretthopper 16y ago

Like most Smashing Magazine articles, this is good advice overall but gets some details wrong. They recommend using display: none on images to reduce bandwidth. Except browsers still load images which are set to display: none.

iamjpg 16y ago
I think my problem with development articles on Smashing Magazine is that they most often tend to be "good advice" and a little thin on content. While a lot of the information in that article is relevant/important from a foundational aspect, it only scratches the surface of mobile development. Additionally - to barely mention mobile frameworks like jqTouch, jQuery Mobile, & Sencha Touch under a section called "Special iPhone / iPad Enhancements" is not only misleading (WebKit is also on Android, hello) but , if expanded on, could have been the most helpful part of that article for someone who really wants to learn about mobile development. The conclusion of the article talks about the infancy of mobile and how standards are emerging. I would argue that frameworks like the ones above can help drive mobile standards and also enable developers to build applications within the mobile space with confidence.