How does IsMobileDevice work? - asp.net

MSDN makes it sound so easy to detect a mobile browser:
if (Request.Browser["IsMobileDevice"] == "true" )
{
Response.Redirect("MobileDefault.aspx");
}
Actually, it looks like you can also just check Request.Browser.IsMobileDevice. But how does this actually work? I don't even have a .browser file... what's going on behind the scenes here? Are there some built-in defaults for ASP.NET 2.0?

A number of *.browser files are shipped with .NET:
C:\Windows\Microsoft.NET\Framework\v2.0.50727\CONFIG\Browsers
The runtime uses regular expressions from the *.browser files to match against the incoming User-Agent string, and then sets a bunch of properties based on each match it finds (there can be several in the hierarchy).
If you need in-depth mobile device support, consider installing the MDBF, which adds support for about 400 devices:
http://mdbf.codeplex.com/

Now, after 4 years, it's even more simple
Request.Browser.IsMobileDevice

Since for most sites, it is actually the size of the screen that matters and not so much the capabilities (at least when talking about modern phones with things like Safari and Chrome on them) wouldn't checking the resolution make the most sense?
Request.Browser.ScreenPixelsHeight
and
Request.Browser.ScreenPixelsWidth

I wouldn't rely on the MSDN link, there is no common standard unfortunately for mobile browsers and many try to mimic their non-mobile counterparts. Also it will return true if it doesn't recognize. See this link.

