{"id":21747,"date":"2013-04-02T09:16:17","date_gmt":"2013-04-02T16:16:17","guid":{"rendered":"http:\/\/content26.com\/?p=18493"},"modified":"2017-02-21T15:05:39","modified_gmt":"2017-02-21T23:05:39","slug":"brian-casel-content-first-layout-second-3","status":"publish","type":"post","link":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/","title":{"rendered":"Brian Casel: Content First, Layout Second"},"content":{"rendered":"<p><img loading=\"lazy\" class=\" wp-image-18502 alignright\" src=\"http:\/\/content26.com\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.121.jpg\" alt=\"Brian-Casel-10.12\" width=\"175\" height=\"184\" srcset=\"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.121.jpg 309w, https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.121-286x300.jpg 286w, https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.121-300x314.jpg 300w\" sizes=\"(max-width: 175px) 100vw, 175px\" \/><\/p>\n<p><em>Brian Casel, a freelance web designer, is a strong proponent of responsive design. Responsive web design <em>relies on media queries to figure out what resolution a screen is and\u00a0<\/em>uses fluid grids and flexible images to scale a website to that screen. Too much tech speak? Basically, responsive web design is an alternative to having a separate site for every device, and aims to adjust a site to the screen sizes of varying devices to maintain good user experience.<\/em><\/p>\n<p><em>Brian took a break from his latest project, <a href=\"https:\/\/www.sweetprocess.com\/\" target=\"_blank\">SweetProcess<\/a>, to answer a few questions for me about responsive design and how businesses should be thinking about their mobile presence.<\/em><\/p>\n<hr \/>\n<h2>&#8220;Don&#8217;t Underestimate a Top-Notch User Experience&#8221;<\/h2>\n<p><strong>content26<\/strong>: How closely entwined do you think content creation and web design should be? Why?<\/p>\n<p><strong>Brian Casel<\/strong>: My personal approach is to tackle content creation and design simultaneously. I&#8217;m a strong proponent of writing the copy while you design. The messaging is just as important as the font, color, style, and layout decisions. This is why I strongly believe that web designers should hone not just their design skills, but their copywriting and information architecture skills as well. It&#8217;s all connected.<\/p>\n<div class=\"calloutRight\">\n<p><span class=\"open\">\u201c<\/span>The design should support the content and allow it to adapt to any medium.<\/div>\n<p><strong>content26<\/strong>:\u00a0You talk a lot about responsive design. Do you think it is always a better option for businesses than building a separate mobile site?<\/p>\n<p><strong>Brian Casel<\/strong>:\u00a0If the decision has been made that having a mobile site is necessary, then yes, in most cases, I think responsive design is the way to go. There are a few advantages of responsive over the alternative methods. Responsive is all one website, so it can be updated in one central location; responsive adapts to any screen size, any device, even future devices that haven&#8217;t come out yet, so it is future-proof.<\/p>\n<p>And these days, there are so many web design frameworks that make responsive design even easier that it&#8217;s almost a no-brainer. My personal favorite is the <strong>Twitter<\/strong> Bootstrap framework, which is fully responsive.<\/p>\n<p><strong>content26<\/strong>:\u00a0How can businesses best prepare content for mobile use?<\/p>\n<p><strong>Brian Casel<\/strong>:\u00a0Almost any content or message can be presented elegantly in both desktop and mobile formats. It&#8217;s important to think about the message\/content first, and the layout second.<\/p>\n<p>Remember that the content will take on a variety of layouts and formats as it is viewed on different screens and devices. Don&#8217;t let the content dictate how the page design should be. The design should support the content and allow it to adapt to any medium.<\/p>\n<p><strong>content26<\/strong>:\u00a0What do you see as the biggest challenge companies that sell products online face regarding the rise of connected devices?<\/p>\n<p><strong>Brian Casel<\/strong>:\u00a0I think we&#8217;re still in a period where most businesses are scrambling to make sure their websites are updated and revamped to keep up with where the web is going\u2014mobile.<\/p>\n<p>The question most businesses are facing is whether or not to invest in a website redesign that includes mobile optimization. Mobile optimization may cost a bit more (it depends), but it&#8217;s a very smart investment, particularly if you go the responsive approach, because this ensures maximum compatibility across all devices.<\/p>\n<div class=\"calloutLeft\">\n<p><span class=\"open\">\u201c<\/span>Even if only a small portion of your product sales come via your website, you can bet that a large majority of your customers look to your website to research you before making a buying decision.<\/p>\n<\/div>\n<p><strong>content26<\/strong>:\u00a0And how should they meet that challenge?<\/p>\n<p><strong>Brian Casel<\/strong>:\u00a0Don&#8217;t underestimate the importance of having a top-notch user experience on your website, from desktop to tablet to mobile. Even if only a small portion of your product sales come via your website, you can bet that a large majority of your customers look to your website to research you before making a buying decision. Make it easy on them and ensure they can read, navigate, browse, and access everything your website has to offer, no matter which device they&#8217;re on.<\/p>\n<p><span style=\"text-decoration: underline;\"><em><strong>Brian Casel<\/strong><\/em><\/span><\/p>\n<p><em>Brian Casel is a web designer and founder of a few online products and services. To see his latest projects and read his blog, visit\u00a0<a href=\"http:\/\/casjam.com\/\" target=\"_blank\">casjam.com<\/a>. Connect with Brian on Twitter @CasJam.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Brian Casel, a freelance web designer, is a strong proponent of responsive design. Responsive web design relies on media queries&#8230;<\/p>\n","protected":false},"author":28,"featured_media":18498,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[789],"tags":[909,859,563,1082,1065],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v18.0 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"description\" content=\"Brian Casel: Content First, Layout Second\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Brian Casel: Content First, Layout Second | content26\" \/>\n<meta property=\"og:description\" content=\"Brian Casel: Content First, Layout Second\" \/>\n<meta property=\"og:url\" content=\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/\" \/>\n<meta property=\"og:site_name\" content=\"content26\" \/>\n<meta property=\"article:published_time\" content=\"2013-04-02T16:16:17+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-02-21T23:05:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"350\" \/>\n\t<meta property=\"og:image:height\" content=\"351\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Augustin Kendall\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/#organization\",\"name\":\"content26\",\"url\":\"https:\/\/987654321.space\/c26_dev\/\",\"sameAs\":[],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/#logo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/content26.com\/wp-content\/uploads\/content26-logo-274px.png\",\"contentUrl\":\"https:\/\/content26.com\/wp-content\/uploads\/content26-logo-274px.png\",\"width\":274,\"height\":63,\"caption\":\"content26\"},\"image\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/#website\",\"url\":\"https:\/\/987654321.space\/c26_dev\/\",\"name\":\"content26\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/987654321.space\/c26_dev\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg\",\"contentUrl\":\"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg\",\"width\":350,\"height\":351},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#webpage\",\"url\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/\",\"name\":\"Brian Casel: Content First, Layout Second | content26\",\"isPartOf\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#primaryimage\"},\"datePublished\":\"2013-04-02T16:16:17+00:00\",\"dateModified\":\"2017-02-21T23:05:39+00:00\",\"description\":\"Brian Casel: Content First, Layout Second\",\"breadcrumb\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Brian Casel: Content First, Layout Second\"}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#webpage\"},\"author\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/#\/schema\/person\/383124e145292afb5bc0fbc0a6f034ba\"},\"headline\":\"Brian Casel: Content First, Layout Second\",\"datePublished\":\"2013-04-02T16:16:17+00:00\",\"dateModified\":\"2017-02-21T23:05:39+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#webpage\"},\"wordCount\":700,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/#organization\"},\"image\":{\"@id\":\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg\",\"keywords\":[\"Content Strategy\",\"Interview\",\"Mobile\",\"Responsive Design\",\"User Experience\"],\"articleSection\":[\"Blog\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/#\/schema\/person\/383124e145292afb5bc0fbc0a6f034ba\",\"name\":\"Augustin Kendall\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/987654321.space\/c26_dev\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/461c08754b41839a0a90364db5849485?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/461c08754b41839a0a90364db5849485?s=96&d=mm&r=g\",\"caption\":\"Augustin Kendall\"},\"description\":\"Augustin joined content26 in 2011 and currently serves as the blog\u2019s managing editor. He likes to examine the descriptive elements of prescriptive grammar, enforce sometimes-arbitrary style requirements, and cook.\",\"url\":\"https:\/\/987654321.space\/c26_dev\/blog\/author\/augustin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"description":"Brian Casel: Content First, Layout Second","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:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/","og_locale":"en_US","og_type":"article","og_title":"Brian Casel: Content First, Layout Second | content26","og_description":"Brian Casel: Content First, Layout Second","og_url":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/","og_site_name":"content26","article_published_time":"2013-04-02T16:16:17+00:00","article_modified_time":"2017-02-21T23:05:39+00:00","og_image":[{"width":350,"height":351,"url":"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg","type":"image\/jpeg"}],"twitter_misc":{"Written by":"Augustin Kendall","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Organization","@id":"https:\/\/987654321.space\/c26_dev\/#organization","name":"content26","url":"https:\/\/987654321.space\/c26_dev\/","sameAs":[],"logo":{"@type":"ImageObject","@id":"https:\/\/987654321.space\/c26_dev\/#logo","inLanguage":"en-US","url":"https:\/\/content26.com\/wp-content\/uploads\/content26-logo-274px.png","contentUrl":"https:\/\/content26.com\/wp-content\/uploads\/content26-logo-274px.png","width":274,"height":63,"caption":"content26"},"image":{"@id":"https:\/\/987654321.space\/c26_dev\/#logo"}},{"@type":"WebSite","@id":"https:\/\/987654321.space\/c26_dev\/#website","url":"https:\/\/987654321.space\/c26_dev\/","name":"content26","description":"","publisher":{"@id":"https:\/\/987654321.space\/c26_dev\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/987654321.space\/c26_dev\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#primaryimage","inLanguage":"en-US","url":"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg","contentUrl":"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg","width":350,"height":351},{"@type":"WebPage","@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#webpage","url":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/","name":"Brian Casel: Content First, Layout Second | content26","isPartOf":{"@id":"https:\/\/987654321.space\/c26_dev\/#website"},"primaryImageOfPage":{"@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#primaryimage"},"datePublished":"2013-04-02T16:16:17+00:00","dateModified":"2017-02-21T23:05:39+00:00","description":"Brian Casel: Content First, Layout Second","breadcrumb":{"@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Brian Casel: Content First, Layout Second"}]},{"@type":"Article","@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#article","isPartOf":{"@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#webpage"},"author":{"@id":"https:\/\/987654321.space\/c26_dev\/#\/schema\/person\/383124e145292afb5bc0fbc0a6f034ba"},"headline":"Brian Casel: Content First, Layout Second","datePublished":"2013-04-02T16:16:17+00:00","dateModified":"2017-02-21T23:05:39+00:00","mainEntityOfPage":{"@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#webpage"},"wordCount":700,"commentCount":0,"publisher":{"@id":"https:\/\/987654321.space\/c26_dev\/#organization"},"image":{"@id":"https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#primaryimage"},"thumbnailUrl":"https:\/\/987654321.space\/c26_dev\/wp-content\/uploads\/2013\/03\/Brian-Casel-10.12.jpg","keywords":["Content Strategy","Interview","Mobile","Responsive Design","User Experience"],"articleSection":["Blog"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/987654321.space\/c26_dev\/blog\/brian-casel-content-first-layout-second-3\/#respond"]}]},{"@type":"Person","@id":"https:\/\/987654321.space\/c26_dev\/#\/schema\/person\/383124e145292afb5bc0fbc0a6f034ba","name":"Augustin Kendall","image":{"@type":"ImageObject","@id":"https:\/\/987654321.space\/c26_dev\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/461c08754b41839a0a90364db5849485?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/461c08754b41839a0a90364db5849485?s=96&d=mm&r=g","caption":"Augustin Kendall"},"description":"Augustin joined content26 in 2011 and currently serves as the blog\u2019s managing editor. He likes to examine the descriptive elements of prescriptive grammar, enforce sometimes-arbitrary style requirements, and cook.","url":"https:\/\/987654321.space\/c26_dev\/blog\/author\/augustin\/"}]}},"_links":{"self":[{"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/posts\/21747"}],"collection":[{"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/users\/28"}],"replies":[{"embeddable":true,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/comments?post=21747"}],"version-history":[{"count":7,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/posts\/21747\/revisions"}],"predecessor-version":[{"id":29575,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/posts\/21747\/revisions\/29575"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/media\/18498"}],"wp:attachment":[{"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/media?parent=21747"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/categories?post=21747"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/987654321.space\/c26_dev\/wp-json\/wp\/v2\/tags?post=21747"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}