Have you noticed how regular web pages look so small on the iPhone? By default the Safari browser shows you the whole web page which is supposed to be a LOT bigger than the iPhone display. But some sites have great 'mobile' versions of their site that fit and behave perfectly on the iPhone.
Now instead of learning all the javascript and browser detection scripting required to do that, you can just use psd2css Online and have your iPhone web app design coded and working in seconds.
Just name any one of the layers in your Photoshop PSD file with the new _iphone Layer Naming Convention and you'll automatically get all the iPhone javascript goodness that makes it work.
What's more is all the jQuery and regular psd2css Online features work there too - dynamic menus, multi-page sites, image galleries, even WordPress, Drupal and Joomla!
Check out this video tutorial about how to use it:
Here is the PSD file used in the video:
http://psd2cssonline.com/tutorials/iphone/iphone.psd
And you can see the generated code in action here (point your iPhone browser to this url):
http://psd2cssonline.com/tutorials/iphone/index.html
Mobile website for regular handsets?
Hi Sean
Great site! Is it possible to use the '_iphone' feature to build mobi sites for lower-end/regular handsets?
Tx
Amazing but how to do it for drupal or wordpress site
Let me start by saying this tool is just amazing.
I also wanted to know how do I apply this iPhone version to my drupal and WordPress sites.
Much help would be appreciated.
Thanks in advance
Thanks
Hi psd2cssonline.com
Thanks for sharing your knowledge with us.
I'm new in design world, i've spend a lot of time surfing in internet trying to get some good tutorials and when i sow you page my reaction was like: woooow this can't be true.
Take care and keep it up!.
Regards from Spain.
Nice! Thank you for the
Nice! Thank you for the share! This is somewhat new to me but I've learned fast and have adjusted the settings from my newly bought iPhone. The tutorial and instructions you've provided are easy to follow. Thanks again, I really learned a lot from here.<a href="http://lionheart.net">tampa web design</a>