My current understanding is that there's just one exact solution to the problem of detecting whether a browser is mobile and next detecting its real capabilities. This solution is ScientiaMobile's WURFL (http://www.scientiamobile.com). Which, as of Aug30, is no longer free for every use. WURFL is now released with an ASP.NET API under AGPL. The data repository also comes with a specific license that disallows both copying and using with APIs different from the standard one (unless one purchases a commercial license).
So for practical purposes other approaches such as 51Degrees cannot be used with more recent and future versions of the WURFL repository and this will make it difficult for 51Degrees to detect new devices (Windows Phone 7.5, for example).
As for MDBF (a dismissed project), it may still work to detect whether a device is mobile (much better than the IsMobileDevice in ASP.NET). It is not entirely reliable as far as properties of the device are concerned. It insists that my HTC Desire Android has a 240x320 screen size, which is patently incorrect.
My company bought a WURFL license and we're absolutely OK with that.

Issues has been resolved while I added 51Degrees, just add 51degrees using Nuget thats all. See more here https://51degrees.codeplex.com

Simply use below code,
if (Request.Browser.IsMobileDevice)
{
Response.Redirect("MobileDefault.aspx");
}

Related

Should I use a CSS reset or normalize on Phonegap / Cordova apps?

I am wondering if its a good idea (if I want consistency across a multiplatform build) to include a css reset, or perhaps a css normalize library?
My concerns are of course, application speed, load time and memory usage, and the goal is of course UI consistency across platforms...
Overview
CSS reset is a must, Cordova / Phonegap all use the phones native browser so Windows Phone this is an Internet Explorer wrapper, android it's now a Chrome wrapper (old version use their own browsers wrapper), iOS uses what ever version of safari mobile for that version of iOS all of witch have more support for HTML5 so there could be differences. this means you need to reset so you have a base that is the same for all devices / browser the same as a Desktop website. but performance entirely relies on what your doing if you just use a small basic reset it will be less but then even a big one it's would you notice it anymore then not having it.
CSS Reset
So we know browsers have slight differences in CSS Engines Default Font's and stuff so we use a reset to prevent that this is the same for Mobile browsers (thats what cordova/phonegap use) so a reset is always recommended however, even if your building a cordova/phonegap mobile application for both iOS and Android is a royal pain in the arse Android support loads of Device Sizes iOS only has a few. but these sizes can cause massive problems not to mention the DDPI you have to use as the DPI varies so much.
Performance
There is a slight performance drop, not that you would see under any messurement it unless you include a massive CSS Reset system like http://getbootstrap.com/css/ that would add a bit of a performance hit but would you notice it if its 0.5 seconds your javascript takes longer from phonegap to init(), however look at bootstrap first if there is stuff in there that you would be using it would be worth it just to save development times i'm constantly using the alerts from http://getbootstrap.com/components/. there are small ones like http://html5doctor.com/html-5-reset-stylesheet/ if thats all your wanting.
Sources
The Internet it's full of tutorials telling you to implement a reset! https://www.google.co.uk/search?q=Phonegap+use+CSS+Reset&oq=Phonegap+use+CSS+Reset&aqs=chrome..69i57j69i60l3.3494j0j7&sourceid=chrome&es_sm=0&ie=UTF-8
You want facts ok stop using Phonegap/Cordova most of what it does is implements or utilizes HTML5! HTML5 is a work in progress so should not be used! http://www.w3.org/TR/html5/
ME: 5 Years of Mobile Development including developing parts of the Windows Phone 7 Phonegap. while being a developer for one of the Platform Preview applications. so i was building parts of phonegap for WP7 before most users new that WP7 was coming out.
Absolutely. If you're developing the app for multiple platforms then it sounds like a great idea. Though I have no doubt you'll still encounter differences across platforms.
I can't see how it would affect application speed/load times/memory usage.
While developing the app for cross platforms there are lots of issue regarding the css . It will be better to reset the css . But there are still issues regarding the performance .
This article might be helpful to you http://www.informit.com/articles/article.aspx?p=1915792&seqNum=6
Yes, you should!!
I've developed cross platform apps.
and each time I've used CSS reset.
I'm not sure about the exact context of a Phonegap app as I've never actually worked on one, but generally from a performance point of view any CSS reset shouldn't have an impact at all.
However, my opinion is that more often than not you shouldn't even bother with a full-fledged CSS reset targeting a bunch of specific elements and properties - you often end up overwriting them further down the stylesheet anyway.
A simple universal selector margin/padding reset is all I use today, which I supplement with my favourite box model tweak.
* {
margin:0;
padding:0;
box-sizing:border-box;
}
Maybe 10 years ago someone would tell you that the universal selector is slow, and it could've been true then, but using it on its own has been proven to be absolutely harmless today.
The rendering/layout engines of pretty much every recent browser are so quick anyway, not to mention the fact that even low end mobile devices nowadays are equipped with multi-core CPUs.
I wouldn't even call it micro optimisation, that's how negligent the impact is.
Now if you were to use div.header * - that's much more expensive, but probably still not something to lose sleep over if you don't have a few thousand elements on the page.
Have a read and test it for yourself.

How to detect mobile web browser and its screen size

I have a mobile website. I need to detect mobile web browsers by screen size or resolution and display the website accordingly.
Can anyone help with detecting web browser and screen size?
Also, how can I open my website according to the screen size?
I suspect that you don't mean a WAP browser but rather a mobile browser. (As you've tagged your question with iPhone & Android.)
You need to use a device capability database to do this on the server side.
There are lots of options (see other answers and link below), but as you're using ASP.NET, I'd recommend looking at http://51degrees.codeplex.com/. This uses WURFL data and is the defacto replacement for MDBF (which used to be the best asp.net solution).
More information on using the 51degrees solution can also be found in blog post by Scott Hanselman and Steve Sanderson.
There are lots of other similar questions about this here on SO: https://stackoverflow.com/search?q=detect+mobile+browser+capabilities
For the detection part, I recommend to use WURFL. There is also a similar question/answer on SO.
For the resize part, I recently did something similar for a web application of us. I tried to keep it really simple and make the elements floating/dynamic resizing.
To test it, there are several emulators available, I used those for BlackBerry, Android, and Windows 7 Phone.
You can use DeviceAtlas for this: http://deviceatlas.com/
I use Mobile Device Detection and Redirection from 51 degrees.
Here are the properties that you can use:
Request.Browser.IsMobileDevice
Request.Browser.ScreenPixelsHeight
Request.Browser.ScreenPixelsWidth

How well are the CSS2 'system colors' supported?

