Hi guys.
I have a few fixed websites and I wanted to get them over to a responsive web layout, is this something easy to do? I heard that you have to do the coding again, but because responsive web design is mostly through CSS3, I thought that maybe I could keep my site and update the stylesheet to do this.
I would be very interested to know what people thought and if anybody is likely to do the same.
If you mean by coding again that you’re thinking about changing the markup to help with responsive, that’s not the case. You can keep the website/markup (probably 98% of it) and update the CSS/stylesheet to make it responsive.
<hr>
Easy or not, that depends. If you manage to spend a little time first by documenting, planning and preparing, you may be off to a slow start, but you’ll cover more distance later in the game.
If you jump the gun and just float/unfloat, hide/unhide you may be stuck in an infinite loop for a while.
<hr>
I started with the same first instinct we all have beginning the transition to responsive, build the “classic elastic desktop”, and then media query my way up and down the display widths.
What works for me now: mobile first.
Taking a relatively complex fixed layout to a well-done responsive layout is a process I bet readers would be interested in following. Ever written any design articles?
Ye sure, but not relating to fixed - responsive layouts. I am more interested in converting some of my own designs / templates as people are asking for responsive layouts. I do at times write articles too, but I’ve not done so for a while.
I’ve read this so many other places, check this out, http://stuffandnonsense.co.uk/projects/320andup/. I found it a couple of days ago, referred by a friend.
It’s quite possible that you could just add some extra styles for smaller devices, but it depends on the site. For example, if you had wrapper with a fixed width that contained two floated columns, with @media queries you could target small screens and simple change the width of the wrapper and unfloat the columns.
As I say, though, it may or may not be that simple, depending on the site.
Maybe I am that friend? 
http://www.sitepoint.com/forums/showthread.php?844712-Responsive-Web-Design-Techniques&p=5097468&viewfull=1#post5097468
Also, you have to make the distinction between responsive and fixed/elastic/fluid. Responsive has to do with MQs, fixed has to do with clear boundaries.
Responsive is about making hardcore dynamic changes in your layout (with the help of media queries): dynamically, on-the-fly, making floats/inline-blocks or canceling floats/inline-blocks, being the most intuitive example.
Fixed/elastic/fluid means fixed/min-max dimensions, “fixed” floated/inline-blocks, responsive images.
One can have a responsive fixed layout too.
That is, you can have several fixed variants controlled by MQs. A good idea or not, fixed it’s a flame war, mainly, but, mostly, a personal option. You have to assume your option, and you have to have very very good reasons for making the fixed choice.
Responsive design really is nothing more than taking the idea of a elastic, liquid or hybrid layout to the next level of accommodating a smaller screen size. It seems like it would be feasible to add media queries to existing style sheets. Though it really all depends on the complexity of the layout and site. Without knowing those details all anyone can do is speculate.
Or for a bigger screen size. Hint: typography.
I.e.: body {font-size: 0.85em}, then body {font-size: 1em}, then body {font-size: 1.25em}.
Uhm, no… Fixed has to do with herpa-freaking-derp.
Of course if you consider simply switching out columns and dropping elements you shouldn’t be sending to mobile to be ‘hardcore’, it’s unlikely one has grasped the POINT of HTML… responsive + fixed? Just as malfing stupid, ignorant and sleazy as fixed in the first place.
Like the herpa-freaking-derp of that 320up garbage – admittedly my total distaste for the idiotic HTML 5 BS that results in half-assed trash like:
<header role="banner" class="clearfix">
<a href="http://stuffandnonsense.co.uk/projects/320andup/">
<hgroup>
<h1>320 and Up</h1>
<h2>The ‘tiny screen first’ responsive boilerplate</h2>
</hgroup>
</a>
Could have something to do with it. That’s one serious Mahamana right there. Everything wrong with HTML 5 and PRESENTATIONAL markup, look no further than this whole ‘boilerplate’ bull.
Which is why on my three primary systems – netbook, 17" lappy, and 4x display workstation – the SITE for 320 and up is useless rubbish. Doesn’t really make the system itself seem all that encouraging.
Though it’s entirely the type of broken idiotic trash I’ve come to expect from the “Less” crowd.
Agreed. Just making a point about what responsive is, which is not the opposite of fixed, but the opposite of rigid. The same as elastic or fluid. They posses a certain rigidity. Responsive adds improved dynamics to a layout, be it fixed, elastic, fluid.