cre8d design

Responsive Design 101 – A guide for non-technical people

What is responsive design?

  • When a website is responsive, the layout and content automatically changes to suit the size of the screen you’re viewing it on.
  • It’s a way of approaching both the design and coding of websites so that they display and work well on desktop, tablet and smartphones.
  • It’s not a trendy gimmick but highly practical and important.

It’s new* and popular

There’s certainly growing interest in the term since Ethan Marcotte first coined the term in May 2010:

In fact, Mashable called 2013 “the year of responsive web design”.

Why should a website be responsive?

Given that smartphone and tablet usage is skyrocketing and their varieties are proliferating, ensuring your website is easy to use and your content is easy to read for all your visitors is crucial.

Google says it’s best practice

At the end of 2012, Google began recommending responsive web design, calling it best practice in its Webmaster Guide.

Google is using mobile-friendliness as a ranking signal

Starting April 21, 2015, Google will use mobile-friendliness in its mobile search result ranking algorithm.

What’s wrong with having a separate mobile site?

Well nothing, sort-of. (Except Google doesn’t recommend this approach.)

If you’re running the website, it means multiple site designs (and often content) to maintain.

If you’re visiting the website, how often have you been annoyed by the cut-down “mobile-version” and clicked through to the “full” site to find what you’re looking for? Those experiences aren’t really “mobile-friendly” after all. Responsive design encourages you to have the same content for all devices, just adapted in presentation to suit the screen size.

Is cre8d doing responsive design?

Yes. We’re now doing responsive designs by default for projects we’re taking on.
Note that there may be some instances where it’s not required.

How do I know if a website is responsive?

When you’re using a laptop or desktop computer, try resizing your browser window and see if the layout and content rearranges and adapts to stay easy-to-read as the browser window gets smaller.

How do I know if a website is mobile-friendly?

It passes Google’s Mobile-Friendly test.

* Nothing is entirely new under the sun; it’s the combination of methods and thinking right at a much-needed time that has been the key.

What should I consider before making my website responsive?

8 things to consider before making your website responsive