In the words of Andy Clarke, "Web design is responsive design. Responsive web design is web design, done right." As a product manager, it is essential to understand the significance of responsive design in web development. By comprehending the different types of layouts involved in web design, such as static, adaptive, and liquid, product managers can make informed decisions and create better products that cater to users' needs across various devices.
Static design
Static design is the oldest type of web design, where pixels are used to create fixed width layouts that do not respond to a user's screen or browser width. We don't want an entire website to be static, but static elements are important when the stability of an elements size matters. For example, the width of this articles title is static to ensure it's position relative to the color cards behind it.
Adaptive design
Adaptive design is often confused with responsive design. It is concerned with the most commonly used screens and devices, and designers create several static layouts and combine them with CSS media-queries to accommodate them.
Liquid design
Liquid design, in contrast, is not concerned with the device being used and uses relative units like percentages to maintain a layout, regardless of the screen type. However, as screens become narrower, these types of layouts can become awkward.
Responsive Design
Responsive design combines adaptive and liquid design. Media queries are used to target specific device sets, such as monitors, tablets, and phones, and relative units are used to ensure smooth transitions between devices and media queries.
Is that everything you need to know?
Of course this is a introductory look at responsive design, but it's an essential starting point for any Product Manager or Software Tester aiming to make informed decisions and create better products. By incorporating responsive design as a product requirement, it tells your developer that the website being accessible and user-friendly on different screen sizes and types is important.