|
Home / Internet / Web Design
Web Design Choice Of Fixed Width Vs Liquid Layouts
By:Moe Tamani
If you have worked long enough for your web design company, or if you have tried designing a site on your own, you should already know by now that there are two kinds of web page layouts that you can choose from.
Fixed width layouts are those wherein the width of the entire web page is set at a specific value, while liquid layouts are those wherein the width is flexible depending on how wide the online visitor's browser is. Choosing between these two layout methods can be a little difficult for a web designer, as each has its own benefits and deficiencies. Let us look through each and discover everything you need to know for you to make the right choice.
Fixed width layouts allow you to start with a specific size that you set. This allows you better and direct control so that you know how your page will look like, at least most of the time. They work best if you work with print backgrounds, as they allow for minute adjustments in the layout without inconsistencies across browsers and operating systems. On the other hand, with a liquid layout, you base the layout on a percentage of the browser's current window size.
Liquid layouts allows for an efficient use of space given by any browser window or screen resolution. They are often used by web designers who want to get as much information across in a very limited space. Your web design company may ask you to choose one from the other depending on the needs of your client.
What is at stake for you and for your web design company when you choose between these two windows? Well, the method you choose has a large bearing not only on the final site design and aesthetics, but will also affect the ability of your online visitors to scan through the contents of your site.
Furthermore, the layout can affect the ease, by which readers will find what they are looking for in the page, and can also reinforce or ruin your marketing efforts in the website. Thus, your web design company may stress the importance of choosing the right one depending on the message that the client wants to communicate across.
The Web Design Benefits and the Drawbacks
To help you and your web design company to decide on which to use, I will present the benefits and the drawbacks for each type of layout.
Fixed Width Layout
1. The web design Benefits
I. Allows you to come up with pages that look entirely identical no matter who is browsing and what type of browser is being used.
II. Elements such as images and graphics will not tend to overpower the text contents especially in smaller monitors.
III. No matter how wide the visitor's browser is, the scan length will not be affected when there are large segments of text.
2. The web design Drawbacks
I. They will cause horizontal scrolling in small browser windows. Users generally dislike having to scroll horizontally.
II. Fixed width layouts usually result to large coverage of whitespace in large monitors such that there is a waste of unused space, and further vertical scrolling may be needed than necessary.
III. This layout can not deal with font size changes quite well. A small increase in the font may be tolerated, but larger increases can not be handled well that your overall layout may become compromised.
Liquid Width Layouts
1. The Web Design Benefits
I. This layout can contract and expand to fill in all available space on the page.
II. All available space is used up, thereby allowing you to display as much content as you need to in larger monitors, yet still remain viewable on smaller ones.
III. This layout can provide you consistency in relative widths, therefore allowing your page to respond dynamically to restrictions and specifications that may be imposed by your client, such as larger font sizes.
2. The Web Design Drawbacks
I. Liquid layouts do not offer precise control over the page width and the elements on the page.
II. This layout may result to columns in the text which are either too wide for comfortable scanning, or too small for the text to show up very clearly.
III. Liquid layouts tend to have problems when dealing with elements in the page which has fixed width (i.e. image and graphics). If the column does not have enough space, some browsers may increase the column width, and all other elements in your page may not be in the proper order.
Many designers usually go for the mixed approach. You web design company may also suggest you to use both layouts depending on the page and the part of the site you are making. You can, for example, set your main columns to fixed width but make your side columns, headers and footers more flexible. With time and experience, you will eventually learn how to make the most out of the features of each layout type to come up with an optimized site.
Digg
del.icio.us
Blink
Stumble
Spurl
Reddit
Netscape
Furl
Article keywords: Web design, website design, webdesign, RSS, Google, Marketing, SEO Services, Search Engine Optimization
Article Source: http://www.articles2k.com
Moe Tamani is a Marketing expert with a leading SEO services company specializing in SEO web design.
|
|
| Top Web Design Articles |
- 1). Advanced Joomla Templating (pt1) Using Module Class Suffix By : Robert Palmer
an article from User Written Resources
1. duplicate the styles already used for the particular module, adding a suffix to each style name. this will definitely include some of the following;
1. .module {} 2. div.moduletable {} 3. div.moduletable h3 {} 4. table.moduletable {}/li> 5. table.moduletable th 6. table.moduletable td
and can include other styles used on the content in that section, such as;
1.
|
- 2). Irish Graphic Design Industry By : dave4
Graphic design is the use of color, light, balance, contrast, emphasis, proportion, proximity, repetition, texture and a plethora of other elements to create a work of digital art that is pleasing to the eye. Graphic design is about seamlessly molding image and text to convey a theme, message, or often advertise a product or service. Graphic design dates back to prehistoric times.
|
- 3). Adsense: The Smart Investment By : Pat Lovell & Jon Atwood
Over the last 2 years, We have been building a Virtual Adsense Empire of over 500 websites and making some good money. We've also been building content sites for clients using the same system. The system we use is not something that produces 1000's of sites with a click of a button, our system does not build spam websites, nor does it produce the same sites you see over and over and over again.
|
- 4). Some guidelines for Website Design By : Angela Oliver
You have a great product. You also have a great company image and marketing model. Now it is time to implement all your plans and bring together a website. You know very little about websites. Finding websites that have failed is easier than shooting fish in a barrel. Many people come into the internet business with the notion that if they are on the web, they are guaranteed to make money.
|
|
|
- 6). Develop Your Business Web Site for Profits By : Jay Peterson
Looking into developing your business web site? Whether creating a business web site to sell your business products online or just to give the public valuable information, creating a business web site can be an important first step to creating an important presence on the web. Here are some tips on creating a business web site as well as what is involved in getting your business web site off the ground.
|
- 7). Is your printing costs sky rocketing? By : Florie Lyn Masarate
Here are some things you can do to be able to lower your printing costs.
1. Cheap but good quality printer.
There was a time when only a handful of people can afford having one of those colored and digital printers. Now that these things are more rampant, they have become more affordable. Color printers of good quality are even inexpensive already.
|
- 8). Creating A Quality Web Site Design! By : Martin Lemieux
In this article, I will attempt to cover the basics of creating a great quality web design template for your site. Now it's a known fact that the layout or "eye candy" as I put it will determine whether your visitors will stay more than 15 seconds or they will just become another statistic.
In this article, I will attempt to cover the basics of creating a great quality web design template for your site.
|
- 9). How Does Your Website Make Me Feel? By : Philippa Gamse
When people think about the Internet, they think about technology. When people hear that I am a Website strategy expert, they see me as a "techy type".
But for me, the most intriguing aspect of your online business isn't about the technology. It's about human connections, and how you can create these in a virtual environment.
It's commonly understood that "people buy emotionally, not intellectually.
|
- 10). For Automated Sites - PHP and MySQL Are A Perfect Match By : Halstatt Pires
You’ve decided to automate your web site. Now what? Here are some ideas to help you choose how to automate your site.
A bit of programming is going to be necessary if you want to automate a site. There are many types of programs that can be used to automate a web site including JavaScript, PHP, Perl, ASP, Java and more. So, which do you use? For many, it is a personal choice.
|
| New Web Design Articles |
|
|
|
|
|
|
|
|
|
|
|
|
- 7). Graphic Artists - Who Needs One When You Can Do It Yourself Online? By : Pearl Deloria
Image is everything! Think about it. How many times have you made a judgment about a company based on the quality of the junk mail that you have been sent?
Other people make similar judgements, too. Businesses cannot afford to be thought of as cheapskate in their marketing.
You know that most of your mail goes straight in the trash, and it may grieve you to spend four times the amount, just for it to be thrown away.
|
- 8). How To Style Your Text With CSS By : Hilco van der Meer
Styling text with CSS is really simple. We can define colors, underline it, make it bold, define the font etc etc.
We will start with some basics.
First we define the html where we will be working with. This is the text
1. Colorize your text
We can select the P tag and add some styles to it.
p { color:red;
}
Now our text will turn red. You can define any color code your want or choose one of the 16 standard color names.
|
- 9). What is a web designer anyway? By : Alicia Harper
As a web designer, I get all kinds of requests , for information other than web design, and as a web designer I'm not suppose to really to be able to do things outside of the web design area. I believe there are a few misconceptions about what exactly a web designer does. In this article I am going to nail down exactly what a web designer is and what they should be able to do.
|
- 10). Advanced Joomla Templating (pt1) Using Module Class Suffix By : Robert Palmer
an article from User Written Resources
1. duplicate the styles already used for the particular module, adding a suffix to each style name. this will definitely include some of the following;
1. .module {} 2. div.moduletable {} 3. div.moduletable h3 {} 4. table.moduletable {}/li> 5. table.moduletable th 6. table.moduletable td
and can include other styles used on the content in that section, such as;
1.
|
|
|
