I have been guilty of using excessive javascript on my website developments, while ignoring the fact that some people, especially the iOS device users at time disable their javascript on their browsers.
I have been developing my own version of captcha, and I designed it, by using an external javascript, that in a way no one will be able to see the generated script on the page itself.
Only problem, is the method I created is not compatible with old iPad devices that have not updated their safari browser. I was able to fix the problem, by directly placing the images on the page and not changing values on my html elements.
Website Development & Programming related to front-end and back-end. Tech news: on gadgets, technology for the web and other things I think will be of use to people to be on the know.
Showing posts with label Mobile. Show all posts
Showing posts with label Mobile. Show all posts
Monday, March 4, 2013
Tuesday, January 29, 2013
Very good site to know the mobile screen size or viewport width
I was confident the project we are doing will will render fine on the mobile browsers of any devices. Then when we are testing in on my Galaxy S3, I notice the condition my Jr. developer made for the CSS was not correctly triggered and I was not satisfied on the way the page was shown.
I asked, what was the problem, and according to my jr. developer: There was no way of knowing the size since every time a browser zooms, the pixel width in the viewport changes. Which was true, when we tested it on our desktops and also on Opera mobile browser emulator.
While searching for a solution online, I stumbled upon this page: http://i-skool.co.uk/mobile-development/web-design-for-mobiles-and-tablets-viewport-sizes/ where a list of most mobile devices and their viewport are listed. This is very helpful in determining the smallest width you have to look for on a device.
I gave them a solution to place a width on the smallest screen possible at the viewport meta and this fixed the problem. But being a stubborn subordinate; my jr. developer retained the current settings and just change the CSS. Adding another pixel condition to render properly on my device.
When I asked, why do it like that, the reason according to my jr. developer was that setting a specific size will not render correctly on iPhone. Since none of us owns an iPhone, we have to rely on the web on this findings. According to my jr. developer the mobile website will now render correctly on the 240 pixel viewport screen, that is good enough for me.
I asked, what was the problem, and according to my jr. developer: There was no way of knowing the size since every time a browser zooms, the pixel width in the viewport changes. Which was true, when we tested it on our desktops and also on Opera mobile browser emulator.
While searching for a solution online, I stumbled upon this page: http://i-skool.co.uk/mobile-development/web-design-for-mobiles-and-tablets-viewport-sizes/ where a list of most mobile devices and their viewport are listed. This is very helpful in determining the smallest width you have to look for on a device.
I gave them a solution to place a width on the smallest screen possible at the viewport meta and this fixed the problem. But being a stubborn subordinate; my jr. developer retained the current settings and just change the CSS. Adding another pixel condition to render properly on my device.
When I asked, why do it like that, the reason according to my jr. developer was that setting a specific size will not render correctly on iPhone. Since none of us owns an iPhone, we have to rely on the web on this findings. According to my jr. developer the mobile website will now render correctly on the 240 pixel viewport screen, that is good enough for me.
Wednesday, December 26, 2012
Free Mobile Browser Detection code generation
While searching for a mobile browser detection code, I came across this site: http://detectmobilebrowsers.com/
This site generates the code for popular browsers to detect using the USER AGENT of the browser used. It's free to use, and donation to keep the site alive is pretty much appreciated by the author.
This is another useful website, that is simple to use, but takes a while to dissect the code. You pretty much need to brush up on your regular expression to understand the code and what it compares. But if you are not worried about the code behind the detection, by all means, just paste the code to your site and set the redirection page.
This site generates the code for popular browsers to detect using the USER AGENT of the browser used. It's free to use, and donation to keep the site alive is pretty much appreciated by the author.
This is another useful website, that is simple to use, but takes a while to dissect the code. You pretty much need to brush up on your regular expression to understand the code and what it compares. But if you are not worried about the code behind the detection, by all means, just paste the code to your site and set the redirection page.
Subscribe to:
Posts (Atom)