show off mobile sites in web portfolio? - html

Does anyone out there know if its possible to show a working version of a mobile site in a web portfolio? Wondered if there was an emulator that could be used for this purpose?
Any ideas, please give me a shout.

If you're using device detection on the mobile site, the easiest way would be to have a flag in your URL that will make the site think it's serving a mobile client and not a web client. This depends on your implementation, but spoofing the device is the easiest way. Makes it easier to debug as well.

this site shows samples of mobile sencha touch apps running in an iphone
http://www.synthphone.com/
below is a sample URL that links directly to google mobile site on a device with dimensions 320 x 480 (iPhone)
http://www.synthphone.com/?u=http://m.google.com&w=320&h=480
hope this gives you some ideas at least

Related

How do you test your html on mobile?

I use Brackets editor to develop, I can check website on Chrome in desktop with :
http://127.0.0.1:49371/index.html
But it won't load on my iPhone (same wifi)
(I know I can play with the window on chrome, I need actual mobile device)
Couldn't find a way to do this.
ngrok is good for this, it allows you to publicly share local urls https://ngrok.com/
This is really hard to do. One solution that is easy, however, is to code on codepen.io and view your projects in debug view on mobile.

Determining the clients device (PC or Mobile)

I am returing to website development and I want my work to be as global as possible. When a web surfer arrives at my site, is there a way to determine whether he/she is surfing with a PC or mobile phone and disply the content accordingly? Or would it be better to build responsive sites using CSS?
Take a look at the following questions, looks like there could be quite a lot of useful information in there for you:
What is the best way to detect a mobile device in jQuery?
How to detect a mobile device with JavaScript?
Auto detect mobile browser (via user-agent?)
You can use Request.UserAgent because UserAgent gets the raw user agent string of the client browser

1 HTML5 code to rule them all

We're new to mobile. We have our HTML5 page (w/ PHP) up and running live. We now want to go mobile. Whether it's a native app or mobile web doesn't make a difference in our situation. We just want to have 1 set of code to maintain (with only minor tweaks here or there for different platforms). We've played around somewhat with Titanium & Phonegap but it seems like we have to make a LOT of modifications to our HTML5 code.
When people talk about a "mobile web app" (ie http://techcrunch.com/2011/11/18/financial-times-mobile/) what do they mean? Is it simply loading our HTML5 website from an iphone? If not, what development frameworks should we use? thx!
I don't see much difference between a mobile web app and a web app. Browsers on smartphones are sometimes even better then browsers people use at home...
Things you should really keep in mind are screen sizes and no mouseover effects.
Common used technologies for a mobile web app are:
HTML 5, CSS , JS , jQuery, jQuery Mobile (which was released 1.0 a few days ago!)
Server technologies are pretty much the same.
In order to generate the impression of a native app you could then use Phonegap.
I recommend using the Sencha framework for mobile apps. It makes your HTML5 app look like, and feel like a native app for any phone OS.
You can surely implement a mobile web application by implementing it as a web application. Obviously you have to give special consideration to the targeted mobile devices, and do lots of prototyping & testing. Browsers are really getting better on the mobile devices - so that's something good.
If you can create the experience you want in a web application, then great! As of now many developers find it worthwhile to write applications that directly target mobile devices, while also providing a web application. Once you have multiple kinds of clients, it's a good idea to implement the functionality in your application in a web API, which is accessible to the various clients (web app (browser), iOS app, Android app, etc.).

Can we use PhoneGap for Mobile Sites Development?

Can any one please suggest me the way to develop the Mobile sites .We already have the Main Desktop site and want to develop the mobile versions so what is the best way to developed the mobile version of the site. My site is based on Joomla but i did not find any module full fill our requirement now i want to know one thing more is there any way to develop the mobile site using some software which use API of my main site to access the data base because i have API because i already develop my native app for iPHONE and ANDROID.
Thanks in Advance
I think no.. because Phonegap uses a native library (plug-in) to make things works, for example you have to include phonegap.jar for android projects. And in your website you cant include native code..
Take a look at jQuery Mobile and Sencha Touch

Can anyone access to the camera by html5 in the mobile safari (ios5)?

As we can see opera software make the api to help developer to access to the camera from the web page.
Can we do it on mobile safari in ios5 ?
Besides,some guys said that they can do it on a android device.Is it really?
If you know that,please post the link following your answers.
Thank you very much.
You can access to the hardware by using a library like phonegap. This can be done only if phonegap and your html page are embedded in an app.
http://docs.phonegap.com/en/1.1.0/phonegap_camera_camera.md.html#Camera
A website, or any javascript code loaded from a real website won't be allowed to use a phone camera for security purposes.