What types of website layout exist. Advantages and disadvantages.

Fixed layout

The easiest way to layout a website is a fixed layout. With this type, you create a site with predetermined page sizes - it has a constant width. Fixed layouts adhere to these dimensions regardless of the type of browser or device.

Fixed layouts are slowly disappearing with the increasing use of mobile devices. Because these sites don't adapt to devices, they don't provide a positive user experience on smartphones or tablets. While fixed layouts are still used, you generally don't need to use them unless you are creating a completely separate mobile version of your site.

Pros of a fixed page layout:

• Easy to set up

Cons of a fixed page layout:

• Not responsive to all devices or browsers
• Requires a separate mobile site

Fluid layout

Next on this list of website layout types is rubber layout. This layout, also known as "fluid" layout, uses flexible layout units rather than the fixed units used in fixed layouts. Because the units are flexible, the page will always fill the width of the device screen, no matter what kind of device it is.

Because user experience is one of the most important things in attracting traffic to your site, fluid layouts have also slowly begun to be used less and less as a viable option for businesses. While you can still use this layout, you run the risk of creating a poor user experience because your site stretches too much or compresses the information on the page.

Pros of a fluid page layout:

• Easier to customize than an adaptive design
• No information is cut off on pages

Cons of a fluid page layout:

• If the browser is very wide, information is stretched to the size of the screen and can look unattractive.
• If the browser is small, the information is blended to fit on the screen, making it difficult to read and browse.

Adaptive website layout

One layout format you can use for your website is the adaptive website layout. As the name implies, this site uses CSS media quieries to adjust the size of the site to the size of the browser. Adaptive sites automatically change their layout to provide a better user experience for visitors.

Adaptive site layouts have preset parameters for how the website will adjust. For example, a set parameter might look like this: "If the browser is 500 pixels wide, set the main content container to 400 pixels wide. Or, if you have a website with a two-column layout, the adaptive layout would change to a single-column design on a small browser screen.

Pros of a adaptive page layout:

• Easy to set up
• Takes less time to develop than responsive layout
• Can adjust your site to fit each browser

Cons of a adaptive page layout

• The width of the device between setpoints can cause your site to have too much or not enough space.
• Not a fully responsive layout

Responsive layout

Next on our list of website layout types is responsive layout (responsive layout). This layout format is the most popular because it allows your site to adjust to all devices and fill your browser size perfectly. Responsive design is built with a focus on mobile devices.

A mobile-friendly layout is created first, and then the layout is modified for a larger browser size. So instead of trying to downsize your website and make it smaller, you start small and expand it.

Pros of a responsive page layout:

• Get a website designed for mobile users
• Provides a seamless experience on all devices
• No need to build a separate mobile site

Cons of a responsive page layout

• Requires more time to create

Conclusion

Given the ever-increasing share of mobile traffic on the Internet, 2 layout options are the most preferred: adaptive and responsive. Which one you choose depends on the project and your preferences.

And that's all for today. Thank you all, bye everyone! 👋