Difference between fluid, reponsive & adaptive design

The main difference between Responsive and Fluid/Liquid Design is that Fluid designs are based laying out your website proportionally so elements take up the same percent of space on different screen sizes.

Responsive Designs on the otherhand uses CSS Media Queries to present different layouts based on screen sizes/type of screen. 

Whilst Adaptive designs see the developer creating completely distinct webpages to be served up to the user based on the screen/device they are using at the time they view it.

Fluid Design
The aim of Fluid or Liquid design is to maintain the same spatial weighting of all elements.  This approach works well on different sizes of screens of the same sort. They look the same on a 24″, high resolution monitor as the would on a  12″ lower resolution laptop. 
When it comes to mobile phones however, the user experience can be compromised due to the screen size of the devices.

Responsive design’s begin with scalability in mind.  The designs will present different devices layouts tailored specifically for the type of screen.   
If you’re working on mobile the entire layout may be reconfigured in a single column to suit the phone screen

Adaptive designs require the designers and developers to consider the purpose and experience they envisage customers might require.  They may limit design elements on phones to make it faster to load or focus on particular features of the website that they believe meets the overwhelming requests for users on that device.




Adwords (1)

Branding (13)

CMS (3)

CSS (6)

Graphic Design (6)

Javascript (1)

PHP (3)

SEO (5)

tech support (5)

Web Design (10)

Web Development (10)

Wordpress (17)

Wordpress plugins (3)