With the growing number of laptop and mobile devices from which we can access the web, and their different sized screens and browsing options, web designing has become very challenging. The issue is no longer just related to the type of browser and mobile device; you have to consider what type of mobile device the users browsing through the website you are creating will most likely be using.
There are now numerous types of devices available on the market, including smartphones, netbooks, desktop computers, laptops, iPhones, tablets and so on, and the screen size and resolution of each one may vary yet again. So it really can be very tiresome, in fact you can consider that today’s web designers are focusing more on market research strategy than simple creative challenges.
Nowadays, web designers can no longer create individual website designs for each device, the number is too high and it would be too time-consuming and impractical. Today’s designers should be working on designs they can adapt to the specific needs of each different browser, despite the type of device being used.
The screen resolution on the various devices is on the increase, and many actually have full HD screen resolutions, with 1920×1080 pixels as opposed to the 1280×800 pixel resolution they had a few years ago. This means that designing gets even more complicated as the resolution increases, and this should be kept in mind when creating designs for a website.
Then web designers are also faced with the incredible number of people now using mobile devices to connect to the Internet, that yet again have a different resolution ranging from 240×320 pixels on smartphones to 1024×600 on notebooks. This means that if you design a website for a larger resolution it cannot be viewed correctly on a smaller screen, and the same can be said if you design a website for small resolutions, these will look funny on larger screens.
This is why it is important to start off with a flexible foundation, as using a fluid grid alone will not be of much use. It is essential you work with a layout or grid that you can change according to the screen resolution and type of device. As far as simple layouts are concerned you will not encounter too many difficulties. However, for more complex ones, which vary in columns and screen width there are some issues you need to keep in mind.
You can create a great responsive design with a fluid grid, as these will help you combine the layout of the content as well as the resizing including changes in screen widths. This may help you avoid dropping columns.
What happens if you do not use a fluid grid, is that if you intend to have a web page with three columns, the third one will drop out of sight if the screen width is lower than 800 pixels. If the screen gets even smaller then you may not see the second and third column at all. This is why it is essential to be able to have flexible column widths, in order to adjust automatically to the screen sizes.