02nd September 2017
Responsive HTML5 Websites are currently a very popular way to go. Using one design it will adapt for tablet and mobile so you can cover as many devices as possible - this is very clean as you have only one set of pages (no need for anything like a separate mobile site etc.).
A responsive design aims to cover as many device widths as possible with a single website - Large Screen Devices (e.g. TV browsers), Desktop PCs, Tablet PCs and Mobile devices.
Responsive design is a mixture of fluid and adaptive designs. Fluid designs are structured so that they flow with the width of the browsing device, using percentages for layout. Adaptive designs alter elements of the layout (via CSS) based on the width of the browsing device - for example a Tablet may need a simpler Image Gallery or a mobile device may suit a simpler Menu system. A three column layout on a PC may need to be revised to a single column for mobile device widths.
Using one set of code to cover all device sizes is the aim. Early versions of responsive sites involved separate mobile version etc. which caused continuity issues and so on. CSS advanced mean that we can achieve much more with responsive sites - Media Queries, CSS Grid and Flexbox all allow the creation of beautiful adaptive and fluid design elements for our web pages.