I am currently working on an ASP.NET MVC webshop that must be optimized for mobile devices, especially tablets and smartphones. This is for our client at work, but I am doing a little research on ASP.NET MVC Device Detection at home. I created a little application with it and it seems to work just fine. I love the way that everything is separated nicely by using different views for every device type.
The thing I am struggling with now, is wheter to use the ASP.NET MVC Device Detection for that webshop too, or use a client-side responsive framework, like Bootstrap. I am struggling with that decision, because the ASP.NET MVC Device Detection doesn't seem really "grown-up" to me. There is not much to find about it on the internet and it only supports mobile views by default, no tablet views or anything else.
The other reason why I'm hesitating about Device Detection is because the standard ASP.NET MVC library with mobile device user agent strings is probably not going to be updated, so when new devices come out (and they do), the webshop is showing the desktop view, while we have a nice optimized view for mobile devices. Of course there are services for up-to-date device detection, like 51Degrees.mobile, but they are very expensive. (the free version has no support for detecting tablets)
I've found a way to create different views for tablets by using the example in this post, but that example uses a regex to detect smartphones and tablets, which is of course going to be outdated at some time as well.
On the other hand we have the client-side responsive solution (Bootstrap). The disadvantage of a client side responsive site is that the diffent viewmodes are not seperated. The HTML is not optimized for the device. The website is just kind of "throwing in" the desktop version and the browser adjusts the HTML page using the CSS media queries. The code is not as clean as it is with the Device Detection solution.
The quick question: is there any free or less expensive way to use the ASP.NET MVC Device Detection? Is it going to fit our needs over time? Will it not be outdated at some point?
I would really appreciate to hear what you think is the best choice in this case. Thanks in advance.
The entire point of responsive design is that it is device-independent. Device detection in MVC, as far as I remember, began with some rather old IIS Browsercap technology that is quite out of date.
There are far too many form factors out there to keep up with now that Android phones range in size from four to 6.5 inches and beyond. Going with a responsive design framework such as Bootstrap will allow you to target resolutions, not devices. The majority of modern smartphones and mobile browsers (even IE!) will render a responsive design consistently.
You should be using device detection with responsive design. The fact that the browser is under X pixels wide does not mean the user is on a mobile device or that they prefer to see a mobile version of the site.
Using both detection methods allows you to give the user more options and more precisely offer the best experience.
ismobiledevice ships with .net and is available freely to your asp.net mvc app.
http://msdn.microsoft.com/en-us/library/system.web.configuration.httpcapabilitiesbase.ismobiledevice(v=vs.110).aspx
Designing a web application with ASP.NET MVC I asked myself how can I also please those people using a smart phone, ipad, etc.. (everything thats touchable...) and not only a desktop/notebook with a browser.
How can I develop a better user experience.
I would be pleased to hear about technical advises concerning the asp.net mvc framework so I can later implement your suggestions concretely.
There are a few levels of friendlyness. You can start with the basic "does this site render well enough to be usable in a mobile browser?" This really should not be a problem for anything new that is using modern web standards but older sites could have problems. Corallary to this is "is my site a bandwidth hog that takes forever to render over 3g because each page is 14mb of animated GIFs and spaghetti HTML?" Or "does my site make mobile devices melt due to aggresive scripts?" Luckily this set is pretty easy to deal with -- modern websites tend to handle this pretty well by default.
The second level is "does this site do anything maddening from a touch perspective." The big thing that can clip you here is hover based menus -- there is no hover on a touch UI. The other common issue is using small links or buttons that one can't hit at least without zooming in to crazy levels. The solution here is testing -- some issues are obvious to all but you won't see some things until you are interacting without a mouse.
The final level is using a touch UI for fun and profit. If you make it this far, you are doing better than many web publishers in this day and age. What is involved here is using touch-friendly UI tools, such as jquery mobile, to handle swipe events and other touch features to make things work more like one expects with a touch UI. An easy example would be making an image carousel swipe-able rather than having to wait for the buttons.
Make the interface chunky - big icons are easy to click, text is very difficult to touch accurately. Set a minimum size for every element, at the very least as big as the individual keys on an iPhone/android's virtual keyboard and preferably much larger.
Ensure that the most relevant options are near the top, and after that the aim is simply to make it intuitive. Fewer menus are generally better.
Go through my tutorial ASP.NET MVC 4 Mobile Features
create mobile-specific views.
-use the HTML5 viewport attribute and adaptive rendering to improve display on mobile devices.
Why HTML5 rocks now ?
If just use one word to answer, I think probably it will be "cross-platform".
You can build products using HTML5 one time , distribute for different platform such as Web and iPad etc.
But after some research, I found that several problems with HTML5 family tech
Not robust : there are a lot of randomness , and not easy to control
Storgage limited : even no clear answer for max size (?) , and sure there are limitation of storage
Not best user interaction : compared with native iOS app
Any other problems you think ?
And if you are HTML5 guru,maybe you will correct some wrong understanding of mine.
The biggest problem for me is that right now HTML5 is not a standard. It's not even a complete specification.
But this has always been the problem with building web applications; everyone implements them to different degrees of completeness, and you have to be constantly vigilant of implementation variations.
If I end up having to maintain multiple versions of the same code for each browser anyway, I start to question whether the "it works everywhere" argument is even sound anymore.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 8 years ago.
Improve this question
I wonder if I were to develop a mobile Web app (now, in two weeks, or in a month), which one should I go for? Which one would you mobile Web developers go for?
If jQM 1.0 were officially released today, I would most likely embrace it (as long as it actually delivers what it promises). Now that it is in alpha, I wonder whether it is worth to jump into it yet for a commercial grade project? Would Sencha Touch be a better alternative?
Sencha Touch is an application framework (you create your interface programmatically through Javascript) while jQuery Mobile is more of a mobile enhancement library (you write regular HTML for your content, then add jQuery mobile for transitions/animations). jQuery Mobile has an easier learning curve, but Sencha Touch can better simulate "native" apps.
The first question you need to ask yourself is what is the purpose of the application. If you want to release an application for sales on one of the retail outlets (iTunes, Andoid App store), or you need access to device specific functions that are not accessible via local APIs yet (accelerometer, camera, contacts, etc) then you should be thinking Native or one of the hybrid solutions (Appcelerator, PhoneGap, etc.).
If your audience is going to be more in the "mobile web" space, such as a mobile version of a corporate web desktop site, or intranet web application port, then you should be looking at Sencha Touch and jQuery Mobile. The decision between those two is really going to be based on you development experience and and what you feel more comfortable with. Sencha Touch is a VERY robust platform that has a Desktop (ExtJS) and mobile (Sencha Touch) that mirror each other so knowing one pretty much allows you to get up and running with the other. Also, Sencha has moved to an MVC model on the client which really helps to organize client side code and make it much more congruent with server-side development platforms.
The post above is actually incorrect, using the MVC pattern on the client combined with the historyUrl on your dispatch commands gives you the ability to use the browser back and forward buttons of the browser, so that is not exclusive to jQuery Mobile. Also, the Sencha Team's suite of products includes a Designer application that provides Designer which is a WYSIWYG editor that allows for the drag and drog creation of UIs. This company's roadmap has them in the process of updating the Designer app to allow for the drag and drop design of Touch mobile screens and application that will function with the MVC pattern. They are also getting ready to release a new version of the Sencha Command tool that will automatically generate entire MVC application structures for you in a matter of minutes, which you can then add the necessary custom code to round out your application. Lastly, the new SASS theming capabilities allow designers to use CSS3 and SASS config files along with variables and Mixins to generate cross-browser CSS style sheets for your application.
So, the decision of which way to go for the mobile web development question comes down to how comfortable you are with object oriented javascript. If you are very comfortable with it, then Sencha Touch is the way to go as it very extensible class system built into the core engine that can be customized to your hearts content...but if you have minimal experience with JS and you want the server to deliver your UI and don't mind seeing the Address bar drop down to move between pages (less web 2.0 looking), then jQueryMobile is the way to go.
It's pretty obvious that I am biased to Sencha Touch due to its well thought out class structure, extensibility, very active user community, web/mobile continuity, and constant improvement to the core framework and new tools that simplify development efforts. And not to mention that the Touch platform is more mature as jQM has not reached production mode yet.
I've been using jQuery mobile for a while now. It works well under Blackberry 6, iPhone, and Android.
I wrote an article about it here: jQuery mobile alpha
Though it's alpha, they are showing good progress. I've been looking into their development in github, seems like there's going to be cool stuff by early 2011.
UPDATE 2011-12-01 jQuery Mobile relased version 1.0, finally out of alpha. Read more about it here: http://jquerymobile.com/blog/2011/11/16/announcing-jquery-mobile-1-0/
If you're going to make a mobile version of a website, I am going to use jQuery Mobile. If you're going to make a “native” mobile application, I will be more likely use Sencha Touch.
http://tysonlloydcadenhead.com/blog/jquery-mobile-vs-sencha-touch
Sencha touch has lived longer than jquerymobile but I found that jquerymobile handles device back button much better than SenchaTouch.
I always consider back/history button handling is important in my apps, so I prefer jquerymobile.
I always consider myself a JavaScript programmer, but I like the fact that I rarely need to to type any JavaScript code when I use jquerymobile.
jquerymobile design is brilliant IMHO.
I am also in favor of sencha, JQM is really slow and failed to give an impression of an native app.
Praveen
why limit yourself...
Look into PhoneGap and Titanium Appcelerator
the make the comparison based on what you are trying to accomplish. I know Sencha Touch has a licensing fee and like you said jQM is not officially released yet.
This is a great time to be in the mobile space because there are so many viable options
I think jQuery mobile is easier to learn and seems to be very promising. Version 1.0 is not yet available, but its going to be a good product. I find it very attractive because it is based on jQuery - simplicity is the motto
Don't forget that there is also Dojo Toolkit Mobile. It looks nice, at least at first look and it is built on top of the proven and solid Dojo Toolkit core. http://dojotoolkit.org/features/mobile.
The Dojo Toolkit don't get too much audience recently but it looks like they made a lot of progress from the times it was a bit heavy, I think it is worth looking at it.
I've been trying out the sencha architect and to be honest ithas been a nightmare to get running.
My background is DotNet, html, javascript, VB, java and have been using eclipse etc for a while so am not a huge newbie with figuring out dependencys etc.
Here is what I have struck:
I went to the Sench site, downloaded Architect.
It then got me to download toolkit and sencha touch. I downlaoded exactly what was recommend / instructed by the help files / site.
I have Sencha Architect V2.1.0 Build 584., sencha-touch-2.0.1.1-commercial.zip, SenchaSDKTools-2.0.0-beta3-windows.exe
I also downloaded and installed a new java sdk / run time etc. The install has been done on a dead clean XP box (vmware). Web server is xampp.
Sencha does not recognise the SenchaSDKTools-2.0.0-beta3. You have to hack it using hard to find instructions. Even after hacking it the architect fails to use the proper SDK and gives error messages on deployment.
There have also been numerous errors to figure out along the way and issues where data just wont load even having followed instructions to the letter.
I have spent 11 hours getting to the point where the application will run properly without whinging but it wont deploy. It is bad enough learning a new tool / framework etc without the ide causing grief and the "instructional demos" leading you up the path.
There are lots of people getting the same errors all over.
After 15 hours of effort I am giving it up as a bad job and am returning to IBM XPages / PHP and Blueprint CSS with old fashioned, hand coded html5 / CSS3 and jquery / Ajax / JSon apps.
My reason for doing this: Application Architect keeps pushing you back to the command line. I love the command line, give me a bash shell and vi and I'm good to go. However for complex, multi file deplyoments such as mobile apps a good IDE is worth its weight in gold. Architect is not there yet. I keep needing to lift the hood and hack to get things working.
I originally looked at Sencha for a 12 year old who is interested in mobile apps and is looking for an ide to use. I tried it out - it is not suitable - even getting a hello world type app running is going to be too much for a newbie and the first app in the help files doesnt explain itself but has you copying code for pulling data from a web site you have to sign up for. (ccitybars app).
A big improvement for sencha will be when Architect works out of the box (possibly an installer with sdk, tools , touch and architect all in one) and the fisrt app -walk through is a simple hello world that then builds to entering data, saving data and then displaying data before going multi form.
I was faced with the same choice about half a year ago, then went for jQTouch instead of Sencha Touch, which I found to be extremely Javascript centered. I'm currently working on a port of that same project to jQuery Mobile and I think the transition will be much smoother than it would have been with a Sencha Touch project.
If you know basic PHP I strongly suggest jqmphp.com. Up and running in less than 3 days a whole online mobile based site to order food!
MoSync team has recently done an interesting comparison:
Which Mobile JavaScript framework is the best: jQuery Mobile, Sencha Touch, jQtouch, or Kendo UI?
http://www.codefessions.com/2012/04/mobile-javascript-frameworks-evaluation.html
http://www.codefessions.com/2012/04/which-mobile-javascript-framework-is.html
http://www.codefessions.com/2012/05/which-mobile-javascript-framework-is.html
jQueryMobile wins but huge boost in arm is because of licensing. I prefer jQueryMobile because I don't want someone(thing) else to write my markup, that way hacking becoming difficult (at least for me), however, I do have couple of HTML5 apps under my belt now, one each in jQM and Sencha Touch. Sencha Touch makes it smoother, very hard to learn though while jQM gets you started in a day, there are bug but you usually get around them because of amazing web community around this framework.
I've built a nice production app in a few days using Sencha Touch 2.0 and it's delivering as documented. And, it's FAST. There might be some bugs, but, when I've run into one (which, is rarely), there seemed to be many ways to approach a solution so that it's really not that relevant.
Sencha Touch looks great but it is difficult to use. The Sencha support forums offer minimal support. Sencha Touch 2.x is still in alpha is quite buggy
Sencha touch will be the best option is you are just starting because it is well documented and it has a community support. Also, with phonegap, you spend more time on the development and less on things about other mobile platforms. Phonegap will build the application for you , once you upload it to the builder .
Comparing the two is like comparing apples and grapes...though you want to develop mobile apps with both, the level of comfort with either depends entirely on you.
This chart might be helpful if you want to compare the features : http://www.markus-falk.com/mobile-frameworks-comparison-chart/
Sencha Touch based apps can only work on WebKit based browsers. JQueryMobile based apps can work on all mobile web browsers.
I think you can go ahead with JQueryMobile for next 2 to 3 years. I am expecting in 2-3 years all mobile browsers will be based on WebKit engine. Once all mobile browsers start supporting WebKit, move to the Sench Touch mainly because of very good quality user interface.
I suggest KendoUI
It is unbeatable and fast performance in a training of couple of days. Not to mention the fast update and new features and support for server side wrappers (asp.net, php, jsp). It is unique!
I have used both and they each have conditions where one is better suited then the other.
In my opinion you would use JQueryMobile when
1. You need a quick and light weight mobile implementation of an web application.
2. You have time constraints (definitely faster to learn and implement then Sencha Touch).
3. Native look and feel is not a requirement.
When making an extension to an existing web application where relatively simple functionalities have to be extended to extended to mobile (really fast and easy) I found JQM to be extremely useful and straight forward.
In my opinion you would use sencha when
1. You want a native look and feel
2. You want a higher degree of functionality on the mobile side (possible access to native api's through phone gap)
3. Targeting the latest smartphones (performance is impressive)
I need to create a photo gallery for a website running IIS 4.0 or IIS 5.0 (im not sure which). It needs to display a low resolution version of the gallery to anyone, and it must show both the low and high resolution images for "priviledged" users. So I need access priviledges, photo albums and once the site is complete, the person I am doing this for needs to be able to upload their own images to the gallery. It also needs to have a minimal interface as it needs to be integrated into an existing website.
So I need some advice on this with the direction I should approach it.
Does anyone know if their is a customisable gallery out there that can do something like this, such as Coppermine or Jgallery or something. The alternative is to use a web framework like Ruby on Rails, CodeIgniter or Sproutcore (each which require learning a new language). The framework would be more work, but the existing galleries may not be customisable enough. The important bit is the user privileges in an admin panel.
I am relatively new to "web programming", although not new to normal/games programming. I have a few years experience with C/C++ OpenGL and Java. I have also read up on MVC etc, and did hello world with sproutcore, so I kinda get the idea. Although learning a framework is a much heavier investment.
What are your thoughts?
If you don't want to re-invent the wheel you could use Gallery2 (requirements here). It runs on IIS -- you'd just need PHP and a database. It's very configurable (including user accounts), has lots of plugins, and its open source if that's not enough. Also, the development and support communities are large and active.
you could always go the route of Dotnetnuke and then use Ventrian's Simple Gallery module (http://www.ventrian.com/Products/Modules/SimpleGallery/Demo.aspx)
Using DNN offers a ton of functionality, including the security you need, and it would save you from doing any web development.
If you are a bit more adventurous, try Smaltalk based Aida/Web and specially Aida/Scribo CMS (currently still in beta), which include Gallery so called scriblet as well. Scribo scriblets are otherwise web components which you can include directly into a text. You therefore add a gallery directly into a surronding text. See for instance a presentation as a Gallery for example.
I would recommend my own but... If it weren't for the low/high resolution thing with permissions I think it would fit the rest of your needs. I'm going to leave a link just in case you want to take a look at it:
nzFotolog
It's also open-source (although the license is not the best) and you can change it at will if you want. The code itself is clean and self-explanatory. The downside is that I haven't developed it for some time now :(
Having faced a similar dilemma myself I have to say that I found Gallery2 and Coppermine both far too all-encompassing and difficult to customise to the degree I would have wished. I ended up rolling my own using straight, procedural PHP with various bits of jQuery for the GUI fancy bits. At the same time I was able to bake in some e-commerce and data gathering for my wedding photography clients, ending up with something which exactly matched my needs. Certainly, the gallery aspects of this project were, for a complete programming (although not HTML) neophyte, the least challenging - it's exactly the sort of thing PHP is made for.
I'm now taking my first faltering steps with CodeIgniter for my next project (photoblogging software) and I can already see that the framework would make a gallery project very quick, simple and secure.
Flickr.com and their API may be suitable from what you described.
http://www.flickr.com/services/api/