The company I'm working for has built and maintains over 80 websites. These sites were originally designed to only work on desktops/laptops (aka full-sites). To date they've converted over two to be mobile aware. The way they've accomplished this is by
checking for the device/browser in the full-site Master Page and then dynamically switching over to a Mobile Master Page when appropriate. It seems to work quite well, though it's somewhat time consuming to make the conversion.
With brand new clients, for whom nothing is yet built, I would like to get Best Practice recommendations for building websites that work well as both full-sites and as mobile-sites. If you could provide a URL to such ASP.NET sites that work effectively, I'd
much appreciate that too.
Note: In their research with the first conversion, they did extensive testing of Responsive Design but found it too slow to be practical in a commercial environment.
The way they've accomplished this is by checking for the device/browser in the full-site Master Page and then dynamically switching over to a Mobile Master Page when appropriate.
That's not a very smart solution. It's just a waste of time and bandwidth to load the desktop master page first and then check and then again switching over to the mobile master page. It may be easy to convert the existing websites that way since responsive
design is not easy to do on a website which wasn't designed with the mind to make it responsive. But dynamically loading the mobile master page would be the last thing I would do if I need to make a website mobile friendly. But if you are familiar with the
media queries, it's not that hard to make an existing site responsive.
Another option is to create a separate site which is hosted on a subdomain (like m.test.com) so there is a redirection module which will redirect the user to the mobile site if the user is browsing the site from a mobile device.
pelalusa
Note: In their research with the first conversion, they did extensive testing of Responsive Design but found it too slow to be practical in a commercial environment.
That's not true. Responsive design is of course very practical in commercial environments if you use it correctly. You can use a responsive framework such as
Bootstrap,
Foundation or jQuery mobile.
pelalusa
With brand new clients, for whom nothing is yet built, I would like to get Best Practice recommendations for building websites that work well as both full-sites and as mobile-sites.
For a brand new website, the recommended best practice is definitely the responsive design. If you don't like to use a framework, at least use media queries and make it responsive by your own. That way, your code will have a good maintainability since there
won't be any repetitive stuff over mobile and desktop pages since both versions will be in the same page.
Just google/Bing about responsive design and you will find many advantages of using responsive design.
When I first read your response, and saw how adamant you were that everyone should be using Responsive Design, I thought you were speaking from a very definitive, knowledgeable position. But this morning I spoke with our Senior UX fellow about your comments.
He had several interesting things to say. Here's a quick synopsis:
He is adamant that Responsive Web Design is not the nirvana that some claim it to be. He cited an interesting statistic: Of the Top 500 online retailers, only 34 use responsive design. The Top 2 mobile online sites are Sears.com and Amazon.com respectively.
Neither use Responsive Design.
I appreciate that you're coming at the issue from a theoretical "elegant" computer science perspective but it seems clear that you're not too concerned with the end user experience. Sears is. So is Amazon. The fact that they don't use Responsive Design
is quite telling.
When I first read your response, and saw how adamant you were that everyone should be using Responsive Design, I thought you were speaking from a very definitive, knowledgeable position
I didn't want to prove how knowledgeable I'm or anything. I just shared my opinion from the knowledge I have and thought it would help you in anyway. I don't want to start an argument about that with you guys. And where did I say EVERYONE should be using
responsive designs? I, myself has created websites which are responsive and separate websites for mobile devices. I never said responsive design is the silver bullet for everything. As I said, there are other options like developing a separate website. Probably
for a very popular site, that's the best thing to do. Facebook, Google all of them have separate mobile websites. But definitely changing the master page dynamically after you load the desktop master page is not the best solution. May be the easiest, but not
the best.
But for a simple website where the information on the desktop website is pretty much same as on the mobile site, I think you can go with the responsive design rather than creating a separate mobile site. From my understanding, people go for a separate mobile
site if the site is bit complex and cannot be handle all the views within a one website.
Please note that I'm talking from MY experience and MY knowledge. I'm never saying that's the only correct thing in this world. I have an open mind to accept other people's perspectives. So you can wait and see for the other people's comments too.
pelalusa
I appreciate that you're coming at the issue from a theoretical "elegant" computer science perspective but it seems clear that you're not too concerned with the end user experience.
I don't understand why you think I'm not too concerned with the end user experience. Nothing I've said proves that.
Not sure if it matters, but the "SetMasterPage" method is called within the Page_PreInit event handler. It's just that the method and its helper methods are also stored there. However your comments prompted a rethink here - which I thank you for - and a quick
test revealed that we can move everything up to the Global.cs file. So the determination of what device/browser is being used will be done before any pages are loaded.
Thank you again for your help with all of this. I really do appreciate it!
Robert
and a quick test revealed that we can move everything up to the Global.cs file. So the determination of what device/browser is being used will be done before any pages are loaded.
Hi Robert,
That sounds good. I believe you are doing it in the Application_BeginRequest method of the Global.asax file.
Actually this lead me to another suggestion. How about using something like
51 degrees to detect the device and load the content dynamically?
Member
10 Points
145 Posts
Recommended Approaches to Building a Mobile Aware Website?
Dec 04, 2014 03:49 PM|pelalusa|LINK
The company I'm working for has built and maintains over 80 websites. These sites were originally designed to only work on desktops/laptops (aka full-sites). To date they've converted over two to be mobile aware. The way they've accomplished this is by checking for the device/browser in the full-site Master Page and then dynamically switching over to a Mobile Master Page when appropriate. It seems to work quite well, though it's somewhat time consuming to make the conversion.
With brand new clients, for whom nothing is yet built, I would like to get Best Practice recommendations for building websites that work well as both full-sites and as mobile-sites. If you could provide a URL to such ASP.NET sites that work effectively, I'd much appreciate that too.
Note: In their research with the first conversion, they did extensive testing of Responsive Design but found it too slow to be practical in a commercial environment.
Thank you,
Robert W.
All-Star
52711 Points
9668 Posts
MVP
Re: Recommended Approaches to Building a Mobile Aware Website?
Dec 11, 2014 08:17 PM|Ruchira|LINK
That's not a very smart solution. It's just a waste of time and bandwidth to load the desktop master page first and then check and then again switching over to the mobile master page. It may be easy to convert the existing websites that way since responsive design is not easy to do on a website which wasn't designed with the mind to make it responsive. But dynamically loading the mobile master page would be the last thing I would do if I need to make a website mobile friendly. But if you are familiar with the media queries, it's not that hard to make an existing site responsive.
Another option is to create a separate site which is hosted on a subdomain (like m.test.com) so there is a redirection module which will redirect the user to the mobile site if the user is browsing the site from a mobile device.
That's not true. Responsive design is of course very practical in commercial environments if you use it correctly. You can use a responsive framework such as Bootstrap, Foundation or jQuery mobile.
For a brand new website, the recommended best practice is definitely the responsive design. If you don't like to use a framework, at least use media queries and make it responsive by your own. That way, your code will have a good maintainability since there won't be any repetitive stuff over mobile and desktop pages since both versions will be in the same page.
Just google/Bing about responsive design and you will find many advantages of using responsive design.
Please 'Mark as Answer' if this post helps you
Developer Tools Download | Windows 10 Videos | My Tech BlogMember
10 Points
145 Posts
Re: Recommended Approaches to Building a Mobile Aware Website?
Dec 12, 2014 12:42 PM|pelalusa|LINK
Dear Ruchira,
When I first read your response, and saw how adamant you were that everyone should be using Responsive Design, I thought you were speaking from a very definitive, knowledgeable position. But this morning I spoke with our Senior UX fellow about your comments. He had several interesting things to say. Here's a quick synopsis:
He is adamant that Responsive Web Design is not the nirvana that some claim it to be. He cited an interesting statistic: Of the Top 500 online retailers, only 34 use responsive design. The Top 2 mobile online sites are Sears.com and Amazon.com respectively. Neither use Responsive Design.
I also found this article: http://marketingland.com/why-matt-cutts-is-wrong-about-responsive-web-design-64715
I appreciate that you're coming at the issue from a theoretical "elegant" computer science perspective but it seems clear that you're not too concerned with the end user experience. Sears is. So is Amazon. The fact that they don't use Responsive Design is quite telling.
Robert
All-Star
52711 Points
9668 Posts
MVP
Re: Recommended Approaches to Building a Mobile Aware Website?
Dec 12, 2014 03:11 PM|Ruchira|LINK
Hi,
I didn't want to prove how knowledgeable I'm or anything. I just shared my opinion from the knowledge I have and thought it would help you in anyway. I don't want to start an argument about that with you guys. And where did I say EVERYONE should be using responsive designs? I, myself has created websites which are responsive and separate websites for mobile devices. I never said responsive design is the silver bullet for everything. As I said, there are other options like developing a separate website. Probably for a very popular site, that's the best thing to do. Facebook, Google all of them have separate mobile websites. But definitely changing the master page dynamically after you load the desktop master page is not the best solution. May be the easiest, but not the best.
But for a simple website where the information on the desktop website is pretty much same as on the mobile site, I think you can go with the responsive design rather than creating a separate mobile site. From my understanding, people go for a separate mobile site if the site is bit complex and cannot be handle all the views within a one website.
Please note that I'm talking from MY experience and MY knowledge. I'm never saying that's the only correct thing in this world. I have an open mind to accept other people's perspectives. So you can wait and see for the other people's comments too.
I don't understand why you think I'm not too concerned with the end user experience. Nothing I've said proves that.
Thanks and good luck.
Please 'Mark as Answer' if this post helps you
Developer Tools Download | Windows 10 Videos | My Tech BlogMember
10 Points
145 Posts
Re: Recommended Approaches to Building a Mobile Aware Website?
Dec 12, 2014 04:55 PM|pelalusa|LINK
Ruchira,
Not sure if it matters, but the "SetMasterPage" method is called within the Page_PreInit event handler. It's just that the method and its helper methods are also stored there. However your comments prompted a rethink here - which I thank you for - and a quick test revealed that we can move everything up to the Global.cs file. So the determination of what device/browser is being used will be done before any pages are loaded.
Thank you again for your help with all of this. I really do appreciate it!
Robert
All-Star
52711 Points
9668 Posts
MVP
Re: Recommended Approaches to Building a Mobile Aware Website?
Dec 13, 2014 10:43 PM|Ruchira|LINK
Hi Robert,
That sounds good. I believe you are doing it in the Application_BeginRequest method of the Global.asax file.
Actually this lead me to another suggestion. How about using something like 51 degrees to detect the device and load the content dynamically?
http://msdn.microsoft.com/en-us/magazine/hh288079.aspx
That's just a suggestion. According to your project requirements and the time frames you have, you guys can decide which way is convenient for you.
Please 'Mark as Answer' if this post helps you
Developer Tools Download | Windows 10 Videos | My Tech Blog