5

Is there any tutorials how to make responsive layout similar to this one? I'm searching on whole internet, but can't find any normal tutorials, since all others resize the window, and you are able to zoomout/zoomin via iphone.

RevanthKrishnaKumar V.
  • 1,855
  • 1
  • 21
  • 34
Vdas Dorls
  • 485
  • 2
  • 8
  • 19
  • There is something here too: http://stackoverflow.com/questions/6844020/way-to-do-content-adaptation-to-mobile –  Sep 17 '12 at 12:03

2 Answers2

16

Here are several blogs posts on responsive design:

Community
  • 1
  • 1
Ilja
  • 44,142
  • 92
  • 275
  • 498
  • 1
    Ilya Knaup, great share!!! I've been searching useful info on how to start working with responsive design layouts. I am working on my own project now, using twitter bootstrap. I've marked up my whole theme files using a fixed width of 940px. And then lately, I thought of converting this theme into a responsive one. But I have no idea where to start. I am confused about @media queries vs. code based. But what you've posted is a good start for me to learn things about responsive design layouts. – GaryP Aug 11 '12 at 10:47
  • @GaryDapogi No problem ;) that's why we are here to help each other ;)) tell me if you get stuck or something, I learned quiet a bit of responsive layout stuff since I posted this answer, so I'll be glad to help you ;)) – Ilja Aug 11 '12 at 13:04
  • Thanks! Sure I will. I'll read, study and learn more about the contents of those articles you've posted. I'll be needing your help for sure, so better be ready. – GaryP Aug 11 '12 at 13:18
1

The 'treehouse' has a course on it. I did this one (Beginners Guide to RWD) and, honestly, I didn't get that much out of it. It just really wasn't that practical.

The thinkvitamin site all looks nice and pretty but I much prefer www.lynda.com. In saying that, lynda doesn't have so much in the way of newer, cutting edge material. You could try this one (CSS Page Layouts) Haven't got around to doing that one myself but the depth of stuff on lynda is good so if you need some long term tutoring, signing up is worth the $30 a month or whatever it is.

Also, I do know the treehouse has undergone a pretty big makeover (hooking up with CSS-tricks and whatnot) whether it's just a (perhaps Chris Coyier inspired) aesthetic makeover or the courses have got better, I couldn't say as I cancelled my subscription after the disappointing tutorial on responsive web design. I think I only did that one and one other though so it's a pretty small sample size.

Basically though, all you need are media queries in your css to replicate the behaviour of the site that you provided. Then just apply the right css for the right screen width / device... Not sure what you mean by "since all others resize the window" - wouldn't the user be resizing the window not the design? Not sure what you're getting at there...

RevanthKrishnaKumar V.
  • 1,855
  • 1
  • 21
  • 34
Dean_Wilson
  • 190
  • 13