I've been reading the CSS2 spec in my spare time, and I've come across this. The note states that the system colours are deprecated, however, what is the browser support for the system colours part of the spec like?
This feature is deprecated. (it says so at the top of the link you provided)
It is not well supported, and is likely to get less so over time.
The intention of this feature was to provide the browser with access to the colour scheme of the underlying desktop operating system. However it has been dropped for several reasons. Desktop operating systems don't all have the same features, and furthermore the features they do have are open to change.
Finally, the main reason it was dropped is because the underlying reason for having them was to allow site designers to make their sites look like they belong to the parent OS. However there are other, better ways to achieve this now (notwithstanding the fact that most web site designers seem to prefer to have a consistent look and feel to their site that isn't dictated by the user).
See http://www.w3.org/TR/2003/CR-css3-color-20030514/#css-system for up-to-date info on this. At the bottom of this section is the following note:
The CSS2 System Color values have been deprecated in favor of the CSS3 UI 'appearance' property for specifying the complete look of user interface related elements.
That should help tell you where to look for an up-to-date method of achieving a similar result.
The set of colours specified by the W3C in this page is roughly equivalent to the colour scheme values available in Windows 2000. This is obviously of limited use to someone running Windows XP, and no use at all to a Vista or Win7 user, let alone a Mac or Linux user.
i dont know what the support in different browsers for these values looks like, but you can test it for yourself by designing a small page using these, uploading it and testing it with
Browsershot

Is it possible to have Client-side Validation WITHOUT Javascript

simple question really (can hazard a guess but just need to make sure),
Just need a Yes/No answer as can't seem to claify anywhere.
Reason? Web pages for phones, where javascript support is "sketchy" among all mobile browsers, so doing away with anything javascript altogether and was wondering if there are any alternatives.
(Also before someone tells me off, I am of course implementing server-side validation by default, better if possible to validate stuff right away on the client as phone text entry isn't particulaly fun to go through multiple times. Also webpage is asp.net 2.0 & c# should that affect anything)
No, there is not.
I mean, obviously, the more involved answer is "Yes, of course, there are other types of client-side scripting systems (Flash/Silverlight/ActiveX/etc) that can do it", but in the context of your question (phones) then the answer is No.
I do suggest, however, that you may be surprised at what phones run JavaScript. Keep it basic, and keep it such that it fails gracefully (i.e. no harm comes to the functionality of the app with JS disabled) and you'll probably be surprised at the compatibility.
HTML itself allows for a very little bit of validation (the maxlength of the input forms, which is not much, as a validation).
Which means you need "more", to do real/useful validation on the client side...
, if you want something that works in almost every browser, that's accessible, that doesn't annoy the user, ...
As a sidenote : don't ever forget server-side validation !
(Yes, you said it in your question -- but it's never said too many times ^^ )
Yes — but only in an even more limited range of browsers than those which support (and have enabled) JS.
e.g. You could use client side VBScript.
No , there is nothing except for javascript for client side for client side validation for the time being.
But it seems that HTML5 has some interesting tags thet will help. http://dev.w3.org/html5/spec/forms.html
It is possible to validate HTML forms without JavaScript now. Have a look at How to validate HTML5 forms without JavaScript
Not really. HTML itself only allows to limit the maximum length of a text box, which is some sort of "validation" (by restriction).
But then again - very many mobile browsers DO run JavaScript, even "Opera Mini" does support basic (or not that basic?) things of JS. Mobile Opera has full JS support, IE - too.
There is a nice list of who-can-do-it on QuirksMode.org (here: http://www.quirksmode.org/m/table.html)
One thing I'd suggest looking at is the Mobile Device Browser File - you state that you're using ASP.NET 2.0, so provided that your server's up to date (i.e. it has .NET Framework 2.0 SP2 installed), you should be able to use it.
This will help your site determine which browser is viewing your site, what it supports in terms of controls, etc, and help you respond appropriately to the requests.
I.e. if you know in advance that the browser doesn't support JavaScript, you can remove the client side validation altogether and not send all the extra markup to the browser, making their experience of the site even cleaner.
Basically, no.
If your market includes browsers that support the new HTML5 input types, there's some very basic things you can do there: http://diveintohtml5.ep.io/forms.html
Beyond that though, Javascript is really the only real client-side option.
(It could also be done in VBScript, but only in Internet Explorer)

How to redirect URL to mobile version?

I want to redirect some URL to mobile version, if the user agent is a mobile.
Example :
klikkarir.com/jawa-pos/5215/lowongan-call-center-accounting-administration-pt-asia-teleservices-januari-2010.html
will redirect to :
m.klikkarir.com/5215/lowongan-call-center-accounting-administration-pt-asia-teleservices-januari-2010/
somebody help me.
I use http://detectmobilebrowser.com, and found it is the quickest and easiest way. It works quite well. This site generates server scripts automatically (php, perl, python, coldfusion, apache, jquery, etc.) that detects mobile browser and redirects accordingly. You can just copy and paste the code somewhere in your Index file.
The best method is to use WURFL to detect if a mobile device is hitting your page, several (php,java,c++) interfaces exist.
If you want to have simpeler but less accurate solution a quick useragent comparison might be sufficient, example.
You could try the Mobify Me service, there is a free version too.
Off topic, Start accepting answers
I believe there are three ways to go about this first detecting the screen size by number of pixels. I have tried this method and It works within parameters (HD and high resolution screens on mobile devices vs older low resolution desktop screens) another approach suggestion several places (http://www.inmotionhosting.com/support/website/how-to/mobile-redirect) is to use the .htaccess file. The idea here is to screen browsers on their acceptance of mobile MIME types - as I suspect there is no great push for full screen devices to take mobile MIME types this seems fairly reliable with the caveat that on tablet devices you may get the mobile version when they are capable of handling the main version. The third of course is to use the script solutions noted above.
Luck
DPR

Resources