{"id":16032,"date":"2012-08-17T10:17:21","date_gmt":"2012-08-17T14:17:21","guid":{"rendered":"https:\/\/audreymarcotte.ca\/uncategorized\/how-to-represent-a-place-in-a-web-design\/"},"modified":"2025-09-17T12:29:30","modified_gmt":"2025-09-17T16:29:30","slug":"how-to-represent-a-place-in-a-web-design","status":"publish","type":"post","link":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/","title":{"rendered":"How to represent a place in a web design?"},"content":{"rendered":"<p>The design of a website often goes beyond aesthetics. Let us think in particular of sites which present and sell a place, such as the site of a hotel, an inn, a ski center or other. It then becomes imperative that this place is reflected in the visual of the website. We want visitors to know what to expect and have a clear idea when they walk through the door of the establishment, and this is as much in the interest of the owner as in the interest of visitors.<\/p>\n<p><!--more-->As a web designer, you will therefore have to find a way to represent the establishment graphically with realism. With realism and accuracy, because overdoing it will oversize the expectations of customers who will experience disappointment, however small, in spite of themselves. Conversely, a design that is too simplistic will not do justice to the establishment and will sell the product poorly. In short, we want the site to reflect the image of the establishment, no more, no less.<\/p>\n<h2>Where to start?<\/h2>\n<p>I present to you a very simple approach, but which works well, and not only in web design (basically, I used this approach for the graphic design of museum exhibitions):<\/p>\n<h3>Go to the places<\/h3>\n<p>If it&#8217;s possible of course. Once there, trust your first impression. Take notes: is the place friendly, classic, elegant? Be curious, pay the owner a visit.<\/p>\n<p>Pay attention to the atmosphere and the people working. Is the service formal or warm? Wearing a uniform or not can sometimes be a good indicator.<\/p>\n<h3>play paparazzi<\/h3>\n<p>If you have the right, photograph the key places, the most frequented places as well as individual rooms (ok, bathrooms are not required here :)). Also take exterior photos of the building as well as the surroundings.<\/p>\n<p>Keep in mind that the photos do not need to be of good quality and be careful not to disturb the customers on site.<\/p>\n<p>If you don&#8217;t have permission to take photos, you can always fall back on our friend Google.<\/p>\n<h3>Dissect and analyze<\/h3>\n<p>This is the crucial step.<\/p>\n<p>Take a step back and look at the photos you have taken. Identify repetitive elements: are there recurring colors or patterns? What are the materials? Wood, metal, fabric?<\/p>\n<p>And overall, is the place bright or dark? Cluttered or uncluttered? Urban or outdoor style? Antique or modern? Is there a strong presence of verticality with an excessive ceiling height or are there vast spaces that give the illusion of depth and horizontality?<\/p>\n<h2>How could you use these elements in your visual?<\/h2>\n<p>You must then translate these elements into your graphic models. Make simple but explicit choices. For example, the <a href=\"http:\/\/www.aubergedespeupliers.com\/fr\/hebergement-charlevoix\/accueil\/\">Auberge des Peupliers<\/a> site in Charlevoix inspires nature and panoramic views through, among other things, an airy design and the use of large masses in shades of green.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-15674\" src=\"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2012\/08\/peuplier-960x455@2x.png\" alt=\"\" width=\"1920\" height=\"910\"><\/p>\n<h3>Not just the graphics<\/h3>\n<p>Finally, do not rely on graphics and also include professional photos of the place. Large photos will speak for themselves. They can occupy the entire background, be grouped together in a gallery like on the <a href=\"http:\/\/www.hotelmissoni.com\/hotelmissoni-kuwait\/gallery\" target=\"_blank\" rel=\"noopener noreferrer\">Hotel Missoni<\/a> website, or inserted into the content of the pages.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-15675\" src=\"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2012\/08\/missoni-960x577@2x.png\" alt=\"\" width=\"1920\" height=\"1154\"><\/p>\n<p>So here is this simple little approach that relies on the judicious combination of architectural elements translated into visual elements in a Web design. Do you have any other tips to share?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The design of a website often goes beyond aesthetics. Let us think in particular of sites which present and sell a place, such as the site of a hotel, an inn, a ski center or other. It then becomes imperative that this place is reflected in the visual of the website. We want visitors to [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"content-type":"","_exactmetrics_skip_tracking":false,"_genesis_hide_title":false,"_genesis_hide_breadcrumbs":false,"_genesis_hide_singular_image":false,"_genesis_hide_footer_widgets":false,"_genesis_custom_body_class":"","_genesis_custom_post_class":"","_genesis_layout":"content-sidebar","footnotes":""},"categories":[131,74,438],"tags":[561,440],"class_list":["post-16032","post","type-post","status-publish","format-standard","category-experience-utilisateur-ux","category-non-classifiee","category-user-experience-ux","tag-interface-design-ui","tag-ux-design","entry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to represent a place in a web design?<\/title>\n<meta name=\"description\" content=\"The design of a website often goes beyond aesthetics. It sometimes becomes imperative that this place is reflected in the visual of the website.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to represent a place in a web design?\" \/>\n<meta property=\"og:description\" content=\"The design of a website often goes beyond aesthetics. It sometimes becomes imperative that this place is reflected in the visual of the website.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Audrey Marcotte, M.A., UXC\" \/>\n<meta property=\"article:published_time\" content=\"2012-08-17T14:17:21+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-09-17T16:29:30+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2025\/01\/Audrey_Marcotte_UXC.png\" \/>\n\t<meta property=\"og:image:width\" content=\"2048\" \/>\n\t<meta property=\"og:image:height\" content=\"1664\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Audrey Marcotte\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Audrey Marcotte\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to represent a place in a web design?","description":"The design of a website often goes beyond aesthetics. It sometimes becomes imperative that this place is reflected in the visual of the website.","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:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/","og_locale":"en_US","og_type":"article","og_title":"How to represent a place in a web design?","og_description":"The design of a website often goes beyond aesthetics. It sometimes becomes imperative that this place is reflected in the visual of the website.","og_url":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/","og_site_name":"Audrey Marcotte, M.A., UXC","article_published_time":"2012-08-17T14:17:21+00:00","article_modified_time":"2025-09-17T16:29:30+00:00","og_image":[{"width":2048,"height":1664,"url":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2025\/01\/Audrey_Marcotte_UXC.png","type":"image\/png"}],"author":"Audrey Marcotte","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Audrey Marcotte","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#article","isPartOf":{"@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/"},"author":{"name":"Audrey Marcotte","@id":"https:\/\/audreymarcotte.ca\/en\/#\/schema\/person\/cecb0caea458d531762afc053770bcf2"},"headline":"How to represent a place in a web design?","datePublished":"2012-08-17T14:17:21+00:00","dateModified":"2025-09-17T16:29:30+00:00","mainEntityOfPage":{"@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/"},"wordCount":564,"commentCount":0,"publisher":{"@id":"https:\/\/audreymarcotte.ca\/en\/#\/schema\/person\/3ac39e569c6d4a1f7422116319c9155e"},"image":{"@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#primaryimage"},"thumbnailUrl":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2012\/08\/peuplier-960x455@2x.png","keywords":["Interface Design (UI)","UX Design"],"articleSection":["Exp\u00e9rience utilisateur (UX)","Non classifi\u00e9(e)","User Experience (UX)"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/","url":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/","name":"How to represent a place in a web design?","isPartOf":{"@id":"https:\/\/audreymarcotte.ca\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#primaryimage"},"image":{"@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#primaryimage"},"thumbnailUrl":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2012\/08\/peuplier-960x455@2x.png","datePublished":"2012-08-17T14:17:21+00:00","dateModified":"2025-09-17T16:29:30+00:00","description":"The design of a website often goes beyond aesthetics. It sometimes becomes imperative that this place is reflected in the visual of the website.","breadcrumb":{"@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#primaryimage","url":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2012\/08\/peuplier-960x455@2x.png","contentUrl":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2012\/08\/peuplier-960x455@2x.png"},{"@type":"BreadcrumbList","@id":"https:\/\/audreymarcotte.ca\/en\/how-to-represent-a-place-in-a-web-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/audreymarcotte.ca\/en\/"},{"@type":"ListItem","position":2,"name":"How to represent a place in a web design?"}]},{"@type":"WebSite","@id":"https:\/\/audreymarcotte.ca\/en\/#website","url":"https:\/\/audreymarcotte.ca\/en\/","name":"Audrey Marcotte, M.A., UXC","description":"Exp\u00e9rience client (CX et UX)","publisher":{"@id":"https:\/\/audreymarcotte.ca\/en\/#\/schema\/person\/3ac39e569c6d4a1f7422116319c9155e"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/audreymarcotte.ca\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/audreymarcotte.ca\/en\/#\/schema\/person\/3ac39e569c6d4a1f7422116319c9155e","name":"Audrey","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2025\/01\/Audrey_Marcotte_PinkBG.jpg","url":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2025\/01\/Audrey_Marcotte_PinkBG.jpg","contentUrl":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2025\/01\/Audrey_Marcotte_PinkBG.jpg","width":912,"height":910,"caption":"Audrey"},"logo":{"@id":"https:\/\/audreymarcotte.ca\/wp-content\/uploads\/2025\/01\/Audrey_Marcotte_PinkBG.jpg"}},{"@type":"Person","@id":"https:\/\/audreymarcotte.ca\/en\/#\/schema\/person\/cecb0caea458d531762afc053770bcf2","name":"Audrey Marcotte","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/de35e5568373b6d201a3f59a684a757f952830c3b8046040c201736cdee44ae3?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/de35e5568373b6d201a3f59a684a757f952830c3b8046040c201736cdee44ae3?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/de35e5568373b6d201a3f59a684a757f952830c3b8046040c201736cdee44ae3?s=96&d=mm&r=g","caption":"Audrey Marcotte"},"description":"Audrey Marcotte est conseill\u00e8re strat\u00e9gique en exp\u00e9rience client (CX et UX). Travaillant dans le domaine du Web depuis plus de 15 ans, elle poss\u00e8de une forte exp\u00e9rience en exp\u00e9rience utilisateur, en ergonomie, en design d\u2019interface, ainsi qu\u2019en accessibilit\u00e9 Web (Standard SGQRI-008 notamment).","sameAs":["http:\/\/audreymarcotte.ca","https:\/\/www.linkedin.com\/in\/audreymarcotte\/"]}]}},"_links":{"self":[{"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/posts\/16032","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/comments?post=16032"}],"version-history":[{"count":2,"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/posts\/16032\/revisions"}],"predecessor-version":[{"id":16072,"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/posts\/16032\/revisions\/16072"}],"wp:attachment":[{"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/media?parent=16032"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/categories?post=16032"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/audreymarcotte.ca\/en\/wp-json\/wp\/v2\/tags?post=16032"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}