I need to develop a website which will be used exclusively on iPhone and iPad. I don't have those devices, neither do I have a Mac.
What are the possible free solutions for me to be able to test the website during development?
The most obvious one would be to use an iPhone SDK, but since it costs $100/year but since it is available only for Mac, it is not a solution in my case.
Download Safari 5 for Windows, enable the Developer Menu features and change the User Agent to Mobile Safari iPad or Mobile Safari iPhone. This will let you see how your website looks when an iPad or iPhone renders it. Just make the window smaller to get the full experience.
If analyst predictions are right, there will soon likely be an abundance of iPhone 3G devices on eBay as lots of people are eligible to upgrade to iPhone 4 tomorrow. Picking up a cheap 3G may be the best solution to your testing requirements.
Or you can test it out at an Apple Store if your website is accessible over the internet or available on a laptop with an ad-hoc WiFi connection.
You can test your website in any browser, but yes, mobile browser probably behave different at some points.
If you cannot find a mobile web browser simulator for iPhone than the "cheapest" alternative would probably be an iPod touch.
Update:
You might want to have a look at iBBDemo:
iBBDemo2 - Cross Platform iPad and iPhone Simulator
You could try using something like:
www.testiphone.com/
Recommend you use jsconsole
Remotely debug a mobile web app
jsconsole.com is a simple JavaScript command line tool. However, it also provides the ability to bridge across to other browser windows to remotely control and debug that window - be it in another browser or another device altogether.
In fact, mobile web app debugging is so damn tricky, that I gave up, and decided to build this very tool instead. See the videos examples if you'd rather see this in action now.
Creating a session
To create a new session, in the jsconsole prompt, simply run:
:listen
This will yield a unique key along the lines of FAE031CD-74A0-46D3-AE36-757BAB262BEA. Now using this unique key, include a anywhere in the web app that you wish to debug:
<script src="http://jsconsole.com/remote.js?FAE031CD-74A0-46D3-AE36-757BAB262BEA"></script>
Now any calls to console.log from your web app will display the result in the jsconsole session that is listening to your key. Equally, if you run a command in the jsconsole session, the code will injected in to your web app and the result returned to jsconsole.
In addition to generating a new code with :listen, you can also ask jsconsole to listen to a predefined code (but for your own security, try to chose something unique that only you know):
:listen FAE031CD-74A0-46D3-AE36-757BAB262BEA
Now I can use the same remote key in my web app to avoid having to regenerate a new code each time. Note that only the last remote client (i.e. your web app) to connect to jsconsole will recieve remote debug calls - previous windows will be ignored.
To know when the web app has connected, jsconsole will notify you by showing your the userAgent string for the device:
:listen FAE031CD-74A0-46D3-AE36-757BAB262BEA
Creating connection...
Connected to "FAE031CD-74A0-46D3-AE36-757BAB262BEA"
Connection established with Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-GB; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
A word of warning
Note that this technique is also injecting code directly in to your web app - this tool should only be used for debugging. I can't take respibility for how you use this tool, basically: take care!
Current known support
Remote debugging has been developed to work on all platforms, even if the technology isn't supported. However, jsconsole remote debugging has specifically tested and working on the follow mobile devices (feel free to add to this list):
iOS 4.2.x - iPad, iPhone 4
Andriod 2.2.2 - Nexus One
webOS - Palm Pre
There are some Video examples too
More detailed information please see this links:
http://jsconsole.com/remote-debugging.html
There are some obvious things here:
1)Work very hard to make your site work on all major browsers - including Safari and any other mobile devices other than iPad... this will let you make sure it works on smaller screens well.
2)Read up on known glitches in these browsers and see if you can avoid them.
3)Whenever you are with friends showing off their iPad, or who have an iPhone, ask to test your site on it.
I need to develop a website which will be used exclusively on iPhone and iPad
This seems a bad idea. if it's only used on iPad/iPhone, surely you should write an App and get all the benefits of UI, etc.
Websites should not be tied to specific devices.
This is not 1998 : Best viewed in I.E. In fact your suggestion is worse than that.
If you really want a website that only works on those devices then you'll need to check the user-agent string, but otherwise html is html and unlike what Apple may want you to believe, works just as well on Symbian, Blackberry, Android, S40, Windows, Windows Mobile, etc etc..
(In fact, it works better on Symbian as Symbian actually supports Flash.)
Related
I don't have an Apple computer, I just have an iPhone and some knowledge about language development. I want to create my own app for my own use, just for fun! I don't want to pay Apple for a developer account. I just want to develop my app and put it on my iPhone. I can either develop on Linux or Windows. How can I do that?
If you want to develop on an actual iPhone, you'll need a developer licence. To developer apps natively you will need a Mac running XCode.
There's lots of HTML5 libraries for making apps using javascript though. Maybe try out Phonegap or GameSalad
At the minimum you'll need to have OSX (Mac Operating system) to run Xcode/iphone emulator, you wont be able to do this without OSX.
EDIT:
You may be able to develop it using phone gap: http://phonegap.com/
You'll have to do testing on an adriod emulator, but I believe phonegap builds the app in the cloud. Good luck.
You can develop an app using adobe AIR or adobe Flash. Check out FlashDevelop for a free solution for making flash and air apps for everything from windows to android to iOS.
For a somewhat detailed tutorial on how to actually export an AIR project from FlashDevelop so you can install it on an iOS device, see:
http://www.codeandvisual.com/2011/exporting-for-iphone-using-air-27-and-flashdevelop-part-one-installation/
and FYI, this is not JUST for jailbroken iOS devices! :D
Native iOS applications can only be built in Xcode (which can only run on a Mac), and you need a developer membership to deploy those on an actual device (which costs about $100 a year). So, that’s the caveat: You can’t make native apps.
However, native apps aren’t the only option! There are two other approaches.
One way is to make a web app. These days, web apps can do almost everything that a native app can do (even access the camera). Unless you’re building something specialized (like a video editor, for example, or a game that needs to work with Bluetooth game controllers), you can probably make something as a web app. Years ago, I wasn’t happy with the flashcard apps on the market and wanted something custom but super simple to help me study JLPT vocabulary. At the time, I also didn’t have the money for a developer membership. I made it as a web app, and it worked great!
If you’re making a web app, you’ll need someplace to host it. There are lots of options. For example, the free tier on Firebase is plenty for a personal-use web app. You also might want to consider building the app using client-side scripting (like Javascript) so that you can host it statically, which will allow you to tell iOS to cache it so you can utilize it offline (Google “HTML offline manifest” for details).
The other way, if you have a friend with a developer account, is to build your app using a cross-platform framework like Flutter, where you don’t need a Mac to develop and test it, then ask your friend to make it for you. You’ll need to rebuild periodically (I think once a year) because your provisioning profile will expire.
If you use a framework like Flutter that can build both native AND web apps, that gives you the ability to run natively (if you have access to a Mac) or host it statically on someplace like Firebase Hosting (if you don’t).
I know native app development for iOS is not possible on windows but for Web Apps Development it's possible on all OS.
Is there any benefit buy a iMac or Macbook over Windows PC just to make and test HTML5 + CSS3 Web apps and sites for iphone? If I'm already having iPhone.
As I already have iphone and ipad so i think I don't need Emulators of iOS SDK.
1) Can having Mac improve productivity in making Web Apps not Native apps?
2) Are there any better Web Development tools available on MAC to make Mobile Websites and Web Apps for iPhone compare to windows?
3) Currently whenever I want to test something on iphone safari I upload first all files into my ftp (online) then i open the url from iphone safari. But If I buy mac and install Apple SDK, can I run local html files directly on iPhone emulator.
Note: My question is not related to making iOS native applications.
If there are any better tools, it's not worth the cost of a Mac. You're best sticking with your PC, especially if you've never used a Mac before (or if you've not used one often),
Simple things like the window controls being on the "wrong" side of the window and not doing the same thing as their window counterparts ("maximise" is not the same on Mac) can cause annoyance and cost time.
Testing files locally isn't exactly the same as remotely, and the emulator will not match the iphone, as the user agent strings are different. Also the simulator is designed for native apps primarily so I'm betting the Safari on it is not exactly the same as on a device. Basically you can't beat the device.
To be honest (I am a mac fan and always have been) if you are switching to mac for just for testing purposes it really wouldn't be worth it. You said in your question that you have a an iPhone and iPad both of those can connect to a local network and you can preview on them. Testing iPhone and iPad event on the iOS emulator really... sucks. You dont get any of the touch events or the slides so you really do need the real thing. I just finished developing a full HTML5 webapp for the iPad/phone and I had to go out and buy an iPad for testing; the simulator would not cut it at all.
Now on the other hand if you want to switch for a development environment I have always been a fan of OSX. For two main reasons
The fact that the development tools
for mac are amazing, Coda, TextMate,
Sequel Pro, and CSS Editor alone
make my computer worth it.
It's UNIX, if you are a web designer
or developer who does not dabble in
unix then this does not matter but I
manage servers all over the world
for about 30 different clients and
the fact that OSX is UNIX underneath
makes getting in and out, scripting,
and moving files sooo easy. Try scp
with putty... it's no fun.
I hope this helps,
TL;DR version: For testing don't buy one it's not worth it. For the full package do it.
No. if you are already comfortable using a PC then stick with it. There aren't any better web development tools on the mac then the pc (personal tastes aside).
Can I successfully do iPhone/iPad web development (not native apps) on Windows, and without having an iPhone/iPad device?
I.e. work like PSD-to-iPhone-optimized XHTML/CSS layout.
I’m interested to learn about and make iPhone/iPad optimized websites. Any tips? How different will it be from desktop? What’s different other than the smaller screen?
From experience I will say the only true way to test for the iPad is to test on an iPad. I have been developing a site in html5 specifically for an iPad and we initially used the iPhone to test. The drag function we had implemented with jQuery had worked almost perfectly on the iPhone but after the client had tested on the iPad they came back to us and said the function did not work period and they were correct.
I guess this could change depending on what type of development you are doing. From experience I would say either A. Make some trips to the apple store B. Make friends with iPad owner C. Buy and iPad
yes for an ipohne emulator... try MobiOne.
It's a good application to test the pages in iphone like environment.
http://www.genuitec.com/mobile/
I don’t think you can really do iPhone/iPad development successfully without an iPhone/iPad at all, whether on Windows, Mac or Commodore 64.
If you’re serious about iPhone/iPad development, how could you not try your software out yourself on the devices it’s going to run on? Your clients are going to want code that works on the iPhone/iPad. You need an iPhone/iPad to check that it works.
if your developing a web app then i think you can use this: http://ipadpeek.com/
The answer is: Yes you can absolutely do iPhone and iPad website development on a Windows PC.
However, you really should/must test the result on an actual iPhone/iPod Touch/iPad. Especially if you are integrating in any way with special device features like the dialing feature of the phone. (Yes you can have phone numbers in a webpage trigger dialing when you tap on them.)
However, you can do the bulk of the development on Windows, testing the WebApp in Safari or Chrome, which are the most fully compliant HTML5 WebKit based browsers out there.
Also highly recommend using an HTML5 touch framework like jQuery Mobile or Sencha Touch. This will go a long way to ensuring that your WebApp is optimized for the screen size and touch gestures of the mobile devices.
Remember that you can't deploy a pure WebApp to the app store, only download it from a website. You'll need a native wrapper like PhoneGap for that. And to compile a PhoneGap wrapped WebApp you'll need XCode on a Mac.
But there's a lot of power in adding your WebApp to the home screen on iOS. No native code involved and you get a full screen webapp with a home screen icon, loading image and no browser toolbars. Highly recommended.
I have an iPhone web app I'm producing on a Linux machine. What's the best browser I can use to most closely mimic the feature-limited version of Safari present on the iPhone? (It's a "slimmed down" version of WebKit, which is more limited than one might think.)
A used iPod Touch for US$150 (used, in Seattle). It's either that, or the iPhone simulator running on a Mac. If one is specifically targeting "iPhone web app", the cost should be budgeted into the project.
Barring that, use desktop Safari. That will still require a Windows or Mac box. The rendering engine is the same, so I imagine it's as close as you're going to get on the desktop.
On the other hand, what are the problems you are trying to avoid? Mobile Safari is pretty good at rendering most web sites I call up. There are guidelines for development, and avoid media such as Flash. If you don't have the hardware, borrow it for sanity checking when you're done. That's the route I'd go if I absolutely didn't want to spend the US$150.
I want to test a website to see how it works with the iPhone but I don't own an iPhone or an iPod touch. Is there a way I can test how the site works on them without owning one?
What I'm really after is fixing how Stackoverflow's WMD markdown editor works on the iPhone. I hear that the hyperlink and image prompts are created too high. I think I know how to fix that but it's pretty tough to develop blind.
If you own a Mac, you can download the iPhone SDK which comes with an iPhone simulator. It works not only for debugging a native app but also for browsing the web.
If you have Safari on your computer, you can enable the "Develop" menu under Preferences > Advanced > Show Develop Menu in Menu Bar.
With this enabled, you can go to Develop > User Agent, and change the user-agent string to the device you want your browser to report to the web server as.
By resizing the window to the appropriate width, you can emulate what the site will look like on the iPhone.
The upside of this is that it's quick, it works on both Windows and Mac, and you don't need the iPhone SDK installed. You can also browse iPhone-specific versions of websites that catch user-agent strings directly from your PC.
The downside is obviously your Safari browser on your PC will behave quicker than on the actual device (especially in regard to javascript performance); it displays plugins and shows fonts that may not be available on the actual iPhone OS; a lack of multi-touch support and "snapping" to columns while scrolling; no auto-rotation; no multi-touch/pinch-zoom; widgets will look different; etc.
Just a notice on this old thread - we have now enabled live testing on iPhones and iPads via vnc at CrossBrowserTesting.com.
Ken - Founder
There is a free app on the mac that emulates the iPhone browser: iPhoney
I don't purport to have done more than a web search, but the problem seems to be solved by several products that are "iPhone web app emulators."
http://www.testiphone.com/
http://marketcircle.com/iphoney/