I cannot start this theme without citing Ethan Marcotte, who released the book Responsive Web Design in 2011, which has become a reference for many other books and articles from across the frontend community.
In my understanding of Marcotte's book, the meaning of responsive web design is to provide different experiences for the user to see the same site depending on the available screen area. Technically speaking, it involves the use of the following three main techniques:
Flexible grid-based layout
Flexible images and video
Smart use of CSS splitting the website behavior (media queries)
More details about each technique will be shown later, but just to clarify this concept visually, have a look at the following example, which represents a website as displayed on a small device (smartphone) on the left, medium device (tablet) in center, and on a large screen (desktop) on the right:
Note
There are many more challenges than just creating fluidic dimensions and applying some media queries.
We will talk about many minor and major challenges throughout the book. Some of them are:
Replacing mouser-over events with touch events
Facilitating the filling of data in the form fields
Prioritizing the content
Site loading optimization