ABSTRACT

This chapter discusses the layout design approaches and how they are implemented, especially through Cascading Style Sheets (CSS) flexible box and CSS grid layout properties. The layout of Web pages is influenced by various factors. The most important of these are screen size and screen resolution. Modern websites are more likely to use a responsive or adaptive approach, both of which incorporate it. Responsive layouts are also known as Responsive Web Design (RWD), while adaptive layouts as Adaptive Web Design (AWD). A responsive design is achieved by defining layouts for different resolutions and making each layout liquid so that transition between them is fluid as screen size changes. In contrast, AWD, like the old approach of creating different versions for the same site, typically involves creating different versions of the same design and delivering the appropriate version to users, based on their devices' screen size and capabilities.