CARP
design
responsive
web
Responsive Web Design
When you are talking to someone and they don't respond, you can usually assume that they aren't interested. The same sort of thing can be applied to web design, but the key is giving your viewer the opportunity to respond.
Now what is responsive design?
To find out for myself I Googled that exact question and found a website called "What The Heck Is Responsive Web Design?" which of course caught my eye. Responsive web design has many key characteristics such as a responsive website allows you to respond as well as it responding to you. Adaptive design has become so important due to the expansion of different types and sizes of screens that we are bombarded with and use everyday.
Media Queries are a way that we can create responsive websites. They are a CSS3 module allowing content to adapt to screen resolution. I actually found a website called "Media Queries" which showcases many web designs that can fit multiple screen resolutions and sizes. Breakpoints, another aspect of responsive web design are a declaration that changes the layout once the browser is within the set range. These are set in the CSS of a web page.
Using Media Queries I found a cute website about dogs that perfectly demonstrates responsive web design. Check it out here!
![]() |
This is the closest I could get to a mobile design, the text adjusted to an easy to read font but everything kept compressed with the one column design. |
![]() |
With this width the font size increased but the layout stuck with a one column design. |
![]() |
And finally this shows that the website still works with a very wide window. The design remains the same just at its full width. The website seamlessly adjusted to whatever the size of my window was.
|
Nice example! Consider changing your font, please... :)
ReplyDelete