1
00:00:00,025 --> 00:00:04,714
[MUSIC]

2
00:00:04,714 --> 00:00:09,690
In general, responsive design consists of
fluid grids, fluid images, and

3
00:00:09,690 --> 00:00:11,240
media queries.

4
00:00:11,240 --> 00:00:15,360
By this point, you should have already
done some responsive design.

5
00:00:15,360 --> 00:00:17,890
But understanding the origins and

6
00:00:17,890 --> 00:00:23,220
foundational principles will help you step
into more advanced concepts.

7
00:00:23,220 --> 00:00:24,760
That's a lot to think about, so

8
00:00:24,760 --> 00:00:29,280
these lessons will focus on layouts in
responsive design.

9
00:00:29,280 --> 00:00:35,240
In other words, we'll learn about some of
the basic theory behind responsive design.

10
00:00:35,240 --> 00:00:40,420
And then we'll step into more specific
concepts like breakpoints and

11
00:00:40,420 --> 00:00:41,550
design patterns.

12
00:00:42,780 --> 00:00:46,045
If that doesn't make any sense now, don't
worry.

13
00:00:46,045 --> 00:00:49,665
We're going to cover everything in more
detail soon.

14
00:00:49,665 --> 00:00:54,215
Whether you're a designer or a developer,
and whether you're working on

15
00:00:54,215 --> 00:00:59,205
some views in a Rails app, a PHP site, a
WordPress theme, a static website,

16
00:00:59,205 --> 00:01:04,860
or really any other type of webpage, the
principles will remain the same.

17
00:01:04,860 --> 00:01:08,840
I should also point out that we're going
to be using plain CSS

18
00:01:08,840 --> 00:01:13,180
throughout this course for the benefit of
everyone's understanding.

19
00:01:13,180 --> 00:01:17,460
But if you're more comfortable using
something like Sass, Less, or

20
00:01:17,460 --> 00:01:23,830
any other CSS extensions or compilers, the
ideas presented here will still apply.

21
00:01:23,830 --> 00:01:25,450
With that out of the way,

22
00:01:25,450 --> 00:01:28,150
let's learn about the origins of
responsive web design.