What is responsive web design really about?

A specific approach to modern web design is the so-called adaptive web design (RWD).

The term responsive web design means the creation of Internet content that is primarily easy to use, but also extremely suitable for use on different types of devices that have different screen sizes.

Responsive web design is a specific technique of creating a certain site which, as its name suggests, is adaptable to display. This adaptability primarily applies to screens of different sizes, so that the site created by this technique can be easily viewed on both desktop computers and laptops, and tablets and mobile phones, which have different screen sizes, and that the contents are equally viewed on each of these devices.

The content of the site, which is made using the responsive web design technique, is completely adapted to different screen dimensions with the help of so-called fluid grids (which are based on adequate proportions), as well as with flexible images and special technology that allows different CSS properties to be used equally well. on devices with different screen widths (CSS3 media queries).

The basic characteristics of responsive web design on mobile phones, in addition to the above, are JavaScript codes, which are unobtrusive, as well as progressive improvement. This actually means that some models of mobile phones, ie their browsers, do not actually understand JavaScript codes.

For this reason, it is recommended to first create a very simple website, which with adequate corrections is especially carefully and gradually adapted, ie improved to the needs of all models of mobile phones, ie desktops, laptops and tablets.

In a fluid grid system, it is very important that it is necessary that the dimensions of all the elements of a particular page are not expressed in pixels (absolute unit), as is usually the case, but in percentages (relative unit). This applies, of course, to photographs, which also need to be expressed as a percentage, because this prevents the possibility of photos being displayed outside the content of a particular element within which they are, or as the jargon says that the site does not spoil. The term CSS media queries implies the use of different CSS styles, in accordance with the different dimensions of the device for which a particular website is intended to be displayed. In this way, they adjust, for example, the margins or font size within the text, in order to achieve the most optimal visibility of web content on devices of different dimensions.

When it comes to the need for a particular website to be visible on mobile devices, even when they do not recognize JavaScript, or do not support JavaScript codes, it is necessary to perform browser detection in the first place, but also the detection of the mobile device itself . In this way, it is found out whether a certain mobile device supports the properties of HTML or SCC or not. And in order for these methods to be truly reliable, it is necessary to adequately combine them with the possibilities offered by the Database.

In case there is no support for certain devices, ie they do not support HTML and CSS properties, there are numerous internet tools that are there to enable that support. It should certainly be borne in mind that each of the mentioned verification functions is not completely reliable for detection. Fortunately, various add-ons are also available today within the Internet browser, which offers quick and easy flexibility testing.