{"id":746,"date":"2014-11-12T13:31:48","date_gmt":"2014-11-12T18:31:48","guid":{"rendered":"http:\/\/www.harrisweb.ca\/blog\/?p=746"},"modified":"2018-06-22T16:43:05","modified_gmt":"2018-06-22T20:43:05","slug":"website-design-what-you-should-know","status":"publish","type":"post","link":"https:\/\/www.harrisweb.ca\/blog\/website-design-what-you-should-know\/","title":{"rendered":"Website Design &#8211; What you should know"},"content":{"rendered":"<p>&nbsp;<\/p>\n<p>Long time ago, in a land far far away, I found myself sitting in a physics class (dynamics, the physics of motion) and on the first day the Professor Patterson said, &#8220;There are only 2 things you need to know about dynamics, and if you learn them, right here, right now, you will have learned 50% of the course material in the next 2 minutes. If you understand them you won&#8217;t have to come to class for the next 16 weeks&#8221;<\/p>\n<p>He had captured our attention, not an easy task to capture the attention of 60 randy 20-year-old men if you didn&#8217;t have the right curves &#8211; and he didn&#8217;t.<\/p>\n<p>&#8220;<img loading=\"lazy\" decoding=\"async\" class=\"alignleft wp-image-766 size-medium\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/F-ma-300x258.png\" alt=\"F = ma\" width=\"300\" height=\"258\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/F-ma-300x258.png 300w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/F-ma.png 356w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/>The first, and more important, constitutes 40% of all you need to know.&#8221; he resumed.<\/p>\n<p>A hush dropped over the room like a cone of silence, with bated breath and pencils poised, we awaited Prof. Patterson&#8217;s pronouncement.<br \/>\nHe continued, &#8220;F=ma&#8221; writing it 3 feet high on the board.Then, while underlining each letter, &#8220;Force, equals, mass, times, acceleration.&#8221;<\/p>\n<p>Huh? (we already knew this)<\/p>\n<p>&#8220;Oh yes, the second thing is&#8230;&#8221; he smiled, &#8220;you can&#8217;t push on a rope! Class dismissed&#8221;<\/p>\n<p>&nbsp;<\/p>\n<p>Professor Patterson went on for 16 weeks to show us that yes indeed F did = m a.<\/p>\n<h2>It Really is Simple<\/h2>\n<p>So possums, I am here to tell you there are only two things you need to know and you will know 50% of everything you need to about web-design, right here, right now.<\/p>\n<p style=\"padding-left: 30px;\"><strong>1. Connect with your audience<\/strong><br \/>\n<strong> 2. People are the same (but in different ways)<\/strong><\/p>\n<p>&nbsp;<\/p>\n<h2>A Picture is Worth a Thousand Words<\/h2>\n<p>The easiest way to connect with people is to reflect to them, who they are, or who they want to be.<br \/>\nThe fastest way to get that message across is by using images.<\/p>\n<blockquote><p><em>&#8230; <span style=\"background-color: white;\">a team of neuroscientists from MIT has found that the human brain can process entire images that the eye sees for as little as 13 milliseconds<\/span><\/em><\/p>\n<p style=\"padding-left: 480px;\"><a href=\"http:\/\/newsoffice.mit.edu\/2014\/in-the-blink-of-an-eye-0116\"><span style=\"color: black;\">MIT News Link<span style=\"background-color: white;\">\u00a0<\/span><\/span><\/a><\/p>\n<\/blockquote>\n<p>&nbsp;<\/p>\n<p>So compared to reading a bunch of text, 13mS is very fast.<br \/>\nThe pictures we choose become very important, and surprisingly, with all the stock photography available, easily and cheaply, the exact right image may not exist.<br \/>\nSo for an example, let&#8217;s say your demographic is affluent middle-aged men, who you want to entice to a gym to work out and hire a personal trainer. I offer 2 images below. To the left we have a handsome young man, well muscled, with tattoos and a pistol. While on the right we have a man in his 60&#8217;s, in pretty good shape, being helped to do an exercise, that he can probably do, with some help from an attractive young woman &#8211; hits both counts, who they are and who they want to be.<br \/>\n<a href=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/we-can-help-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-749 size-full\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/we-can-help-1.png\" alt=\"we can help 1\" width=\"740\" height=\"464\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/we-can-help-1.png 740w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/we-can-help-1-300x188.png 300w\" sizes=\"auto, (max-width: 740px) 100vw, 740px\" \/><\/a><\/p>\n<p>so connecting with your audience is paramount.<\/p>\n<h2>Changing the Demographic<\/h2>\n<p>Now let us have a little fun, we are going to change the demographic. \u00a0Now we want to sell gym memberships, but this time we want to attract young males, who maybe want to do a little boxing to really get in shape, and let&#8217;s say the gym is in an old downtown or industrial plaza where is affluence in not the norm. \u00a0Just so we are on the same page, &#8220;guns&#8221; is slang for muscles or biceps &#8211; but our demographic knows that.<\/p>\n<p><a href=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/build-your-guns.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-750 size-full\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/build-your-guns.png\" alt=\"build your guns\" width=\"738\" height=\"462\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/build-your-guns.png 738w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/build-your-guns-300x187.png 300w\" sizes=\"auto, (max-width: 738px) 100vw, 738px\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p>Well yes, it is kind of funny.<\/p>\n<h2>Fonts and Colour &#8211; Gettin&#8217; that Loving Feeling<\/h2>\n<p>So now I want to push a little deeper and pull the demographic a little closer. \u00a0We can safely discard the image on the left and stick with our demographic of young males and boxing ring.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/grunge-boxing2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignleft size-full wp-image-759\" src=\"http:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/grunge-boxing2.png\" alt=\"grunge boxing\" width=\"332\" height=\"457\" srcset=\"https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/grunge-boxing2.png 332w, https:\/\/www.harrisweb.ca\/blog\/wp-content\/uploads\/2014\/11\/grunge-boxing2-217x300.png 217w\" sizes=\"auto, (max-width: 332px) 100vw, 332px\" \/><\/a>So what I have done is firstly, took out the line about boxing and added in a pair of boxing gloves.<\/p>\n<p>Then I wanted to give the impression that the gym has been around for a while and I used an older font from the Art Deco period, for the name &#8220;Gino&#8217;s Gym&#8221;<\/p>\n<p>Then I wanted to be a little more modern and I used a grunge font for the tag line and rode it off the &#8220;page&#8221; a bit.<\/p>\n<p>Lastly I chose a border colour to compliment the colour of the boxing gloves, making them stand out a bit more to the eye.<\/p>\n<h2>\u00a0What have we learned<\/h2>\n<p>What we can take away from this is that connecting to the audience is the most important thing. \u00a0We do this the fastest by using images that reflect the demographic either who they are now or who they want to be.<\/p>\n<p>Secondly, we are all the same in this, we just see ourselves differently.<\/p>\n<p>Thirdly, we can use fonts and colour to add dimension to our images.<\/p>\n<p>There is not much more than that.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; Long time ago, in a land far far away, I found myself sitting in a physics class (dynamics, the physics of motion) and on the first day the Professor Patterson said, &#8220;There are only 2 things you need to know about dynamics, and if you learn them, right here, right now, you will have [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":762,"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":[18,20],"tags":[45,52],"class_list":["post-746","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-graphic-design","category-website-design","tag-website-design","tag-website-design-considerations"],"_links":{"self":[{"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts\/746","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=746"}],"version-history":[{"count":16,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts\/746\/revisions"}],"predecessor-version":[{"id":1421,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/posts\/746\/revisions\/1421"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/media\/762"}],"wp:attachment":[{"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/media?parent=746"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/categories?post=746"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.harrisweb.ca\/blog\/wp-json\/wp\/v2\/tags?post=746"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}