Resources

Demonstrating Responsive Design

Last updated on 30 May 2012

Explaining ‘responsive web design’ to anyone who isn’t a web developer is tricky – show them and the penny drops instantly. Resizing the browser is fine but non-web geeks don’t seem connect the browser window size with a device window size. This demo is intended to demonstrate the practice in a manner everyone ‘gets’.

  • Resource Name

    Demonstrating Responsive Design

  • Resource Creator

    Jamus Reynolds

Description

Nope, this demo isn't responsive. It's designed to be a tool to demonstrate in the clearest manner possible to the widest audience possible. I felt concept would be lost if someone on their smart phone couldn't see differences between 'viewports' just the same a those on their desktop. Yeah- I know, I know.

View on Github Download Resource

Related Resources

  • CSS Media Queries

    January 9th, 2013

    CSS Media queries allow you to target CSS rules based on - for instance - screen size, device-orientation or display-density. This means you can use CSS Media Queries to tweak a CSS for an iPad, printer or create a responsive site. Open the overview to see the complete list, and find for each media query if your browser applies these.

  • Ish

    ish

    February 16th, 2013

    ish. is yet another viewport resizer. What's with the name, you ask? Small-ish. Medium-ish. Large-ish. That's the idea.

  • Are you Responsive high fidelity preview tool

    Am I Responsive?

    May 27th, 2012

    A high fidelity preview tool for review your responsive site across popular device types.

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.