Have a look at the Twitter Bootstrap framework :-) Or just about any other responsive grid framework, i.e. responsivegridsystem.com. I'm by no means a dedicated frontend developer, but I find it easiest to grab a responsive grid framework and work my way from there, fine-tuning it with media queries.
I don't think there's any starter kit that's responsive as it is now, though.
Have developed sites in all recent versions of Umbraco using this system for desktop and then combining it with jQueryMobile and 51 degreeMobi (detection) for mobile. (Although V6 does support MVC mobile detection straight out of the box!!!)
Would be happy to share any information with you to help get you started, just ask what you need and will see what I can do for you.
I first created static pages with Skeleton Grid, and then it was just a mather of copying the the resulting stylesheets to the css folder and implementing the layout in Umbraco templates.
Have uploaded a site to www.algarveartcollection.com (it was a spare domain name - can't say more than that!). It is Umbraco 6 with sqlCE4.
It is very "raw", has no packages installed, no shiv etc, but demonstrates the mobile detection out of the box and how you can pull 5 child pages into a page with responsive design. The mobile version has an aqua background, so you will know when you have it. (Easiest way is with Safari, tools, develop, user agent, ipad).
As I cannot take credit for the css, have reproduced original including all the links, but will only leave "live" for a short time. Have not included any packages, but can confirm it works equally well with DAMP etc. . . (would not do this without permission first)
As previously mentioned, it's a bit rough around the edges, but should help.
If you are interested to know more, leave a message here and I will get a login for you to view templates etc.
Hi Gary I tried to open your demo on my IPhone, but it didn't work as expected. I was hoping for something more like http://bs.jlusar.es/ With special menu on Iphone. (ubootstrap) Ubootstrap is multilingual, and i cant figure out to revert it to 1 language (danish) Are you missing something in you demo site, since it dosent detect my iphone safari browser. Regards Claus
Apologies, just finished what I was doing and checked on my Android phone, and no buttons.
Dont know what is happening but strange error with not recognizing @Html.Partial, but it is working now despite the error, well on my phone and safari browser with either iphone or Ipad selected.
You will need to view on desktop too to see the effect of the responsive aspect, but should be ok now.
Not to criticize anyone in this thread, but anytime these " half designed " sites are released, the end user just bypasses it because it is missing so many features or content
Its been a long time that this discussion had happened, would you like to tell me how you made it responsive finally with language translation facility?
Umbraco 6 - Responsive Web design
I would like to build a small site I Umbraco 6 with Responsive Web design.
I there any source code out there to get me started, like a Responsive Starter Kit.
Already tried Ubootstrap, but didn’t succeed in converting it to a single language (Danish) version, and it is not developed for version 6
Anny help is highly appreciated.
Hi Claus,
Have a look at the Twitter Bootstrap framework :-) Or just about any other responsive grid framework, i.e. responsivegridsystem.com. I'm by no means a dedicated frontend developer, but I find it easiest to grab a responsive grid framework and work my way from there, fine-tuning it with media queries.
I don't think there's any starter kit that's responsive as it is now, though.
- Bo
Hi Claus
My preferred method can be found here: http://builtbyboon.com/posed/Proportional-Grids/
Have developed sites in all recent versions of Umbraco using this system for desktop and then combining it with jQueryMobile and 51 degreeMobi (detection) for mobile. (Although V6 does support MVC mobile detection straight out of the box!!!)
Would be happy to share any information with you to help get you started, just ask what you need and will see what I can do for you.
Best regards
Gary
Hi
Thanks for your answers...
Gary, would you be interested in sharing one of your recent sites, to be a god start and learning ground for me?
Best regards
Claus
Denmark
Hi Claus,
I'm currently implementing a responsive layout in an umbraco website. I created the responsive layout with:
Skeleton Grid
A very lightweight grid framework.
I first created static pages with Skeleton Grid, and then it was just a mather of copying the the resulting stylesheets to the css folder and implementing the layout in Umbraco templates.
Hope this helps,
Anthony
Hi Claus
Can you wait one day? If so will put together a quick starter for you, this would probably be better than 20 something view files etc.
Have to finish something today, but maybe this evening or tomorrow will make something, let me know if this is ok with you.
Regards
Gary
Hi Gary
It sounds great, I really appreciate your effort.
Are you using ver. 6 and SQL CE 4 for your sites?
Looking forward to be hearing from you. :-)
ThanksAgain!
Regards
Claus
Hi Claus
Have uploaded a site to www.algarveartcollection.com (it was a spare domain name - can't say more than that!). It is Umbraco 6 with sqlCE4.
It is very "raw", has no packages installed, no shiv etc, but demonstrates the mobile detection out of the box and how you can pull 5 child pages into a page with responsive design. The mobile version has an aqua background, so you will know when you have it. (Easiest way is with Safari, tools, develop, user agent, ipad).
As I cannot take credit for the css, have reproduced original including all the links, but will only leave "live" for a short time. Have not included any packages, but can confirm it works equally well with DAMP etc. . . (would not do this without permission first)
As previously mentioned, it's a bit rough around the edges, but should help.
If you are interested to know more, leave a message here and I will get a login for you to view templates etc.
Best regards
Gary
Hi Gary
I tried to open your demo on my IPhone, but it didn't work as expected.
I was hoping for something more like http://bs.jlusar.es/ With special menu on Iphone. (ubootstrap)
Ubootstrap is multilingual, and i cant figure out to revert it to 1 language (danish)
Are you missing something in you demo site, since it dosent detect my iphone safari browser.
Regards Claus
Hi Claus
Apologies, I thought it was just the responsive design you were looking for, to add the touch buttons you need to include jQueryMobile.
Will do it now, shouldn't take too long.
Regards G
OK, have added jQueryMobile and now it has touch buttons, they are at the top, but sure you can use your imagination.
I will repeat, it is rough, but is only for demonstration.
18 minutes, that included updating all permissions on the site as I hadn't before - nice and quick?
Regards
Gary
Hi Claus
Apologies, just finished what I was doing and checked on my Android phone, and no buttons.
Dont know what is happening but strange error with not recognizing @Html.Partial, but it is working now despite the error, well on my phone and safari browser with either iphone or Ipad selected.
You will need to view on desktop too to see the effect of the responsive aspect, but should be ok now.
Regards
Gary
Not to criticize anyone in this thread, but anytime these " half designed " sites are released, the end user just bypasses it because it is missing so many features or content
Responsive Web Design has a long way togo.
Hey Claus Elmann,
You can use in build platform that provides responsive designs. I have consulted professionals for responsive design and advice you for the same.
Its been a long time that this discussion had happened, would you like to tell me how you made it responsive finally with language translation facility?
is working on a reply...