{"id":24945,"date":"2015-10-21T23:01:05","date_gmt":"2015-10-21T15:01:05","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=24945"},"modified":"2019-10-21T19:39:39","modified_gmt":"2019-10-21T11:39:39","slug":"foundation-6","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/","title":{"rendered":"Foundation 6 &#8211; 10 Amazing New Features"},"content":{"rendered":"<p>Developers of the <a href=\"https:\/\/get.foundation\/\" target=\"_blank\" rel=\"noopener noreferrer\">Foundation<\/a> front-end framework haven\u2019t just sat on their laurels while the Bootstrap team have been working on their impressive <a href=\"https:\/\/www.hongkiat.com\/blog\/boostrap-4-best-features\/\" target=\"_blank\" rel=\"noopener noreferrer\">new major release<\/a>. Last year they went on an awesome <a href=\"https:\/\/foundation.zurb.com\/forum\/posts\/1402-zurb-world-tour-map\" target=\"_blank\" rel=\"noopener noreferrer\">World Tour<\/a> to share their knowledge with their users and ask them about how they were using Foundation in their real-life work.<\/p>\n<p>After returning to their desks, they aggregated the needs and wishes of their users and embarked on planning the new major release of the framework: Foundation 6.<\/p>\n<p>It is still under development, but the plans are very promising. The coming features focus on 3 main areas: <strong>performance, customizability, and accessibility<\/strong>. Let\u2019s take a look at 10 of these features now.<\/p>\n<h2>1. Streamlined Workflow<\/h2>\n<p>Based on their users\u2019 experiences, the Foundation team developed a new slogan, namely <strong>\u201cPrototype to Production\u201d<\/strong>, for Foundation 6. This means a new, streamlined workflow that will allow designers and developers to <strong>go straight from prototype to production<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg\" alt=\"Prototype To Production\" width=\"700\" height=\"369\"><\/figure>\n<p>The goal of the new Foundation 6 is to provide a flexible, and easily customizable framework that makes it possible to <strong>write clean and semantic code from the very beginning<\/strong>. The current version, Foundation 5 also allows quick prototyping, but we can <strong>expect further workflow optimization<\/strong> in the coming release.<\/p>\n<h2>2. Simplified Setup Process for the Sass Version<\/h2>\n<p>One of the most awesome things about the Foundation framework is that it\u2019s built with the <a href=\"https:\/\/sass-lang.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Sass<\/a> stylesheet language, thus it\u2019s possible to <strong>quickly customize the default style rules to our actual needs<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/sass-version-of-foundation.jpg\" alt=\"Sass version of Foundation\" width=\"700\" height=\"423\"><\/figure>\n<p>The Sass setup process has been a bit intimidating for many users though, so the new major release will <strong>get a simplified setup process for the Sass version<\/strong>. This means that the Sass setup will <strong>require far fewer dependencies<\/strong> than before. Of course, if you prefer the vanilla CSS version, you can still opt for that.<\/p>\n<h2>3. A New, Souped Up Setup Stack for Maximalists<\/h2>\n<p>Besides the regular Sass version, Foundation 6 will come with a souped-up <strong>Sass version that will provide developers with powerful customization options<\/strong>.<\/p>\n<p><a href=\"https:\/\/zurb.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">ZURB<\/a>, the creator of Foundation will open their own development stack for the public, including their own <strong>static site generator<\/strong>, <strong>live-reload server<\/strong> and <strong>loads of inner optimization techniques<\/strong> including the integration of <a href=\"https:\/\/github.com\/uncss\/uncss\" target=\"_blank\" rel=\"noopener noreferrer\">UnCSS<\/a> for removing unused styles, and <a href=\"https:\/\/github.com\/mishoo\/UglifyJS\" target=\"_blank\" rel=\"noopener noreferrer\">UglifyJS<\/a> for JavaScript compression.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/zurb-internal-development.jpg\" alt=\"Zurb Internal Development\" width=\"700\" height=\"390\"><\/figure>\n<p>So basically we will be enabled to work in the same development environment that ZURB internally uses.<\/p>\n<h2>4. Decreased Page Load Time<\/h2>\n<p>The Foundation team had to face some <a href=\"https:\/\/corydowdy.com\/blog\/foundation-5-sass-and-grunt-uncss\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">constructive criticism<\/a> that claimed that in most Foundation projects, about 90% of the CSS code goes unused. This wasn\u2019t only true for Foundation, but also for other major <a href=\"https:\/\/github.com\/uncss\/grunt-uncss\" target=\"_blank\" rel=\"noopener noreferrer\">CSS frameworks<\/a> such as <a href=\"https:\/\/getbootstrap.com\/\" target=\"_blank\" rel=\"noopener noreferrer\"> Bootstrap<\/a> and <a href=\"http:\/\/topcoat.io\/\" target=\"_blank\" rel=\"noopener noreferrer\">TopCoat<\/a>.<\/p>\n<p>As part of their reply, Zurb decided to significantly cut the file size of the outputted CSS by implementing a roughly 40-50% code reduction.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/decreased-pageload.jpg\" alt=\"Decreased Page Load Time\" width=\"700\" height=\"700\"><\/figure>\n<p>It\u2019s interesting to note that they try to distinguish themselves from Bootstrap by <a href=\"https:\/\/zurb.com\/article\/1403\/foundation-6-prototype-to-production\" target=\"_blank\" rel=\"noopener noreferrer\">stating<\/a> \u201c<em>Foundation isn\u2019t a framework that will have stylistic classes margin and padding or round and radius<\/em>\u201c. (For reference see Bootstrap 4\u2019s new Utility Classes in <a href=\"https:\/\/www.hongkiat.com\/blog\/boostrap-4-best-features\/\" target=\"_blank\" rel=\"noopener noreferrer\">our previous post<\/a>).<\/p>\n<h2>5. Base Styles Acting as Wireframes<\/h2>\n<p>The other part of the performance improvement endeavor is to <strong>create a base style that acts as a wireframe instead of a final design<\/strong>. This primarily leads to a lighter theme but also has another big advantage.<\/p>\n<p>As more style rules will be moved into individual components, developers will have the chance to <strong>more easily style their design<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/wireframe.jpg\" alt=\"Base Styles as Wireframes\" width=\"700\" height=\"467\"><\/figure>\n<p>Hopefully, this means that sites based on Foundation will <strong>have less of a similar, standardized look<\/strong>, and designers will have more space to exp<strong>eriment with beautiful and unique solut<\/strong>ions that will refute recent <a href=\"https:\/\/www.hongkiat.com\/blog\/the-day-web-design-gets-boring\/\">worries about a boring-looking web<\/a>.<\/p>\n<h2>6. Facilitated Selective Import<\/h2>\n<p>Foundation 5 allows developers to only choose the components they want to use. Foundation 6 will take this endeavor to the next level by <strong>moving the selective import feature into the <a href=\"https:\/\/github.com\/foundation\/foundation-sites\/blob\/develop\/scss\/settings\/_settings.scss\" target=\"_blank\" rel=\"noopener noreferrer\">_settings.scss <\/a> Sass file.<\/strong><\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/selective-import.jpg\" alt=\"Facilitated Selective Import\" width=\"700\" height=\"352\"><\/figure>\n<p>This way _settings.scss will be a <strong>truly universal configuration file<\/strong>, as we won\u2019t only be able to customize features such as row width or default fonts with its help, but also easily <strong>opting out of the components we don\u2019t need<\/strong>. If we do so, we can achieve further performance improvement.<\/p>\n<h2>7. Leaner and Cleaner Sass<\/h2>\n<p>In the redesign process, the Foundation team rethought every aspect of the framework, so they also <strong>changed the way how they\u2019ve used the Sass stylesheet language<\/strong>.<\/p>\n<p>They found that in some<a href=\"https:\/\/zurb.com\/article\/1407\/foundation-6-leaner-meaner-and-cleaner-sa\" target=\"_blank\" rel=\"noopener noreferrer\">\u00a0cases<\/a> they\u2019ve overused Sass that lead to the <strong>unnecessary overcomplication of the CSS output<\/strong>. With the goal of a leaner and cleaner codebase in their mind, they have rationalized their Sass structure too.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/component-mixins.jpg\" alt=\"Component Mixins\" width=\"700\" height=\"352\"><\/figure>\n<p>In Foundation 6 we can <strong>expect decreased nesting and specificity, streamlined media queries<\/strong> (they merged repetitive code), and <strong>scaled back component mixins<\/strong>. The latter means that there will be fewer component mixins, and the remaining ones will have fewer parameters, which will lead to a simpler, and more logical code<\/p>\n<p>If you love mixins, don\u2019t worry, every component will still have them, it\u2019s just that they will be redesigned to be more efficient and useful than they currently are.<\/p>\n<h2>8. Improved Grid Mixins<\/h2>\n<p>While cutting back component mixins, Foundation 6 will come with <strong>enhanced grid mixins<\/strong> that will allow us to <strong>create a more customized grid<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/grid-mixins.jpg\" alt=\"Improved Grid Mixins\" width=\"700\" height=\"262\"><\/figure>\n<p>Zurb promises that we will be able to <strong>easily build as complicated grid systems<\/strong> as we want, including <strong>more sophisticated custom rows <\/strong>and<strong> nested grids<\/strong>, and the ability to convert the default classes to semantic markup. The improved grid mixins will make the current <strong>grid creation even more intuitive, flexible and faster<\/strong>.<\/p>\n<h2>9. Seamless Integration of Custom JavaScript Plugins<\/h2>\n<p>Foundation 5 currently has many JavaScript components such as cool modal dialogs, tooltips, sticky navigation bar, lightboxes, and many others that a modern website needs, but the coming major release will enable us to <strong>write our custom JavaScript plugins<\/strong> taking advantage of the Foundation core. It\u2019s a huge step forward in both <strong>user-friendliness and performance<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/clearing-plugin.jpg\" alt=\"Foundation's Clearing Plugin\" width=\"700\" height=\"417\"><\/figure>\n<p>In the future, we will be able to <strong>access the built-in initialization methods<\/strong>, <strong>toggle triggers <\/strong>and<strong> breakpoints<\/strong>, and make use of all the other features of Foundation\u2019s global JavaScript.<\/p>\n<h2>10. Full Accessibility<\/h2>\n<p>Probably the most amazing feature of the new Foundation 6 is that it will be fully <a href=\"https:\/\/www.hongkiat.com\/blog\/accessibility-design-needs\/\" target=\"_blank\" rel=\"noopener noreferrer\">accessible<\/a>. Every component and code snippet will come with the appropriate <a href=\"https:\/\/www.hongkiat.com\/blog\/aria-web-standards\/\" target=\"_blank\" rel=\"noopener noreferrer\">WAI-ARIA<\/a> attributes and landmark roles. Moreover, developers will even be <strong>provided with a user guide<\/strong> about <strong>how to use the a11y web standards<\/strong>.<\/p>\n<figure><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/full-accessibility.jpg\" alt=\"Full Accessibility\" width=\"700\" height=\"467\"><\/figure>\n<p>So if we want to provide our client with a fully accessible website, we don\u2019t need to do anything else than building our design with Foundation 6. Please note that we will still need to <strong>add the appropriate ARIA rules to our HTML pages on our own<\/strong>, although Zurb\u2019s coming a11y user guide will surely facilitate the learning process.<\/p>","protected":false},"excerpt":{"rendered":"<p>Developers of the Foundation front-end framework haven\u2019t just sat on their laurels while the Bootstrap team have been working on their impressive new major release. Last year they went on an awesome World Tour to share their knowledge with their users and ask them about how they were using Foundation in their real-life work. After&hellip;<\/p>\n","protected":false},"author":146,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[4528,1823],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v22.8 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Foundation 6 - 10 Amazing New Features - Hongkiat<\/title>\n<meta name=\"description\" content=\"Developers of the Foundation front-end framework haven&#039;t just sat on their laurels while the Bootstrap team have been working on their impressive new\" \/>\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.hongkiat.com\/blog\/foundation-6\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Foundation 6 - 10 Amazing New Features\" \/>\n<meta property=\"og:description\" content=\"Developers of the Foundation front-end framework haven&#039;t just sat on their laurels while the Bootstrap team have been working on their impressive new\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/foundation-6\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2015-10-21T15:01:05+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2019-10-21T11:39:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg\" \/>\n<meta name=\"author\" content=\"Anna Monus\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Anna Monus\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/\"},\"author\":{\"name\":\"Anna Monus\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/a601053a0ab457901e00cdc83bd5359e\"},\"headline\":\"Foundation 6 &#8211; 10 Amazing New Features\",\"datePublished\":\"2015-10-21T15:01:05+00:00\",\"dateModified\":\"2019-10-21T11:39:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/\"},\"wordCount\":1109,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/foundation-6\\\/prototype-to-production.jpg\",\"keywords\":[\"Foundation\",\"Frameworks\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/\",\"name\":\"Foundation 6 - 10 Amazing New Features - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/foundation-6\\\/prototype-to-production.jpg\",\"datePublished\":\"2015-10-21T15:01:05+00:00\",\"dateModified\":\"2019-10-21T11:39:39+00:00\",\"description\":\"Developers of the Foundation front-end framework haven't just sat on their laurels while the Bootstrap team have been working on their impressive new\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/foundation-6\\\/prototype-to-production.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/foundation-6\\\/prototype-to-production.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/foundation-6\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Foundation 6 &#8211; 10 Amazing New Features\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/a601053a0ab457901e00cdc83bd5359e\",\"name\":\"Anna Monus\",\"description\":\"Anna is Technical Editor and Writer for Hongkiat.com. She mainly covers front-end frameworks, web standards, accessibility, WordPress development, and UX design.\",\"sameAs\":[\"https:\\\/\\\/www.annalytic.com\\\/\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/anna_monus\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Foundation 6 - 10 Amazing New Features - Hongkiat","description":"Developers of the Foundation front-end framework haven't just sat on their laurels while the Bootstrap team have been working on their impressive new","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.hongkiat.com\/blog\/foundation-6\/","og_locale":"en_US","og_type":"article","og_title":"Foundation 6 - 10 Amazing New Features","og_description":"Developers of the Foundation front-end framework haven't just sat on their laurels while the Bootstrap team have been working on their impressive new","og_url":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2015-10-21T15:01:05+00:00","article_modified_time":"2019-10-21T11:39:39+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg","type":"","width":"","height":""}],"author":"Anna Monus","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Anna Monus","Est. reading time":"6 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/"},"author":{"name":"Anna Monus","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/a601053a0ab457901e00cdc83bd5359e"},"headline":"Foundation 6 &#8211; 10 Amazing New Features","datePublished":"2015-10-21T15:01:05+00:00","dateModified":"2019-10-21T11:39:39+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/"},"wordCount":1109,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg","keywords":["Foundation","Frameworks"],"articleSection":["Web Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/","url":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/","name":"Foundation 6 - 10 Amazing New Features - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg","datePublished":"2015-10-21T15:01:05+00:00","dateModified":"2019-10-21T11:39:39+00:00","description":"Developers of the Foundation front-end framework haven't just sat on their laurels while the Bootstrap team have been working on their impressive new","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/foundation-6\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/foundation-6\/prototype-to-production.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/foundation-6\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Foundation 6 &#8211; 10 Amazing New Features"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/a601053a0ab457901e00cdc83bd5359e","name":"Anna Monus","description":"Anna is Technical Editor and Writer for Hongkiat.com. She mainly covers front-end frameworks, web standards, accessibility, WordPress development, and UX design.","sameAs":["https:\/\/www.annalytic.com\/"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/anna_monus\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-6ul","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/24945","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/146"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=24945"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/24945\/revisions"}],"predecessor-version":[{"id":48916,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/24945\/revisions\/48916"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=24945"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=24945"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=24945"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=24945"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}