{"id":479,"date":"2013-10-04T14:19:26","date_gmt":"2013-10-04T18:19:26","guid":{"rendered":"http:\/\/www.harrisweb.ca\/blog\/?p=479"},"modified":"2015-04-10T10:07:03","modified_gmt":"2015-04-10T14:07:03","slug":"web-design-inspiration-using-big-images","status":"publish","type":"post","link":"https:\/\/www.harrisweb.ca\/blog\/web-design-inspiration-using-big-images\/","title":{"rendered":"Web Design Inspiration Using Big Images"},"content":{"rendered":"<p><a href=\"http:\/\/www.harrisweb.ca\/websites.php\" target=\"_blank\">Web design<\/a> using big picture backgrounds quickly allows users to know who you are and what you do at a glance. \u00a0This design methodology does not lend itself to all web applications but when an emotion has to be expressed or a flavour has to be conveyed, then big pictures are the way to go.<\/p>\n<h3>The Sydney Theater Company<\/h3>\n<p>Quickly lets you know you are somewhere for the preforming arts, it also conveys the emotions involved around live performance &#8211; costume, lighting and gesture are all brought to your attention in a millisecond. \u00a0The words placed beside the figure of the woman draws the eye to a simple message. \u00a0Mission accomplished, the user knows she is in the right place and will probably explore further.<\/p>\n<p style=\"text-align: center;\"><a href=\"http:\/\/www.deepend.com.au\/-\/ecommerce-sydney-theatre-company\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-481\" alt=\"Sydney Theatre\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture1.png\" width=\"1000\" height=\"536\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture1.png 1000w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture1-300x160.png 300w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a><\/p>\n<h2 style=\"text-align: left;\"><\/h2>\n<h2 style=\"text-align: left;\">Choosing the right picture<\/h2>\n<blockquote>\n<p style=\"text-align: center;\"><em><strong>&#8220;If a picture is worth a thousand words then for your own sake choose the right picture for your home page.&#8221;<\/strong><\/em><\/p>\n<\/blockquote>\n<p style=\"text-align: left;\">I thought this post would be easy, find a bunch of beautiful websites that use large image backgrounds, do a short critique and move on &#8211; not so Batman! \u00a0At this point I have looked at about 30 websites with large picture backgrounds, and many of the picture tell no story, and do not convey any idea of who the company is or what they do. \u00a0A case in point is below:<\/p>\n<h3 style=\"text-align: left;\">Wildcat<\/h3>\n<p style=\"text-align: center;\"><a href=\"http:\/\/the-most.com\/#wildcat\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-486\" alt=\"bigpicture2\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture21.png\" width=\"999\" height=\"535\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture21.png 999w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture21-300x160.png 300w\" sizes=\"auto, (max-width: 999px) 100vw, 999px\" \/><\/a><\/p>\n<p style=\"text-align: left;\">Above we have a guy hiking through a field, and the word Wildcat. \u00a0Also you can notice a play video button. \u00a0I give the guy the benefit of the doubt and play the video. \u00a0I watched for a full minute, and still did not know what the site was about. \u00a0Is it an adventure holiday, a film about wildcats, I dunno.<\/p>\n<h2 style=\"text-align: left;\">So onward with some better stuff<\/h2>\n<h3>Powderlife<\/h3>\n<p style=\"text-align: center;\"><a href=\"http:\/\/www.powderlife.com\/\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-493\" alt=\"bigpicture3\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture3.png\" width=\"1000\" height=\"540\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture3.png 1000w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture3-300x162.png 300w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a><\/p>\n<p>\u00a0Powderlife is about skiing and snowboarding holidays, this is obvious from the picture the company has chosen. \u00a0So if you want know something about snowboarding or skiing you will probably enter the site and explore more.<\/p>\n<p>&nbsp;<\/p>\n<h3>Touch Up Auto Body<\/h3>\n<p style=\"text-align: center;\"><a href=\"http:\/\/touchupautobody.com\/\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-496\" alt=\"bigpicture4\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture4.png\" width=\"1000\" height=\"539\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture4.png 1000w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture4-300x161.png 300w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a><\/p>\n<p>\u00a0Touch Up Auto Body is one of my sites. \u00a0As you can see this is an Auto Body Shop and the first thing you see is a car. \u00a0The tag line is &#8220;Fast Affordable Cosmetic Vehicle Repair&#8221;. \u00a0The picture is a car that is out of the price range of many people which makes you look a little harder. \u00a0It is what I always say, &#8220;Sell the Sizzle&#8221;<\/p>\n<p>&nbsp;<\/p>\n<h3>Campanino Gulf Club<\/h3>\n<p><a href=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture5.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-499\" alt=\"bigpicture5\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture5.png\" width=\"1000\" height=\"535\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture5.png 1000w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture5-300x160.png 300w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a><\/p>\n<p>Campanino Golf Club uses a great narrow depth of field shot of a golf ball across a fairway. \u00a0You instantly know that this site is about golf, and again, if you are interested in golf, you will probably hang around for a while.<\/p>\n<p>&nbsp;<\/p>\n<h3>Davidia Int.<\/h3>\n<p style=\"text-align: center;\"><a href=\"http:\/\/www.davidia-int.hr\/index.html\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-503\" alt=\"bigpicture6\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture6.png\" width=\"999\" height=\"514\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture6.png 999w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2013\/10\/bigpicture6-300x154.png 300w\" sizes=\"auto, (max-width: 999px) 100vw, 999px\" \/><\/a><\/p>\n<p>Davidia Int. is interesting because the Google translation from Croatian is not great, so I am still a little unsure about what they do. \u00a0My best guess is wood flooring, but I am uncertain if they also do furnishings too. \u00a0Be that as it may, the big picture they choose does lend itself to wood flooring, and interior design, these are often interrelated so no harm done.<\/p>\n<p>&nbsp;<\/p>\n<h2>So What Have We Learned<\/h2>\n<p>Mostly what I learned is that if done well, a big image background grabs the visitor&#8217;s attention quickly and conveys the message fast &#8211; way faster than words. \u00a0The surprising thing I learned is that so many companies are doing this badly! \u00a0I looked at over 90 websites to come up with these 6, and one of them I did myself! \u00a0If your designer is coming to you with an idea, send a link of a mock up to all the people you know and ask them what they think the picture says to them. \u00a0Designers are often looking at things from a very artistic viewpoint and you are too close to the forest to see the trees; you see the associations that your customer may not.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Web design using big picture backgrounds quickly allows users to know who you are and what you do at a glance.  This design methodology does not lend itself to all web applications but when an emotion has to be expressed or a flavour has to be conveyed, then big pictures are the way to go.<\/p>\n","protected":false},"author":1,"featured_media":505,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[20],"tags":[54,45,52],"class_list":["post-479","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-website-design","tag-graphic-design","tag-website-design","tag-website-design-considerations"],"_links":{"self":[{"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts\/479","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/comments?post=479"}],"version-history":[{"count":20,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts\/479\/revisions"}],"predecessor-version":[{"id":508,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts\/479\/revisions\/508"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/media\/505"}],"wp:attachment":[{"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/media?parent=479"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/categories?post=479"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/tags?post=479"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}