{"id":3445,"date":"2011-07-26T06:30:46","date_gmt":"2011-07-26T06:30:46","guid":{"rendered":"https:\/\/rojaweb.com\/?p=660"},"modified":"2011-07-26T06:30:46","modified_gmt":"2011-07-26T06:30:46","slug":"the-importance-of-images-in-web-design","status":"publish","type":"post","link":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/","title":{"rendered":"The Importance of Images in Web Design"},"content":{"rendered":"

Studies show that users focus more on information-rich photos most relevant to a website’s content and pay little or no attention to the images that do not have intellectual weight, detail, or relevancy.<\/p>\n

Eye-tracking studies recently conducted by Jakob Nielsen<\/a> revealed that there is a significant difference on users\u2019 perception of website images. They found out that there are certain pictures that are totally ignored. This usually happens to elaborate or “fluff” images that are there solely for decoration purposes. On the other hand, other types of images are necessary elements and carefully examined by users, such as photos of real people and products (and this does not include stock photos of models).<\/p>\n

Too many articles have been written about the pitfalls of decorative images. Unfortunately, a lot of websites give more weight to this rather than going straight to the point. Visual fancy remains the top user\u2019s obstacles. And despite increasingly high-speed Internet connections and quick download times, most users still go for websites that deliver the information they need. This applies for both business sites, where product photos are golden in assisting users to better understand their products and compare similar items and for personal websites, where users would really want to know the people or authors behind the website. This is also the top usability guideline for blogs. The following are a few examples of the said eyetracking studies:<\/p>\n

Product Details are good<\/span><\/p>\n

One study conducted on two screenshots of product pages where thumbnail photos of a narrower range of products are optimized for a well-categorized page that leads to a more detailed photo of each product. It was compared with another \u201cbig name\u201d (amazon.com) product page carrying a wide range of products that uses a standard gallery layout in order to cater the different category pages. It shows that a website page with a detailed photo of each product specific to a certain category can largely encourage and boost user interactivity and response.\u00a0 It proves that following the website design of \u201cbig name\u201d websites is not always good and that businesses should always use detailed product photos that compliment their<\/em> business model and products.<\/p>\n

People Photos are good if they\u2019re real people<\/span><\/p>\n

Presenting a company\u2019s image online primarily involves the inclusion of photos of the executive team so that users will know that they\u2019re associating with real people. This has long been a guideline and though there are website that take further steps by presenting each photo and biography of the whole team, users often tend to have diminishing attention as they scroll down through longer pages.<\/p>\n

Studies done on these type of pages revealed that users allocate more time viewing their portrait photos rather than reading team member bios, despite the fact that the bios consume more than 3 times as much webpage space. It further showed that users do not pay attention to stock photos of models.<\/p>\n

So, the key is to present real people who are actually behind the company.<\/p>\n

Big Photos are good whenever requested<\/span><\/p>\n

Studies on product pages showed that users spend more time with product pages that contain detailed information about each product where there\u2019s an option to view enlarged photos. \u00a0One of the top ten website design mistakes is to provide a poorly enlarged photo whenever the user clicks the link that provides option for a larger view of a certain image. Furthermore, users do not like photos that tend to distract them from completing their tasks.<\/p>\n

Information-rich images are good<\/span><\/p>\n

What is common among all the examples is that users give more attention to information-rich images that display content related to what they are looking for. It further revealed that users stay away from images that are purely for decorative purposes.<\/p>\n

The web is already flooded with fluffy images. Invest in quality photos.\u00a0 They\u2019ll certainly add an additional level of engagement to your website.<\/p>\n

To read more about these website design studies, head over to Jakob Nielsen’s Alertbox<\/a>. \t<\/p>\n","protected":false},"excerpt":{"rendered":"

Studies show that users focus more on information-rich photos most relevant to a website’s content and pay little or no attention to the images that do not have intellectual weight, detail, or relevancy. Eye-tracking studies recently conducted by Jakob Nielsen revealed that there is a significant difference on users\u2019 perception of website images. They found<\/p>\n

Read More…<\/a><\/p>\n","protected":false},"author":67,"featured_media":669,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[27,44],"tags":[],"yoast_head":"\nThe Importance of Images in Web Design - Roja Interactive<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"The Importance of Images in Web Design - Roja Interactive\" \/>\n<meta property=\"og:description\" content=\"Studies show that users focus more on information-rich photos most relevant to a website’s content and pay little or no attention to the images that do not have intellectual weight, detail, or relevancy. Eye-tracking studies recently conducted by Jakob Nielsen revealed that there is a significant difference on users\u2019 perception of website images. They foundRead More...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Roja Interactive\" \/>\n<meta property=\"article:published_time\" content=\"2011-07-26T06:30:46+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2560\" \/>\n\t<meta property=\"og:image:height\" content=\"1714\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jason OMara\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jason OMara\" \/>\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\":\"WebPage\",\"@id\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/\",\"url\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/\",\"name\":\"The Importance of Images in Web Design - Roja Interactive\",\"isPartOf\":{\"@id\":\"https:\/\/rojaweb.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg\",\"datePublished\":\"2011-07-26T06:30:46+00:00\",\"dateModified\":\"2011-07-26T06:30:46+00:00\",\"author\":{\"@id\":\"https:\/\/rojaweb.com\/#\/schema\/person\/058703269d2c6cb63e5237910d1f860a\"},\"breadcrumb\":{\"@id\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#primaryimage\",\"url\":\"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg\",\"contentUrl\":\"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg\",\"width\":2560,\"height\":1714,\"caption\":\"website design\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/rojaweb.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"The Importance of Images in Web Design\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/rojaweb.com\/#website\",\"url\":\"https:\/\/rojaweb.com\/\",\"name\":\"Roja Interactive\",\"description\":\"Website Design & SEO\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/rojaweb.com\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/rojaweb.com\/#\/schema\/person\/058703269d2c6cb63e5237910d1f860a\",\"name\":\"Jason OMara\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/rojaweb.com\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/44d3b21fe5c3b07f60e103c534049048?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/44d3b21fe5c3b07f60e103c534049048?s=96&d=mm&r=g\",\"caption\":\"Jason OMara\"},\"url\":\"https:\/\/rojaweb.com\/author\/rojaadmin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"The Importance of Images in Web Design - Roja Interactive","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:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/","og_locale":"en_US","og_type":"article","og_title":"The Importance of Images in Web Design - Roja Interactive","og_description":"Studies show that users focus more on information-rich photos most relevant to a website’s content and pay little or no attention to the images that do not have intellectual weight, detail, or relevancy. Eye-tracking studies recently conducted by Jakob Nielsen revealed that there is a significant difference on users\u2019 perception of website images. They foundRead More...","og_url":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/","og_site_name":"Roja Interactive","article_published_time":"2011-07-26T06:30:46+00:00","og_image":[{"width":2560,"height":1714,"url":"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg","type":"image\/jpeg"}],"author":"Jason OMara","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Jason OMara","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/","url":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/","name":"The Importance of Images in Web Design - Roja Interactive","isPartOf":{"@id":"https:\/\/rojaweb.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#primaryimage"},"image":{"@id":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#primaryimage"},"thumbnailUrl":"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg","datePublished":"2011-07-26T06:30:46+00:00","dateModified":"2011-07-26T06:30:46+00:00","author":{"@id":"https:\/\/rojaweb.com\/#\/schema\/person\/058703269d2c6cb63e5237910d1f860a"},"breadcrumb":{"@id":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#primaryimage","url":"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg","contentUrl":"https:\/\/rojaweb.com\/wp-content\/uploads\/2011\/07\/camera-1-scaled.jpg","width":2560,"height":1714,"caption":"website design"},{"@type":"BreadcrumbList","@id":"https:\/\/rojaweb.com\/the-importance-of-images-in-web-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/rojaweb.com\/"},{"@type":"ListItem","position":2,"name":"The Importance of Images in Web Design"}]},{"@type":"WebSite","@id":"https:\/\/rojaweb.com\/#website","url":"https:\/\/rojaweb.com\/","name":"Roja Interactive","description":"Website Design & SEO","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rojaweb.com\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/rojaweb.com\/#\/schema\/person\/058703269d2c6cb63e5237910d1f860a","name":"Jason OMara","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/rojaweb.com\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/44d3b21fe5c3b07f60e103c534049048?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/44d3b21fe5c3b07f60e103c534049048?s=96&d=mm&r=g","caption":"Jason OMara"},"url":"https:\/\/rojaweb.com\/author\/rojaadmin\/"}]}},"_links":{"self":[{"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/posts\/3445"}],"collection":[{"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/users\/67"}],"replies":[{"embeddable":true,"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/comments?post=3445"}],"version-history":[{"count":0,"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/posts\/3445\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/media\/669"}],"wp:attachment":[{"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/media?parent=3445"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/categories?post=3445"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rojaweb.com\/wp-json\/wp\/v2\/tags?post=3445"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}