1
00:00:00,025 --> 00:00:03,852
[SOUND] Responsive web design is a
collection of techniques for

2
00:00:03,852 --> 00:00:07,319
building websites that work at multiple
screen sizes.

3
00:00:07,319 --> 00:00:12,168
The [SOUND] scope of responsive design
also sometimes includes websites that

4
00:00:12,168 --> 00:00:16,864
work at different pixel densities, such as
traditional [SOUND] screens or

5
00:00:16,864 --> 00:00:18,088
high DPI screens.

6
00:00:18,088 --> 00:00:22,606
It all started in May of 2010 when Ethan
Marcotte wrote a seminal

7
00:00:22,606 --> 00:00:27,360
article titled Responsive Web Design on
the blog A List Apart.

8
00:00:27,360 --> 00:00:31,340
You can find a link to the blog post in
the notes associated with this video.

9
00:00:31,340 --> 00:00:34,070
And I highly recommend you take the time
to read it.

10
00:00:35,210 --> 00:00:39,970
Back then, most web professionals would
often create a mobile version of their

11
00:00:39,970 --> 00:00:44,930
site and a desktop version, which means
they would have to maintain two

12
00:00:44,930 --> 00:00:50,240
separate websites, or worse, the site
wouldn't work on mobile at all.

13
00:00:50,240 --> 00:00:54,850
People also used to use JavaScript to
detect which browser people were using,

14
00:00:54,850 --> 00:00:56,870
which is unreliable.

15
00:00:56,870 --> 00:01:00,890
At first, this seemed like it would be
somewhat maintainable, but

16
00:01:00,890 --> 00:01:04,890
when more phone sizes and then tablets
arrived and

17
00:01:04,890 --> 00:01:09,084
fragmented layouts even further, it
quickly became unsustainable.

18
00:01:10,455 --> 00:01:15,315
Instead, Ethan presented the idea that
rather than trying to make a different

19
00:01:15,315 --> 00:01:20,515
layout for every device and screen size,
we should instead create layouts

20
00:01:20,515 --> 00:01:25,965
that intelligently respond to any device,
hence the term responsive web design.