With the growth of technical progress, we have more and more opportunities to access the Internet: now it’s not just stationary computers, but also a variety of tablet devices, mobile phones, smartphones, laptops, and even TVs. Therefore, the traditional design with fixed width has been replaced by adaptive web design, the feature of which is to create such web pages that should be conveniently viewed with any device that provides access to the Internet.
Our studio always stands for a modern approach to website development, so when creating a new site, we always offer the client and his adaptive layout. But this does not mean that sites without adaptive design need to be redone from scratch. If your site completely suits you and perfectly performs its functions, then you can simply adapt it to all screen resolutions using adaptive layout.
Stages of development of adaptive site design
With the introduction of adaptive site design, the stages of its development also change, requiring a more integrated integration of designer and developer activities. Below is a sequential algorithm for creating an adaptive site with a brief description of each step. We should immediately make a reservation: an ideal strategy does not exist – it is determined in the process of interaction individually.
Stage 1: Designing
Here, first of all, it is necessary to collect all the necessary data about the client’s business, its competitors and set the main objectives of the project: what, why and to whom. Next, you can start creating prototypes of the interface, given the fact that the site should be practically displayed on small devices. For this, all design elements are critically evaluated: how important a block is, whether it can be abandoned, how it will be displayed on a particular device, etc. Here, as it is impossible, by the way, Alan Cooper’s rule applies “No matter how cool your interface is, the less it is, the better”
Stage 2: Building a Modular Grid
Using the developments of the first stage of design, a modular grid of the future interface of the site is created. This is necessary to create an easily maintained and pleasant design. Here you can use a special tool – the generator of a modular grid for adaptive design.
Stage 3: Design
Only now it is the turn of the design of the site. Using certain graphic tools and finished prototypes, the blocks are arranged on a modular grid. It is better to consult with the developer about the possibility of this or that option.
Stage 4: Layout
Stage 5: Testing
The developed page passes testing on different variants of devices, and all participants of a command estimate from the professional point of view. The designer looks at the indents, the size of the icons, the fonts. The developer is responsible for the download, the abundance of css3 and the optimization of styles, the correctness of the display. The designer evaluates the convenience of using a site by a particular device, how easy it is to find the information that interests him.