responsive design vs fluid design

 tag 10:43 pm on May 15, 2013
A Picture of tag

There seems to be confusion with this a lot, so here’s a mini lunch n learn on the subject.
Responsive design is width driven, meaning the width of your screen determines which design layout to show. As you can see in this image, there are a lot of design considerations if you go full responsive. Never go full responsive. Each supported dimension requires its own design. Each design requires usability consideration and what mobile users are really after. Simply dumping your entire website onto a mobile device is not the answer.

devices

Fluid design is a different beast made very popular by Flash. It’s where elements on the screen act independently of each other – scaling, moving, anchoring – all kinds of fun things as you resize your screen, horizontal or vertical. It is absolutely a real-time function as opposed to the common “snap” of responsive, though that isn’t to say responsive can’t appear fluid, but that’s a more advanced scenario for another time.

The final consideration is this: each of these approaches MUST be considered during the planning phase of your project. They are not simply something added on after the fact. It is a common pitfall that results in a LOT of additional time and effort that could’ve been avoided up front.

Philips, First Choice Haircutters and Ricoh logos.

These brands achieved double digit growth by working with tag's truthology™ platform

Sign up for our FREE truthology workshop and get on your way to achieving great results like these*

x

Philips Logo, FCH Logo and Ricoh Logo

These brands achieved double digit growth by working with tag's truthology platform.

Sign up for our FREE truthology workshop and get on your way to achieving great results like these*

* free workshops offered to a limited number of qualified organizations