Few years back, most of the websites used to be non-responsive means the websites usually had fixed widths. So, in mobile, you have to scroll them horizontally to view the content or you have to zoom out if you have a touch screen. After zoom out, the text size was so small that it was really hard to read.
Because of these issues the requirement of responsive website came into the picture. A responsive website is one which displays web pages perfectly in all type of devices whether it’s a mobile or tablet or laptop. The screen size of any device is usually calculated in terms of pixels. Mobile screen is approximately 400 to 500 pixels. Tablet sizes around 700 to 990 pixel. And, laptop and PC screen size is above 1000 pixels. This is a very rough idea. It could vary based on your device screen resolution.
The responsive website will have sections & elements styled according to these device size breakpoints. As you might have seen, in mobile, the sections are vertically aligned and the content is fitted into the specified width of your screen. You don’t have to scroll horizontally in that case. Also, the font size will be automatically sized according to the device, so that it can be easily read by human eye. Not only text, but the images also are resized according to the screens. These days responsive website is must for getting good rank on Google because Google and other search engines prefer mobile friendly websites over the non-responsive websites.
If you have any queries, drop them in comments below.