{"id":2360,"date":"2020-11-17T11:27:24","date_gmt":"2020-11-17T19:27:24","guid":{"rendered":"https:\/\/www.lightsondata.com\/?post_type=tva_lesson&#038;p=2360"},"modified":"2020-12-01T15:15:58","modified_gmt":"2020-12-01T23:15:58","slug":"layout","status":"publish","type":"tva_lesson","link":"https:\/\/www.lightsondata.com\/course\/layout\/","title":{"rendered":"Layout"},"content":{"rendered":"<h2>Inverted Pyramid Journalism Style<\/h2>\n<p><span><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2478\" data-permalink=\"https:\/\/www.lightsondata.com\/pyramid\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1479%2C1017&amp;ssl=1\" data-orig-size=\"1479,1017\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"pyramid\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=300%2C206&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1024%2C704&amp;ssl=1\" alt=\"\" data-id=\"2478\" width=\"367\" data-init-width=\"1479\" height=\"253\" data-init-height=\"1017\" title=\"pyramid\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?resize=367%2C253&#038;ssl=1\" data-width=\"367\" data-height=\"253\" data-lazy-src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?ssl=1\"><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2478\" data-permalink=\"https:\/\/www.lightsondata.com\/pyramid\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1479%2C1017&amp;ssl=1\" data-orig-size=\"1479,1017\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"pyramid\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=300%2C206&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1024%2C704&amp;ssl=1\" alt=\"\" data-id=\"2478\" width=\"367\" data-init-width=\"1479\" height=\"253\" data-init-height=\"1017\" title=\"pyramid\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?resize=367%2C253&#038;ssl=1\" data-width=\"367\" data-height=\"253\"><\/span><span><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2477\" data-permalink=\"https:\/\/www.lightsondata.com\/pyramid-2\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?fit=654%2C554&amp;ssl=1\" data-orig-size=\"654,554\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"pyramid 2\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?fit=300%2C254&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?fit=654%2C554&amp;ssl=1\" alt=\"\" data-id=\"2477\" width=\"367\" data-init-width=\"654\" height=\"311\" data-init-height=\"554\" title=\"pyramid 2\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?resize=367%2C311&#038;ssl=1\" data-width=\"367\" data-height=\"311\" data-lazy-src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?ssl=1\"><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2477\" data-permalink=\"https:\/\/www.lightsondata.com\/pyramid-2\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?fit=654%2C554&amp;ssl=1\" data-orig-size=\"654,554\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"pyramid 2\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?fit=300%2C254&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?fit=654%2C554&amp;ssl=1\" alt=\"\" data-id=\"2477\" width=\"367\" data-init-width=\"654\" height=\"311\" data-init-height=\"554\" title=\"pyramid 2\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid-2.jpeg?resize=367%2C311&#038;ssl=1\" data-width=\"367\" data-height=\"311\"><\/span><\/p>\n<p>Read more about it here: <a href=\"https:\/\/ohiostate.pressbooks.pub\/stratcommwriting\/chapter\/inverted-pyramid-style\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" style=\"outline: none;\">https:\/\/ohiostate.pressbooks.pub\/stratcommwriting\/chapter\/inverted-pyramid-style\/<\/a><\/p>\n<h2><\/h2>\n<h2>Data visualization examples<\/h2>\n<p>Here are some of the data visualization examples used in this lesson:<\/p>\n<ul>\n<li>The depth of the problem:&nbsp;<a href=\"http:\/\/apps.washingtonpost.com\/g\/page\/world\/the-depth-of-the-problem\/931\/?v=4ea2a3\" rel=\"nofollow noopener noreferrer\" target=\"_blank\" style=\"outline: none;\">http:\/\/apps.washingtonpost.com\/g\/page\/world\/the-depth-of-the-problem\/931\/?v=4ea2a3<\/a><\/li>\n<li>Over the hill: <a href=\"https:\/\/www.tableau.com\/solutions\/gallery\/over-hill\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" style=\"outline: none;\">https:\/\/www.tableau.com\/solutions\/gallery\/over-hill<\/a><\/li>\n<\/ul>\n<p>[tcb-noscript]<a href=\"https:\/\/www.tableau.com\/\"><img data-recalc-dims=\"1\" decoding=\"async\" alt=\" \" src=\"https:\/\/i0.wp.com\/public.tableau.com\/static\/images\/VG\/VGContest_OvertheHill_StevenWexler_600x650\/AreyouoverthehillintheUSA\/1_rss.png?ssl=1\" style=\"border: none\"><\/a>[\/tcb-noscript]                   [tcb-script type=&#8221;text\/javascript&#8221;]                    var divElement = document.getElementById(&#8216;viz1606444630554&#8217;);                    var vizElement = divElement.getElementsByTagName(&#8216;object&#8217;)[0];                    vizElement.style.width=&#8217;600px&#8217;;vizElement.style.height=&#8217;677px&#8217;;                    var scriptElement = document.createElement(&#8216;script&#8217;);                    scriptElement.src = &#8216;https:\/\/public.tableau.com\/javascripts\/api\/viz_v1.js&#8217;;                    vizElement.parentNode.insertBefore(scriptElement, vizElement);                [\/tcb-script]<\/p>\n<ul>\n<li>Tale of 100 entrepreneurs: <a href=\"https:\/\/www.tableau.com\/solutions\/gallery\/tale-100-entrepreneurs\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" style=\"outline: none;\">https:\/\/www.tableau.com\/solutions\/gallery\/tale-100-entrepreneurs<\/a><\/li>\n<\/ul>\n<p>[tcb-noscript]<a href=\"https:\/\/www.tableau.com\/\"><img data-recalc-dims=\"1\" decoding=\"async\" alt=\" \" src=\"https:\/\/i0.wp.com\/public.tableau.com\/static\/images\/Ta\/Tale-of-100-Entrepreneurs_10_0_0\/Taleof100Entrepreneurs\/1_rss.png?ssl=1\" style=\"border: none\"><\/a>[\/tcb-noscript]                   [tcb-script type=&#8221;text\/javascript&#8221;]                    var divElement = document.getElementById(&#8216;viz1606444720417&#8217;);                    var vizElement = divElement.getElementsByTagName(&#8216;object&#8217;)[0];                    if ( divElement.offsetWidth &gt; 800 ) { vizElement.style.width=&#8217;100%&#8217;;vizElement.style.height=(divElement.offsetWidth*0.75)+&#8217;px&#8217;;} else if ( divElement.offsetWidth &gt; 500 ) { vizElement.style.width=&#8217;100%&#8217;;vizElement.style.height=(divElement.offsetWidth*0.75)+&#8217;px&#8217;;} else { vizElement.style.width=&#8217;100%&#8217;;vizElement.style.height=&#8217;707px&#8217;;}                     var scriptElement = document.createElement(&#8216;script&#8217;);                    scriptElement.src = &#8216;https:\/\/public.tableau.com\/javascripts\/api\/viz_v1.js&#8217;;                    vizElement.parentNode.insertBefore(scriptElement, vizElement);                [\/tcb-script]<\/p>\n<h2>Other Layout Patterns<\/h2>\n<p><strong>Gutenberg<\/strong><\/p>\n<p>The Gutenberg diagram describes a general pattern the eyes move through when looking at evenly distributed information. The pattern applies to text-heavy content. Think pages in a novel or a newspaper. The pattern isn\u2019t meant o describe every possible design.<\/p>\n<p>The Gutenberg diagram divides the layout into 4 quadrants:<\/p>\n<p><span><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2641\" data-permalink=\"https:\/\/www.lightsondata.com\/gutenberg\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/gutenberg.jpg?fit=800%2C510&amp;ssl=1\" data-orig-size=\"800,510\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"gutenberg\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/gutenberg.jpg?fit=300%2C191&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/gutenberg.jpg?fit=800%2C510&amp;ssl=1\" alt=\"\" data-id=\"2641\" width=\"749\" data-init-width=\"800\" height=\"478\" data-init-height=\"510\" title=\"gutenberg\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/gutenberg.jpg?resize=749%2C478&#038;ssl=1\" data-width=\"749\" data-height=\"478\"><\/span><\/p>\n<ol>\n<li>Primary optical area located in the top\/left<\/li>\n<li>Strong fallow area located in the top\/right<\/li>\n<li>Weak fallow area located in the bottom\/left<\/li>\n<li>Terminal area located in the bottom\/right<\/li>\n<\/ol>\n<p><strong>Golden Triangle Pattern<\/strong><\/p>\n<p><span><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2643\" data-permalink=\"https:\/\/www.lightsondata.com\/golden\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/golden.jpg?fit=800%2C510&amp;ssl=1\" data-orig-size=\"800,510\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"golden\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/golden.jpg?fit=300%2C191&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/golden.jpg?fit=800%2C510&amp;ssl=1\" alt=\"\" data-id=\"2643\" width=\"749\" data-init-width=\"800\" height=\"478\" data-init-height=\"510\" title=\"golden\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/golden.jpg?resize=749%2C478&#038;ssl=1\" data-width=\"749\" data-height=\"478\"><\/span><\/p>\n<p>The z-pattern that we mentioned in the lesson also leads to the golden triangle pattern. If you take the first horizontal and first diagonal movement and then close the shape you end up with a right triangle whose right angle is the top\/left corner.<\/p>\n<p>This triangular area at the top of the page will be the area most seen and the pattern suggests your most important information needs to placed inside of it.<\/p>\n<p><strong>F-Pattern<\/strong><\/p>\n<p><span><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2642\" data-permalink=\"https:\/\/www.lightsondata.com\/f-layout\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-layout.jpg?fit=800%2C510&amp;ssl=1\" data-orig-size=\"800,510\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"f-layout\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-layout.jpg?fit=300%2C191&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-layout.jpg?fit=800%2C510&amp;ssl=1\" alt=\"\" data-id=\"2642\" width=\"749\" data-init-width=\"800\" height=\"478\" data-init-height=\"510\" title=\"f-layout\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-layout.jpg?resize=749%2C478&#038;ssl=1\" data-width=\"749\" data-height=\"478\"><\/span><\/p>\n<p>According to different studies, including the publications by Nielsen Norman Group as one of the pioneers of this field, the F-pattern is referred to as the most common eye-scanning pattern, especially for mediums with a big amount of content. Examples would include web pages from blogs and news platforms.&nbsp;<\/p>\n<p>As we can see from the heatmap below generated with the usage of eye-tracking software, these web pages reveal that the reader consumes the information in a pattern resembling the letter F.<\/p>\n<p><span><img data-recalc-dims=\"1\" decoding=\"async\" data-attachment-id=\"2644\" data-permalink=\"https:\/\/www.lightsondata.com\/f-web\/\" data-orig-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-web.png?fit=730%2C338&amp;ssl=1\" data-orig-size=\"730,338\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}\" data-image-title=\"f web\" data-image-description=\"\" data-image-caption=\"\" data-medium-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-web.png?fit=300%2C139&amp;ssl=1\" data-large-file=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-web.png?fit=730%2C338&amp;ssl=1\" alt=\"\" data-id=\"2644\" width=\"730\" data-init-width=\"730\" height=\"338\" data-init-height=\"338\" title=\"f web\" loading=\"lazy\" src=\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/12\/f-web.png?resize=730%2C338&#038;ssl=1\" data-width=\"730\" data-height=\"338\"><\/span><\/p>\n<p>Some key takeaways from the F-pattern:<\/p>\n<ul>\n<li>Important information should be placed across the top of the design where it will generally be read as that first line of text seems to be read the most<\/li>\n<li>The reader scans down the left side of webpage until they find something interesting and then reads that across to the right<\/li>\n<li>People don\u2019t read online, but rather they scan it until they find something that draws their attention (pre-attentive attributes can definitely aid with that)<\/li>\n<\/ul>\n<h2>Stats on phone layout<\/h2>\n<ul>\n<li>&#8220;Most smartphones are used in portrait orientation, with the most popular size (6 to 6.5\u201d) &#8216;showing 91% portrait usage.&#8221; &#8211; read more on <a href=\"https:\/\/www.scientiamobile.com\/smartphone-vs-tablet-orientation-whos-using-what\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" style=\"outline: none;\">ScientiaMobile.com<\/a><\/li>\n<li>&#8220;&#8230;the larger the device, the more likely it is to be initially held in landscape orientation&#8221;&nbsp;&#8211; read more on&nbsp;<a href=\"https:\/\/www.scientiamobile.com\/how-do-mobile-video-viewers-hold-their-phone\/\" rel=\"nofollow noopener noreferrer\" target=\"_blank\" style=\"outline: none;\">ScientiaMobile.com<\/a><\/li>\n<li>&#8220;You can see from their field-based observations that 60% of phone and tablet users use their devices in portrait mode&#8221; &#8211; read more on <a href=\"http:\/\/wainscotmedia.com\/blog\/what-does-the-data-say-about-your-readers-mobile-habits\" target=\"_blank\" rel=\"nofollow noopener noreferrer\" style=\"outline: none;\">WainScotMedia.com<\/a><\/li>\n<\/ul>\n","protected":false},"template":"","class_list":["post-2360","tva_lesson","type-tva_lesson","status-publish","hentry","tva_courses-data-visualization-for-data-storytelling","post-wrapper","thrv_wrapper"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v26.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>LightsOnData<\/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.lightsondata.com\/course\/layout\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Layout | LightsOnData\" \/>\n<meta property=\"og:description\" content=\"Layout considerations and an overview of the inverted pyramid and Z layout patterns.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.lightsondata.com\/course\/layout\/\" \/>\n<meta property=\"og:site_name\" content=\"LightsOnData\" \/>\n<meta property=\"article:modified_time\" content=\"2020-12-01T23:15:58+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@georgefirican\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.lightsondata.com\/course\/layout\/\",\"url\":\"https:\/\/www.lightsondata.com\/course\/layout\/\",\"name\":\"Layout | LightsOnData\",\"isPartOf\":{\"@id\":\"https:\/\/www.lightsondata.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.lightsondata.com\/course\/layout\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.lightsondata.com\/course\/layout\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png\",\"datePublished\":\"2020-11-17T19:27:24+00:00\",\"dateModified\":\"2020-12-01T23:15:58+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/www.lightsondata.com\/course\/layout\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.lightsondata.com\/course\/layout\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.lightsondata.com\/course\/layout\/#primaryimage\",\"url\":\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1479%2C1017&ssl=1\",\"contentUrl\":\"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1479%2C1017&ssl=1\",\"width\":1479,\"height\":1017},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.lightsondata.com\/course\/layout\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.lightsondata.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Foundations of Data Visualization\",\"item\":\"https:\/\/www.lightsondata.com\/chapter\/foundations-of-data-visualization\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Layout\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.lightsondata.com\/#website\",\"url\":\"https:\/\/www.lightsondata.com\/\",\"name\":\"LightsOnData\",\"description\":\"Practical resources, online courses, free articles and videos for data management, data governance, data quality, and business intelligence\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.lightsondata.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"LightsOnData","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.lightsondata.com\/course\/layout\/","og_locale":"en_US","og_type":"article","og_title":"Layout | LightsOnData","og_description":"Layout considerations and an overview of the inverted pyramid and Z layout patterns.","og_url":"https:\/\/www.lightsondata.com\/course\/layout\/","og_site_name":"LightsOnData","article_modified_time":"2020-12-01T23:15:58+00:00","og_image":[{"url":"https:\/\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_site":"@georgefirican","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.lightsondata.com\/course\/layout\/","url":"https:\/\/www.lightsondata.com\/course\/layout\/","name":"Layout | LightsOnData","isPartOf":{"@id":"https:\/\/www.lightsondata.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.lightsondata.com\/course\/layout\/#primaryimage"},"image":{"@id":"https:\/\/www.lightsondata.com\/course\/layout\/#primaryimage"},"thumbnailUrl":"https:\/\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png","datePublished":"2020-11-17T19:27:24+00:00","dateModified":"2020-12-01T23:15:58+00:00","breadcrumb":{"@id":"https:\/\/www.lightsondata.com\/course\/layout\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.lightsondata.com\/course\/layout\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.lightsondata.com\/course\/layout\/#primaryimage","url":"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1479%2C1017&ssl=1","contentUrl":"https:\/\/i0.wp.com\/www.lightsondata.com\/wp-content\/uploads\/2020\/11\/pyramid.png?fit=1479%2C1017&ssl=1","width":1479,"height":1017},{"@type":"BreadcrumbList","@id":"https:\/\/www.lightsondata.com\/course\/layout\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.lightsondata.com\/"},{"@type":"ListItem","position":2,"name":"Foundations of Data Visualization","item":"https:\/\/www.lightsondata.com\/chapter\/foundations-of-data-visualization\/"},{"@type":"ListItem","position":3,"name":"Layout"}]},{"@type":"WebSite","@id":"https:\/\/www.lightsondata.com\/#website","url":"https:\/\/www.lightsondata.com\/","name":"LightsOnData","description":"Practical resources, online courses, free articles and videos for data management, data governance, data quality, and business intelligence","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.lightsondata.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.lightsondata.com\/wp-json\/wp\/v2\/tva_lesson\/2360","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.lightsondata.com\/wp-json\/wp\/v2\/tva_lesson"}],"about":[{"href":"https:\/\/www.lightsondata.com\/wp-json\/wp\/v2\/types\/tva_lesson"}],"wp:attachment":[{"href":"https:\/\/www.lightsondata.com\/wp-json\/wp\/v2\/media?parent=2360"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}