Web Design - iPhone Look?

ironclaw

Hi Folks,

I'm looking for a template in the outline of an iPhone. I have good knowledge of PHP, Objective C but I'm hopeless at CSS and generally the development of the "how it looks" end of websites.

As such would anyone be able to guide me to a good template or even a tutorial so that I could make one. I'm looking for the outline of an iPhone or iPad as the screen, and I'm going to fill the inside with content from PHP. I can manage that bit, its the look of the site I'm hopeless at.

I'm not looking for the iWebKit or for an iPhone friendly site, more a site that looks like an iPhone

Thanks!

ironclaw.

murphaph

Check out the jQuery mobile framework maybe. The end result is deliberately iPhone'ish and cross device compatibility is hard to beat. A lad in our office is currently developing a mobile web version of our app on it and it looks really nice, almost as good as the native iPhone app itself tbh.

I am definitely going to do something with it in my own time at some stage.

sicruise

http://www.sencha.com/ seems to do everything you are looking for.

S.M.B.

I'm guessing the OP isn't looking for a framework to build mobile sites upon like JQM or sencha touch.

The way I read it he's looking for some sort of pre-built html template which would basically consist of a large background image which looks like an iphone and then dynamic content would be contained within the iphone screen of the design.

Have never come across anything like this but wouldn't be surprised if some sort of wordpress theme exists.

Eoin

I did something similar for a demo, but I just got an image of an iPhone from google, and floated an iFrame on top of it so it appeared in the content area.

tricky D

An alternative to eoin's suggestion is to grab from Google, chop it into 4 pieces: top, left bit, right and bottom bits, and stick a div in the middle.

---

top div

---

left div | content div | right div

---

bottom div

---

Eoin

Yep, that's probably a cleaner solution. I only had 5 minutes to prep for the demo though, so went with the hacky way!

Remember that it might not look or behave completely like an iPhone - even desktop Safari spoofing the iPhone user agent can be different to a real iPhone browser, so other browsers might be different again.

ironclaw

S.M.B. wrote: »

I'm guessing the OP isn't looking for a framework to build mobile sites upon like JQM or sencha touch.

The way I read it he's looking for some sort of pre-built html template which would basically consist of a large background image which looks like an iphone and then dynamic content would be contained within the iphone screen of the design.

Have never come across anything like this but wouldn't be surprised if some sort of wordpress theme exists.

Thats it exactly. Thank you for the input folks. I'll try the 4 way cut and a div.