Web developers have been arguing about how to handle the multitude of varying screen resolution settings for more years than anyone would care to admit. Even in the days when only two practical resolutions existed (1024x768 or 800x600), passionate debates about which size to develop for and how to go about it were the norm. And now? There are smart phones, tablets, plus standard and widescreen monitors; each coming in different physical sizes, and most with multiple resolution settings.
What are developers to do?
Well, it has been the case that developers choose to either create a site with a “fixed” or “liquid” layout.
Fixed Layouts are those that are designed around a specific width. They remain that width no matter the browser’s window size. These sites allow more control over design and remain consistent across different platforms and browsers, but are sometimes looked down upon for not utilizing the full width of a browser window.
Liquid Layouts typically rely on % values to determine how wide the different elements on the site should be. These layouts utilize the full size of the browser window, adjusting for any screen width which is often viewed as the “best” solution. But liquid layouts suffer from their own set of problems. Browser windows are very often not set to full-screen, which can result in the squishing of all the content into a too-small area. Additionally, content elements (like images and video) must be a defined with a specific size, so can lose their desired effect if the browser window is too small or too large- even typical text content like short bulleted lists could suffer from the same ill-effects.
But both layout types have distinct pros and cons- how do you decide?
You may not have to. The emerging concept of Responsive Design is becoming a reality, combining the best of fixed and liquid layouts creating a unique user experience designed for any/all browser window sizes.
Continue with Responsive Designs , how they work, and how to develop them…
Connect with SEO?
