{"id":461,"date":"2011-12-01T16:10:23","date_gmt":"2011-12-01T16:10:23","guid":{"rendered":"http:\/\/madprogrammer76.wordpress.com\/?p=461"},"modified":"2011-12-01T16:10:23","modified_gmt":"2011-12-01T16:10:23","slug":"websites-responsive-to-screen-size","status":"publish","type":"post","link":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/","title":{"rendered":"Websites Responsive to Screen Size"},"content":{"rendered":"

I own a desktop, laptop, iPad and an HTC Android phone. Each device has a different screen size. I had never tried my website on the iPad and the Android phone until after the DIG 2011 conference in London Ontario. Jeffery Zeldman and Derek Featherstone spoke on the importance of having your website visible on multiple devices and this struck home to me. While they were both talking I had pulled my website on the phone and thought gosh; totally unreadable. I hacked my way through learning a little more about creating a website that was responsive to screen size and finally this weekend tweaked out my own website www.unlatched.com<\/a>. I was amazed with complexity of the job to reorganize what I had originally done, yet when done; found to be so easy! I pulled resources from different sources for my initial kick at the can, but now I am tweaking to make my own reusable template. Not hard, takes a little time, but I see now the importance.<\/p>\n

Example:<\/strong>
\n\"\"<\/a><\/p>\n

Here are some resources:<\/strong>
\n960 Grid System<\/a>
\nGolden Grid System<\/a>
\nSkeleteon<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

I own a desktop, laptop, iPad and an HTC Android phone. Each device has a different screen size. I had never tried my website on the iPad and the Android phone until after the DIG 2011 conference in London Ontario. Jeffery Zeldman and Derek Featherstone spoke on the importance of having your website visible on … Continue reading Websites Responsive to Screen Size<\/span><\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,8,24,71,72,75,96],"tags":[],"yoast_head":"\r\nWebsites Responsive to Screen Size - LDNDeveloper<\/title>\r\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\r\n<link rel=\"canonical\" href=\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\" \/>\r\n<meta property=\"og:locale\" content=\"en_US\" \/>\r\n<meta property=\"og:type\" content=\"article\" \/>\r\n<meta property=\"og:title\" content=\"Websites Responsive to Screen Size - LDNDeveloper\" \/>\r\n<meta property=\"og:description\" content=\"I own a desktop, laptop, iPad and an HTC Android phone. Each device has a different screen size. I had never tried my website on the iPad and the Android phone until after the DIG 2011 conference in London Ontario. Jeffery Zeldman and Derek Featherstone spoke on the importance of having your website visible on … Continue reading Websites Responsive to Screen Size\" \/>\r\n<meta property=\"og:url\" content=\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\" \/>\r\n<meta property=\"og:site_name\" content=\"LDNDeveloper\" \/>\r\n<meta property=\"article:published_time\" content=\"2011-12-01T16:10:23+00:00\" \/>\r\n<meta property=\"og:image\" content=\"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300\" \/>\r\n<meta name=\"author\" content=\"andrewpallant\" \/>\r\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\r\n<meta name=\"twitter:creator\" content=\"@ldnDeveloper\" \/>\r\n<meta name=\"twitter:site\" content=\"@LdnDeveloper\" \/>\r\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"andrewpallant\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\r\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#article\",\"isPartOf\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\"},\"author\":{\"name\":\"andrewpallant\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/0e7b5e71751000e8f66b17b69ef4ab97\"},\"headline\":\"Websites Responsive to Screen Size\",\"datePublished\":\"2011-12-01T16:10:23+00:00\",\"dateModified\":\"2011-12-01T16:10:23+00:00\",\"mainEntityOfPage\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\"},\"wordCount\":186,\"commentCount\":0,\"publisher\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/f6f5bb1ac3e0c5a54a8b5ce35fd67b84\"},\"image\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300\",\"articleSection\":[\"#ldnont\",\"Better Coding\",\"Developer\",\"Responsive\",\"Screen Size\",\"Skills\",\"Web\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\",\"url\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\",\"name\":\"Websites Responsive to Screen Size - LDNDeveloper\",\"isPartOf\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#website\"},\"primaryImageOfPage\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage\"},\"image\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage\"},\"thumbnailUrl\":\"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300\",\"datePublished\":\"2011-12-01T16:10:23+00:00\",\"dateModified\":\"2011-12-01T16:10:23+00:00\",\"breadcrumb\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage\",\"url\":\"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300\",\"contentUrl\":\"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"http:\/\/andrewpallant.ca\/wordpress\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Websites Responsive to Screen Size\"}]},{\"@type\":\"WebSite\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#website\",\"url\":\"http:\/\/andrewpallant.ca\/wordpress\/\",\"name\":\"LDNDeveloper\",\"description\":\"Learning, Growing and Sharing.\",\"publisher\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/f6f5bb1ac3e0c5a54a8b5ce35fd67b84\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"http:\/\/andrewpallant.ca\/wordpress\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/f6f5bb1ac3e0c5a54a8b5ce35fd67b84\",\"name\":\"ldnDeveloper\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2017\/05\/cropped-AAEAAQAAAAAAAAXQAAAAJDQxMGRlMzFjLWM4ODctNDk1NC05M2EyLWE1NDNhNTRiZjVlYw-2.jpg\",\"contentUrl\":\"https:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2017\/05\/cropped-AAEAAQAAAAAAAAXQAAAAJDQxMGRlMzFjLWM4ODctNDk1NC05M2EyLWE1NDNhNTRiZjVlYw-2.jpg\",\"width\":512,\"height\":512,\"caption\":\"ldnDeveloper\"},\"logo\":{\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/image\/\"},\"description\":\"Andrew Pallant (@LdnDeveloper) has been a web, database and desktop developer for over 16 years. Andrew has worked on projects that ranged from factory automation to writing business applications. Most recently he has been heavily involved in various forms for ecommerce projects. Over the years Andrew has worn many hats: Project Manager, IT Manager, Lead Developer, Supervisor of Developers and many more - See more at: http:\/\/www.unlatched.com\/#sthash.8DiTkpKy.dpuf\",\"sameAs\":[\"http:\/\/www.andrewpallant.ca\",\"https:\/\/x.com\/LdnDeveloper\"]},{\"@type\":\"Person\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/0e7b5e71751000e8f66b17b69ef4ab97\",\"name\":\"andrewpallant\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/image\/\",\"url\":\"http:\/\/2.gravatar.com\/avatar\/?s=96&d=mm&r=g\",\"contentUrl\":\"http:\/\/2.gravatar.com\/avatar\/?s=96&d=mm&r=g\",\"caption\":\"andrewpallant\"},\"url\":\"http:\/\/andrewpallant.ca\/wordpress\/author\/andrewpallant\/\"}]}<\/script>\r\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Websites Responsive to Screen Size - LDNDeveloper","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":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/","og_locale":"en_US","og_type":"article","og_title":"Websites Responsive to Screen Size - LDNDeveloper","og_description":"I own a desktop, laptop, iPad and an HTC Android phone. Each device has a different screen size. I had never tried my website on the iPad and the Android phone until after the DIG 2011 conference in London Ontario. Jeffery Zeldman and Derek Featherstone spoke on the importance of having your website visible on … Continue reading Websites Responsive to Screen Size","og_url":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/","og_site_name":"LDNDeveloper","article_published_time":"2011-12-01T16:10:23+00:00","og_image":[{"url":"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300"}],"author":"andrewpallant","twitter_card":"summary_large_image","twitter_creator":"@ldnDeveloper","twitter_site":"@LdnDeveloper","twitter_misc":{"Written by":"andrewpallant","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#article","isPartOf":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/"},"author":{"name":"andrewpallant","@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/0e7b5e71751000e8f66b17b69ef4ab97"},"headline":"Websites Responsive to Screen Size","datePublished":"2011-12-01T16:10:23+00:00","dateModified":"2011-12-01T16:10:23+00:00","mainEntityOfPage":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/"},"wordCount":186,"commentCount":0,"publisher":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/f6f5bb1ac3e0c5a54a8b5ce35fd67b84"},"image":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage"},"thumbnailUrl":"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300","articleSection":["#ldnont","Better Coding","Developer","Responsive","Screen Size","Skills","Web"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#respond"]}]},{"@type":"WebPage","@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/","url":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/","name":"Websites Responsive to Screen Size - LDNDeveloper","isPartOf":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/#website"},"primaryImageOfPage":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage"},"image":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage"},"thumbnailUrl":"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300","datePublished":"2011-12-01T16:10:23+00:00","dateModified":"2011-12-01T16:10:23+00:00","breadcrumb":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#primaryimage","url":"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300","contentUrl":"http:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2011\/12\/responsiveexample.jpg?w=300"},{"@type":"BreadcrumbList","@id":"http:\/\/andrewpallant.ca\/wordpress\/websites-responsive-to-screen-size\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"http:\/\/andrewpallant.ca\/wordpress\/"},{"@type":"ListItem","position":2,"name":"Websites Responsive to Screen Size"}]},{"@type":"WebSite","@id":"http:\/\/andrewpallant.ca\/wordpress\/#website","url":"http:\/\/andrewpallant.ca\/wordpress\/","name":"LDNDeveloper","description":"Learning, Growing and Sharing.","publisher":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/f6f5bb1ac3e0c5a54a8b5ce35fd67b84"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/andrewpallant.ca\/wordpress\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/f6f5bb1ac3e0c5a54a8b5ce35fd67b84","name":"ldnDeveloper","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/image\/","url":"https:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2017\/05\/cropped-AAEAAQAAAAAAAAXQAAAAJDQxMGRlMzFjLWM4ODctNDk1NC05M2EyLWE1NDNhNTRiZjVlYw-2.jpg","contentUrl":"https:\/\/andrewpallant.ca\/wordpress\/wp-content\/uploads\/2017\/05\/cropped-AAEAAQAAAAAAAAXQAAAAJDQxMGRlMzFjLWM4ODctNDk1NC05M2EyLWE1NDNhNTRiZjVlYw-2.jpg","width":512,"height":512,"caption":"ldnDeveloper"},"logo":{"@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/image\/"},"description":"Andrew Pallant (@LdnDeveloper) has been a web, database and desktop developer for over 16 years. Andrew has worked on projects that ranged from factory automation to writing business applications. Most recently he has been heavily involved in various forms for ecommerce projects. Over the years Andrew has worn many hats: Project Manager, IT Manager, Lead Developer, Supervisor of Developers and many more - See more at: http:\/\/www.unlatched.com\/#sthash.8DiTkpKy.dpuf","sameAs":["http:\/\/www.andrewpallant.ca","https:\/\/x.com\/LdnDeveloper"]},{"@type":"Person","@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/0e7b5e71751000e8f66b17b69ef4ab97","name":"andrewpallant","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"http:\/\/andrewpallant.ca\/wordpress\/#\/schema\/person\/image\/","url":"http:\/\/2.gravatar.com\/avatar\/?s=96&d=mm&r=g","contentUrl":"http:\/\/2.gravatar.com\/avatar\/?s=96&d=mm&r=g","caption":"andrewpallant"},"url":"http:\/\/andrewpallant.ca\/wordpress\/author\/andrewpallant\/"}]}},"_links":{"self":[{"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/posts\/461"}],"collection":[{"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/comments?post=461"}],"version-history":[{"count":0,"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/posts\/461\/revisions"}],"wp:attachment":[{"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/media?parent=461"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/categories?post=461"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/andrewpallant.ca\/wordpress\/wp-json\/wp\/v2\/tags?post=461"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}