Ice, liquid and jello are different methods of doing page layout for websites.
By John Potter
Since screen resolutions (if you don’t know what screen resolution is visit this article) can vary different approaches to displaying content have been developed. A page using ice doesn’t change width based upon the width of your browser. It is usually just narrow enough to be viewed comfortably at the minimum resolution the designer picks or higher. The content of an ice design may be aligned left, right or centered and may move based on this if you change resolution, but it will remain the same width.
The next type I’ll describe is jello. A page with a jello layout has elements that stretch or adjust to the screen width while other elements remain fixed in width. Notice the left column is fixed in the example while the header and box on the right change. Any content of a jello design may be aligned left, right or centered and may move based on this if you change resolution. The content that is fixed in width will remain the same width even if it moves based on resolution.
The last type I’ll describe is Liquid. This is a design where all elements on the page move or stretch based on the screen width. If there is text in a box that stretches it will usually (there are exceptions) rewrap to match the new width. Photos and graphics generally cannot stretch unless they are done using Adobe Flash, but may change location.
There is no right or wrong, no better way, but they are options each with their own strengths and weaknesses.
I am honored to say that this article is used by Bentley University and Henderson Community College for instructional purposes.
