Is it Possible to see my wesbite im working on in my Iphone? - responsive-design

I am wondering if i can see my WIP website on my Iphone without publishing it. Is there any app or anything so i can see it on my phone. I know you can for example resize you browser to act likte a phone and with google you can use the tools to get the screen to be as a phone, but its not the same as having to see the whole thing on your phone, that way you can see the whole thing responsive and can work easier from there.

Best practice would be setting up a development environment and publish to that instance. In many cases you'll find developers with sub-domains like dev.domain.com for purposes just like this. Hope this helps...

Related

Why is the performance of my app perfectly fine on desktop but it messes up on phone using ReactJs?

Someone asked me to create a website for his sportsclub, I decided it try and make this webpage in ReactJs.
https://complexbjj-2a19b.firebaseapp.com/ this is the outcome, looks pretty and
works well on desktop.
It's pretty responsive layout wise.
So I was pretty happy untill I decided to build and deploy for production.
Sadly I found out that the webpage wasn't optimised for phones at all, leaving random blank spaces.
I tried allot of things, changing to PureComponents, Using React.memo.., etc etc.
Nothing seems to help, so now I'm here after hours & hours of trying to find a solution with my hands in my hair.
Does anyone know what could be causing this problem?
If you have the Google Chrome browser installed on your machine, you can try auditing your app in the inspector Audits tab (here is the doc). That could help you spot possible improvements.

tumblr mobile not working with prettify.js

So I wired in Prettify.js and Prettify.css into my new Tumblr blog. It works out great in chrome, IE, and Firefox but I was astonished when I went to my Android Phone and suddenly the code inside ... looks like an atrocity.
I was about to go digging but figured before I spend hours trying to solve a problem someone else already fixed I would see if my ol' Stack Buddies have anything to say on the matter.
aquamoogle.tumblr.com
Any solutions will be greatly appreciated and if none are posted I'll likely toss up a solution by the end of the weekend.
Clarification EDIT This is viewing the post through the Tumblr Android application. I don't think it has anything to do with phone version but because someone is bound to ask it's a Motorola Droid Bionic running Android 2.3.4
Alrighty, since nobody came along with this one I'll throw the answer out there. The Tumblr application after decompiling it off the APK does not use a standard web frame. This means that javascript execution is not embedded in the view for the mobile application.
Sucks I know... Another possible solution would be to use straight CSS for formatting but alas this doesn't even work in the mobile version as the CSS sheets are overridden with mobile style sheets for more compact formatting.
So this one goes down as "unsolvable" due to the mobile application not operating within the same boundaries as the web driven blog does.
If someone does by chance have a solution to this that will work however, I would be interested in hearing it but at this time I don't have a valid solution. But, it's good to know.

what ways are there for mobile web design?

I want to know how to design a website. The website is shown normal on the web and mobile, but I need to know which one is better?
Design two different templates (one template for mobile and the other one for a normal monitor).
Check online through the user's device to see if its using a mobile device so I can change the stylesheet.
Is this correct? If there are any ideas, please tell me.
Thanks
I would go for 1. Normally you don't want to show as much content on your mobile website as your "normal" desktop website. But include a link to your normal website from your mobile website.
I would go for one, as axelios suggested, I would include a link.
I, as a user, find extremely annoying websites that refuse to display the full site because they "recognised my browser as a mobile browser". Several newssites do that, which has eventually diminished the number of news I read, and some shops did so, which means I don't visit their sites anymore... so I strongly discourage the second solution.

Are there any good captchas specifically designed for mobile apps?

Is there anything that is less intimidating than recaptcha for mobile apps? My app is built with JQuery Mobile and most likely will never be available on the desktop. I am hoping there is a more visual captcha that would not require typing. So far most visual captchas I have found seem too large for a mobile app. I am mainly looking for something that is visual and small enough to fit within the average mobile screen. Any suggestions would be appreciated, I would even be willing to build something from scratch if someone has a good idea.
I don't know if you are using HTML5 or not, but there is a pretty cool captcha that I've used called MotionCAPTCHA. What it does is it presents a shape and the user traces the shape with their finger on their mobile device. Its pretty cool. I've used it with Android and it works pretty well. It requires jQuery and HTML5.
Damn, that MotionCAPTCHA link appears to be dead. I found this question looking for similar things to what we're working on at my current company.
We have a HumanDetect mobile SDK trying to solve a similar problem. The overall idea is we grab sensor data from the phone so we can determine "bot or not". You ask the SDK for a token, then send that token along with your REST request, and then that token can be validated. If everything works as expected only a mobile device in the hands of a human should produce a token that validates as "not a bot".
It's native code, not using the browser. For the end-user's point of view, it is transparent, the user isn't asked to perform any action.

Making site usable both from Mobile devices and desktops

I have a website that I want to make look good from a non-mobile browser, but make very usable from a mobile device.
I'm thinking I'm going to detect if the user is likely using a mobile device, and if they are, redirect the first hit to a page that says something like: "It looks like you're viewing this page on a mobile device. Would you like to view the mobile version?" Based on the user selection, I'll set a cookie. (Would this be annoying, or helpful?)
But I'd also like to make sure that if I miss someone who is mobile browsing (if I think they're non-mobile, but it turns out they aren't), I provide some way to switch to the mobile version. Also, if I detect someone is mobile, but they'd prefer to browse the full non-mobile site, I need to allow that, too.
I'm leaning toward having a mobile and non-mobile version of every page on the site, just presenting the data differently (and with a lot less images, etc) for the non-mobile version.
Anyone who's been through this, have advice? Any links to sites that do this right?
I'd suggest using WURFL for the detection part.
Also, lots of good reading material about such practices on Mobiforge

Resources