Responsive web designing is designing technique that provides easy usability, functionality and user experience over multiple platforms and devices. The basic ingredients of a responsive website are:
- A flexible layout
- Flexible Images and media content
- Media Queries
Adjusting Screen resolution
Different devices have different screen resolutions and screen sizes. New devices especially mobile phones are coming in market with different sizes. A responsive website is one that runs efficiently on every device of every size. The main purpose of creating responsive websites is that they can provide flexibility and elasticity over multiple devices.
Fix your images in such a way that it can be easily viewable on PC and on mobile as well. Image resolution and image downloading time is the main consideration. Image gets automatically narrow on mobile screen but you can see it by zooming the screen.
CSS media Queries
CSS supports all media types like screen, print, max-width, and also add dozens of media types like colour, orientation. So using a media query to solve all the flexibility problems. All devices android, IOS and windows supports CSS queries. You can create multiple stylesheets for different orientations. CSS media query has two options for orientation like Portrait or landscape.
Touch Screen and Cursor based Interaction
Responsive Vs Adaptive Designs
Responsive designs s are those designs that response to fit any screen of any c size. Responsive websites provide an optimal view for each device with a minimum of resizing and panning. It provides only one design that fits on all screen sizes. It is difficult to code as compared to adaptive design. CSS code requires more attention so that it can operate on every device. Development of a website in responsive design load faster than adaptive design. The majority of new sites are now using responsive designs for their websites. It doesn’t provide much control but it can easily be handled and maintained. Responsive websites are more flexible than adaptive websites.
Adaptive designs have designs for almost six kinds of screen resolutions. There are different layouts for different screen sizes. Websites detects the size and model of the device, all the layouts are being loaded and the layout that fits perfectly is than adjusted for the specific device. Adaptive designs requires less coding but adaptive website takes more time to load the design. They are less flexible than responsive websites. They have a layered based, streamlined design. Adaptive websites are not commonly used .Adaptive is user friendly and is provide more control over the design.
Why to use Responsive design?
When your big concern is time and flexibility then you should use responsive designs for your website. Responsive designs are most famous and most commonly used designs now a days.
Why to use Adaptive?
If your first concern is device dependent interface, than you should use adaptive designs for your website. If a website Development Company has budget to create all six kinds of interfaces, than you should choose adaptive designs.