{"id":1562,"date":"2010-08-04T05:10:51","date_gmt":"2010-08-04T09:10:51","guid":{"rendered":"http:\/\/www.mccordweb.com\/weblogs\/?p=1562"},"modified":"2010-05-21T15:12:20","modified_gmt":"2010-05-21T19:12:20","slug":"three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed","status":"publish","type":"post","link":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/","title":{"rendered":"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed"},"content":{"rendered":"<p>Nancy McCord is still in Russia. She will be back to blogging on August 16th. This is one of her previously published articles.<\/p>\n<p>There are three web design layout types. Use our information below to find out which one you want to use.<\/p>\n<p><strong>Liquid Layout<\/strong><\/p>\n<p>This layout style resizes to fill your browser screen regardless of your screen resolution.<\/p>\n<p><strong>Fixed Layout<\/strong><\/p>\n<p>This is the most popular layout style on the Web. It is a fixed size determined by the web designer. It gives excellent graphics control but may make your website appear dated as larger screen sizes become more popular.<\/p>\n<p><strong>Elastic Layout<\/strong><\/p>\n<p>This is a new design layout. One that resizes based on on screen resolution but rather resizes based on the font size that your viewer selects to view your site.<\/p>\n<p>To complicate things even further there a wide variety of hybrid layouts that are popular on the Web. Some are:<\/p>\n<ul>\n<li>liquid content section with elastic left and right sidebars<\/li>\n<li>fixed side bars with an elastic content section<\/li>\n<li>fixed side bars with a liquid content section<\/li>\n<\/ul>\n<p>My own business site is currently done as a fixed layout. I am currently in the early stages of redesign and am leaning toward a liquid content block with elastic sidebars with padding around the whole container.<\/p>\n<p>Choosing the layout style for your website is best not left to the novice but to the web design professional who can discuss which option is best for your viewing client\u00e8le and type of content you will be displaying on your website.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Nancy McCord is still in Russia. She will be back to blogging on August 16th. This is one of her previously published articles. There are three web design layout types. Use our information below to find out which one you want to use. Liquid Layout This layout style resizes to fill your browser screen regardless of your screen resolution. Fixed Layout This is the most popular layout style on the Web. It is a fixed size determined by the web designer. It gives excellent graphics control but may make your website appear dated as larger screen sizes become more popular. Elastic Layout This is a new design layout. One that resizes based on on screen resolution but rather resizes based on the font size that your viewer selects to view your site. To complicate things even further there a wide variety of hybrid layouts that are popular on the Web. Some are: liquid content section with elastic left and right sidebars fixed side bars with an elastic content section fixed side bars with a liquid content section My own business site is currently done as a fixed layout. I am currently in the early stages of redesign and am leaning toward a liquid content block with elastic sidebars with padding around the whole container. Choosing the layout style for your website is best not left to the novice but to the web design professional who can discuss which option is best for your viewing client\u00e8le and type of content you will be displaying on your website.<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[435],"class_list":["post-1562","post","type-post","status-publish","format-standard","hentry","category-web-design","tag-web-design"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed  | The Web Authority<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-\u2013-liquid-elastic-fixed\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed  | The Web Authority\" \/>\n<meta property=\"og:description\" content=\"Nancy McCord is still in Russia. She will be back to blogging on August 16th. This is one of her previously published articles. There are three web design layout types. Use our information below to find out which one you want to use. Liquid Layout This layout style resizes to fill your browser screen regardless of your screen resolution. Fixed Layout This is the most popular layout style on the Web. It is a fixed size determined by the web designer. It gives excellent graphics control but may make your website appear dated as larger screen sizes become more popular. Elastic Layout This is a new design layout. One that resizes based on on screen resolution but rather resizes based on the font size that your viewer selects to view your site. To complicate things even further there a wide variety of hybrid layouts that are popular on the Web. Some are: liquid content section with elastic left and right sidebars fixed side bars with an elastic content section fixed side bars with a liquid content section My own business site is currently done as a fixed layout. I am currently in the early stages of redesign and am leaning toward a liquid content block with elastic sidebars with padding around the whole container. Choosing the layout style for your website is best not left to the novice but to the web design professional who can discuss which option is best for your viewing client\u00e8le and type of content you will be displaying on your website.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-\u2013-liquid-elastic-fixed\/\" \/>\n<meta property=\"og:site_name\" content=\"The Web Authority\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/mccordweb\" \/>\n<meta property=\"article:published_time\" content=\"2010-08-04T09:10:51+00:00\" \/>\n<meta name=\"author\" content=\"Nancy McCord\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@mccordweb\" \/>\n<meta name=\"twitter:site\" content=\"@mccordweb\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nancy McCord\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/\"},\"author\":{\"name\":\"Nancy McCord\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#\\\/schema\\\/person\\\/7499f3ac0b008bc0e5b7a138ac1dc0ba\"},\"headline\":\"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed\",\"datePublished\":\"2010-08-04T09:10:51+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/\"},\"wordCount\":265,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#organization\"},\"keywords\":[\"Web Design\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/\",\"url\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/\",\"name\":\"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed | The Web Authority\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#website\"},\"datePublished\":\"2010-08-04T09:10:51+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/2010\\\/08\\\/04\\\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#website\",\"url\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/\",\"name\":\"The Web Authority | McCord Web Services News\\\/Blog\",\"description\":\"Smart Digital Marketing, Real Business Results - McCord Web Services\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#organization\",\"name\":\"McCord Web Services LLC\",\"url\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/wp-content\\\/uploads\\\/2025\\\/09\\\/McCord-Web-White-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/wp-content\\\/uploads\\\/2025\\\/09\\\/McCord-Web-White-logo.png\",\"width\":450,\"height\":203,\"caption\":\"McCord Web Services LLC\"},\"image\":{\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/mccordweb\",\"https:\\\/\\\/x.com\\\/mccordweb\",\"https:\\\/\\\/www.instagram.com\\\/nancy_mccord\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/nancymccord\",\"https:\\\/\\\/www.youtube.com\\\/user\\\/mccordweb\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.mccordweb.com\\\/weblogs\\\/#\\\/schema\\\/person\\\/7499f3ac0b008bc0e5b7a138ac1dc0ba\",\"name\":\"Nancy McCord\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/84f303fb7bc8bf9e3aa944d8a2b0913642ca2c0cb4e244d9bbea83c59dac189e?s=96&d=blank&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/84f303fb7bc8bf9e3aa944d8a2b0913642ca2c0cb4e244d9bbea83c59dac189e?s=96&d=blank&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/84f303fb7bc8bf9e3aa944d8a2b0913642ca2c0cb4e244d9bbea83c59dac189e?s=96&d=blank&r=g\",\"caption\":\"Nancy McCord\"},\"sameAs\":[\"http:\\\/\\\/www.mccordweb.com\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed  | The Web Authority","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-\u2013-liquid-elastic-fixed\/","og_locale":"en_US","og_type":"article","og_title":"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed  | The Web Authority","og_description":"Nancy McCord is still in Russia. She will be back to blogging on August 16th. This is one of her previously published articles. There are three web design layout types. Use our information below to find out which one you want to use. Liquid Layout This layout style resizes to fill your browser screen regardless of your screen resolution. Fixed Layout This is the most popular layout style on the Web. It is a fixed size determined by the web designer. It gives excellent graphics control but may make your website appear dated as larger screen sizes become more popular. Elastic Layout This is a new design layout. One that resizes based on on screen resolution but rather resizes based on the font size that your viewer selects to view your site. To complicate things even further there a wide variety of hybrid layouts that are popular on the Web. Some are: liquid content section with elastic left and right sidebars fixed side bars with an elastic content section fixed side bars with a liquid content section My own business site is currently done as a fixed layout. I am currently in the early stages of redesign and am leaning toward a liquid content block with elastic sidebars with padding around the whole container. Choosing the layout style for your website is best not left to the novice but to the web design professional who can discuss which option is best for your viewing client\u00e8le and type of content you will be displaying on your website.","og_url":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-\u2013-liquid-elastic-fixed\/","og_site_name":"The Web Authority","article_publisher":"https:\/\/www.facebook.com\/mccordweb","article_published_time":"2010-08-04T09:10:51+00:00","author":"Nancy McCord","twitter_card":"summary_large_image","twitter_creator":"@mccordweb","twitter_site":"@mccordweb","twitter_misc":{"Written by":"Nancy McCord","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/#article","isPartOf":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/"},"author":{"name":"Nancy McCord","@id":"https:\/\/www.mccordweb.com\/weblogs\/#\/schema\/person\/7499f3ac0b008bc0e5b7a138ac1dc0ba"},"headline":"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed","datePublished":"2010-08-04T09:10:51+00:00","mainEntityOfPage":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/"},"wordCount":265,"commentCount":1,"publisher":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/#organization"},"keywords":["Web Design"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/","url":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/","name":"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed | The Web Authority","isPartOf":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/#website"},"datePublished":"2010-08-04T09:10:51+00:00","breadcrumb":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.mccordweb.com\/weblogs\/2010\/08\/04\/three-web-design-layout-types-%e2%80%93-liquid-elastic-fixed\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.mccordweb.com\/weblogs\/"},{"@type":"ListItem","position":2,"name":"Three Web Design Layout Types \u2013 Liquid, Elastic, Fixed"}]},{"@type":"WebSite","@id":"https:\/\/www.mccordweb.com\/weblogs\/#website","url":"https:\/\/www.mccordweb.com\/weblogs\/","name":"The Web Authority | McCord Web Services News\/Blog","description":"Smart Digital Marketing, Real Business Results - McCord Web Services","publisher":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.mccordweb.com\/weblogs\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.mccordweb.com\/weblogs\/#organization","name":"McCord Web Services LLC","url":"https:\/\/www.mccordweb.com\/weblogs\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.mccordweb.com\/weblogs\/#\/schema\/logo\/image\/","url":"https:\/\/www.mccordweb.com\/weblogs\/wp-content\/uploads\/2025\/09\/McCord-Web-White-logo.png","contentUrl":"https:\/\/www.mccordweb.com\/weblogs\/wp-content\/uploads\/2025\/09\/McCord-Web-White-logo.png","width":450,"height":203,"caption":"McCord Web Services LLC"},"image":{"@id":"https:\/\/www.mccordweb.com\/weblogs\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/mccordweb","https:\/\/x.com\/mccordweb","https:\/\/www.instagram.com\/nancy_mccord\/","https:\/\/www.linkedin.com\/in\/nancymccord","https:\/\/www.youtube.com\/user\/mccordweb"]},{"@type":"Person","@id":"https:\/\/www.mccordweb.com\/weblogs\/#\/schema\/person\/7499f3ac0b008bc0e5b7a138ac1dc0ba","name":"Nancy McCord","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/84f303fb7bc8bf9e3aa944d8a2b0913642ca2c0cb4e244d9bbea83c59dac189e?s=96&d=blank&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/84f303fb7bc8bf9e3aa944d8a2b0913642ca2c0cb4e244d9bbea83c59dac189e?s=96&d=blank&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/84f303fb7bc8bf9e3aa944d8a2b0913642ca2c0cb4e244d9bbea83c59dac189e?s=96&d=blank&r=g","caption":"Nancy McCord"},"sameAs":["http:\/\/www.mccordweb.com"]}]}},"_links":{"self":[{"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/posts\/1562","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/comments?post=1562"}],"version-history":[{"count":1,"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/posts\/1562\/revisions"}],"predecessor-version":[{"id":1563,"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/posts\/1562\/revisions\/1563"}],"wp:attachment":[{"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/media?parent=1562"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/categories?post=1562"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mccordweb.com\/weblogs\/wp-json\/wp\/v2\/tags?post=1562"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}