How did the fluther creators make this site fit perfectly on my iPhone?
Asked by
nickells (
2)
August 6th, 2008
from iPhone
It’s interface is the exact same size as my screen, perfectly formatted. How did they do this? Is there a way to re-format any website if you know what to do?
EDIT
—————————————————————————
I mean how do they make it a smaller, more slimmed down version so it’s compatible so it doesn’t run slowly? iWamoto was showing off his site in a post and it looks very good on the iPhone.
Observing members:
0
Composing members:
0
9 Answers
They are truly gods among men!
In answer to your question the fluther site detects you are using iphone safari and sends you to a specially formatted site (what apple calls a web app).
The trick here is the design. Getting everything in without it feeling squashed and still in keeping with the original site is probably much harder than the actual technical coding of the site.
Like Lightlyseared said, the server detects what browser is being used an renders the appropriate layout.
The Apple Web Apps Dev Center has everything you need to know in terms of actually building the html, css, etc.
Pretty easy to do. I even have a special iPhone version for my blog
Mirza, that doesn’t look anything like an iPhone formatted version. That looks more like an RSS feed. Unless thats what you meant?
What do you mean it doesn’t look like an iPhone formatted version? That’s exactly what an iPhone version of most webpages looks like. Fluther just went a few steps further and made a more detailed theme.
That’s very true, Eambos. But, I’m trying to define it as a slimmed down, alternative aside from the desktop version. Try this, Google is a general example for what I’m trying to implement. The iPhone does for the most part redirect you to the mobile-version of websites, but what I’m trying to get across here is; what if the owner of the website does not know how to create a mobile-formatted version of his/her website? Only to get the best of his customers.
......................................................................
How does one create a seperate, smaller, more accessable, cleaner version of his/her website so his/her viewers can access his/her site without loading (on an iPhone) the full desktop version?
A subdomain, a redirect, and CSS.
@nickells, You need to design an alternate version of the website. We’re lucky, because our framework is really extensible so we could re-use a lot of things.
Then you need to make sure that you you redirect users to that alternate site.
So, you need a good design, and competant programmers.
Answer this question
This question is in the General Section. Responses must be helpful and on-topic.