ASP MVC

Responsive Web Site Design Anyone?

Posted on by sachabarber in ASP MVC

At work I do a mixture of ASP MVC /  WCF and WPF. We have pretty much embraced MVxx frameworks for JavaScript such as Knockout.js and Angular.js, but we recently had to do some truly responsive design web work, which needed to target loads of different form factors. We have good software guys where I work for sure, but none of us is exceptional with CSS, as we prefer to code I guess. So we set about hiring some very UI/Ux people. The first thing that the new UI/Ux guys did was introduce the use of Bootstrap which is a html framework made by some of the guys that work for Twitter.

For those that have not heard of a responsive framework, it is typically one for working with HTML, that has lots of helpers, CSS, JavaScript and well tried and tested patterns for developing web sites that behave in a well known manner on different form factors. These responsive frameworks typically have these sorts of things

  • A responsive grid
  • Navigation menus
  • Popups / Dialogs
  • Standard set of CSS controls / styles

They may have more or less, but these are the basic building blocks of these frameworks.

I had obviously heard of Bootstrap and other big responsive framework Foundation.js. However the new guys went down the Bootstrap route. Now not having played with Bootstrap so much, I decided to have a play around with it, and came up with some code I decided to share.

For those that are interested in this sort of thing you can find the full article here:

 

http://www.codeproject.com/Articles/691182/Responsive-Web-Design-Using-Twitter-Bootstrap

2 thoughts on “Responsive Web Site Design Anyone?”

  1. Hi Sacha,

    Bootstrap is very good as it solves many issues that can be a PITA. I do some web work but to be honest, really hated it as there were too many variants when it comes to css, browsers, html and js etc. However, bootstrap came along and is really helpful and saves my time massively. Really recommend it to anyone.

    On that note, could I recommend the following:

    Font Awesome: http://fontawesome.io/
    Excellent little site for well, fonts and icons for bootstrap. Really easy to implement and adds a bit of flavor to your site.

    Templates for Bootstrap: https://wrapbootstrap.com/
    Now, sometimes frond upon but my life, for the sake of a couple of quid, you can get an excellent theme for say an internal LOB admin / dashboard etc that people will be blown away by, but more importantly save you loads of development time. I am not a designer, never worked with one (the wpf, Silverlight and ohh, a design team using blend etc) as this never came to pass 🙂 so these themes really help…

    Anyway, have a great Christmas and happy new year. Really great work in 2013 and hope to see more in 2014!

    All the best.
    Dan

    Reply

Leave a comment