{"id":562,"date":"2021-05-19T14:13:49","date_gmt":"2021-05-19T14:13:49","guid":{"rendered":"https:\/\/support.webdinge.nl\/knowledge-base\/01-image-sizes\/"},"modified":"2021-05-19T14:13:51","modified_gmt":"2021-05-19T14:13:51","slug":"01-image-sizes","status":"publish","type":"ht_kb","link":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/","title":{"rendered":"01. Image sizes"},"content":{"rendered":"\n

Logo<\/h3>\n\n

Deviant has 2 logo settings. Namely square and rectangle. <\/p>\n\n

Rectangle<\/strong><\/p>\n\n

\"\"<\/figure>\n

Desktop:<\/p>\n\n

Use size 240×60 pixels for SVG logos (recommended). For PNG logos it is best to do 2 this time. So 480×120 pixels. <\/p>\n\n

Mobile:<\/p>\n\n

For non-SVG logos you can keep the same dimensions or 120×60 pixels<\/p>\n\n

Square<\/u><\/strong><\/p>\n\n

\"\"<\/figure>\n

Desktop and mobile:<\/p>\n\n

In principle you can use any size as long as it is square. So 150×150 pixels or for example 300×300 pixels.<\/p>\n\n

\n\n

Banners<\/h3>\n\n

Deviant is a mobile first theme. This means that we first look at mobile and then at desktop. To maintain the correct proportions on all screens, it is important that all banners are rectangular. <\/p>\n\n

So there are no best dimensions. By scaling the images, there will always be a little bit of clipping that will cut off a small portion of your banner. <\/p>\n\n

As long as all banners have a height of 400 pixels and, for example, 800 pixels wide, then you’re fine. But this also depends on your banner settings, so for example 2 next to each other or 4, or even 1. A page wide banner is for example 2500×400 pixels. The correct width of your banner therefore depends on the number of banners in a row. That’s a bit of trial and error. <\/p>\n\n

\"\"<\/figure>\n
\"\"<\/figure>\n
\"\"<\/figure>\n
\n\n

Headlines<\/h2>\n\n

Deviant has multiple headline options. Namely fullwidth and fullscreen.<\/p>\n\n

Fullwidth<\/p>\n\n

We have created 3 PSD files for the correct dimensions that you can download and use to have the correct dimensions. However, the headlines scale to the available space so you can just try it out for the best result. <\/p>\n\n

Fullscreen:<\/p>\n\n

The best dimensions are 1920×1080 pixels.<\/p>\n\n

\n\n

Other<\/h2>\n\n

The correct dimensions for the other images:<\/p>\n\n

  • Customer service image: 362×562 pixels<\/li>
  • Store image: 460×300 pixels<\/li>
  • Category images: 400×400 pixels of vierkant in elke andere afmeting.<\/li>
  • Brand images: 170×100 pixels<\/li><\/ul>","protected":false},"excerpt":{"rendered":"

    Logo Deviant has 2 logo settings. Namely square and rectangle. Rectangle Desktop: Use size 240×60 pixels for SVG logos (recommended). For PNG logos it is best to do 2 this time. So 480×120 pixels. Mobile: For non-SVG logos you can keep the same dimensions or 120×60 pixels Square Desktop and…<\/p>\n","protected":false},"author":1,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"ht-kb-category":[137],"ht-kb-tag":[],"class_list":["post-562","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-theme-deviant-en"],"yoast_head":"\n01. Image sizes - Help center<\/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:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"01. Image sizes - Help center\" \/>\n<meta property=\"og:description\" content=\"Logo Deviant has 2 logo settings. Namely square and rectangle. Rectangle Desktop: Use size 240×60 pixels for SVG logos (recommended). For PNG logos it is best to do 2 this time. So 480×120 pixels. Mobile: For non-SVG logos you can keep the same dimensions or 120×60 pixels Square Desktop and...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/\" \/>\n<meta property=\"og:site_name\" content=\"Help center\" \/>\n<meta property=\"article:modified_time\" content=\"2021-05-19T14:13:51+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/\",\"url\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/\",\"name\":\"01. Image sizes - Help center\",\"isPartOf\":{\"@id\":\"https:\/\/support.webdinge.nl\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png\",\"datePublished\":\"2021-05-19T14:13:49+00:00\",\"dateModified\":\"2021-05-19T14:13:51+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#primaryimage\",\"url\":\"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png\",\"contentUrl\":\"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/support.webdinge.nl\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"01. Image sizes\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/support.webdinge.nl\/en\/#website\",\"url\":\"https:\/\/support.webdinge.nl\/en\/\",\"name\":\"Help center\",\"description\":\"Get answers to all your questions\",\"publisher\":{\"@id\":\"https:\/\/support.webdinge.nl\/en\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/support.webdinge.nl\/en\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/support.webdinge.nl\/en\/#organization\",\"name\":\"Webdinge | Theme support\",\"url\":\"https:\/\/support.webdinge.nl\/en\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/support.webdinge.nl\/en\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/logo-hc.png\",\"contentUrl\":\"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/logo-hc.png\",\"width\":300,\"height\":90,\"caption\":\"Webdinge | Theme support\"},\"image\":{\"@id\":\"https:\/\/support.webdinge.nl\/en\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"01. Image sizes - Help center","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:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/","og_locale":"en_US","og_type":"article","og_title":"01. Image sizes - Help center","og_description":"Logo Deviant has 2 logo settings. Namely square and rectangle. Rectangle Desktop: Use size 240×60 pixels for SVG logos (recommended). For PNG logos it is best to do 2 this time. So 480×120 pixels. Mobile: For non-SVG logos you can keep the same dimensions or 120×60 pixels Square Desktop and...","og_url":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/","og_site_name":"Help center","article_modified_time":"2021-05-19T14:13:51+00:00","og_image":[{"url":"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/","url":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/","name":"01. Image sizes - Help center","isPartOf":{"@id":"https:\/\/support.webdinge.nl\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#primaryimage"},"image":{"@id":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#primaryimage"},"thumbnailUrl":"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png","datePublished":"2021-05-19T14:13:49+00:00","dateModified":"2021-05-19T14:13:51+00:00","breadcrumb":{"@id":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#primaryimage","url":"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png","contentUrl":"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/image-10.png"},{"@type":"BreadcrumbList","@id":"https:\/\/support.webdinge.nl\/en\/knowledge-base\/01-image-sizes\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/support.webdinge.nl\/en\/"},{"@type":"ListItem","position":2,"name":"01. Image sizes"}]},{"@type":"WebSite","@id":"https:\/\/support.webdinge.nl\/en\/#website","url":"https:\/\/support.webdinge.nl\/en\/","name":"Help center","description":"Get answers to all your questions","publisher":{"@id":"https:\/\/support.webdinge.nl\/en\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/support.webdinge.nl\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/support.webdinge.nl\/en\/#organization","name":"Webdinge | Theme support","url":"https:\/\/support.webdinge.nl\/en\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/support.webdinge.nl\/en\/#\/schema\/logo\/image\/","url":"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/logo-hc.png","contentUrl":"https:\/\/support.webdinge.nl\/wp-content\/uploads\/2021\/05\/logo-hc.png","width":300,"height":90,"caption":"Webdinge | Theme support"},"image":{"@id":"https:\/\/support.webdinge.nl\/en\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/ht-kb\/562","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/comments?post=562"}],"version-history":[{"count":3,"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/ht-kb\/562\/revisions"}],"predecessor-version":[{"id":565,"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/ht-kb\/562\/revisions\/565"}],"wp:attachment":[{"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/media?parent=562"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/ht-kb-category?post=562"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/support.webdinge.nl\/en\/wp-json\/wp\/v2\/ht-kb-tag?post=562"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}