{"id":2155,"date":"2021-07-16T08:27:05","date_gmt":"2021-07-16T08:27:05","guid":{"rendered":"https:\/\/prodmarc.com\/knowledge\/?p=2155"},"modified":"2023-01-31T07:18:14","modified_gmt":"2023-01-31T07:18:14","slug":"getting-ready-for-bimi-prepare-your-logo","status":"publish","type":"post","link":"https:\/\/knowledge.progist.net\/index.php\/2021\/07\/16\/getting-ready-for-bimi-prepare-your-logo\/","title":{"rendered":"Getting ready for BIMI: Prepare your Logo"},"content":{"rendered":"<p>The first step you need to take to get ready for Brand Indicators for Message Identification (BIMI): Get your logo into SVG format.<\/p>\n<p><strong>Preparing your logo: creating the SVG<\/strong><\/p>\n<p>Your logo for BIMI must be in Scalable Vector Graphic (SVG) format. But the SVG must adhere to the SVG Portable\/Secure (SVG-P\/S) profile, and there is no export template for vector applications like Adobe Illustrator today. That means you\u2019ll have to create it using the Adobe Illustrator.<\/p>\n<h4><strong>Option 1: Using Adobe Illustrator<\/strong><\/h4>\n<h5><strong>Step 1:<\/strong><\/h5>\n<h5><strong> Transform pixels to vector format (\u2018.ai\u2019, \u2018.eps\u2019, \u2018.pdf\u2019, \u2018.svg\u2019)<\/strong><\/h5>\n<p>Many companies have logos created in Photoshop or other design software that is made up of pixels. This won\u2019t work. Instead, you need to first convert your logo to vector format.<\/p>\n<p>Many brand logos are easily convertible wordmarks using fonts and line art. But for some organizations with complex art, you may need to spend some time re-working the design to be vector compatible.<\/p>\n<h5><strong>Step 2: <\/strong><\/h5>\n<h5><strong>Export as SVG Tiny 1.2<\/strong><\/h5>\n<p>Once you have the logo in a vector format, you\u2019ll need to start by exporting it as an SVG Tiny 1.2 profile. In Adobe Illustrator\u00ae you can do that via the \u201cSave As\u201d dialog:<\/p>\n<ol>\n<li>Double-check that your image is vector-based (\u2018.ai\u2019, \u2018.eps\u2019, \u2018.pdf\u2019, \u2018.svg\u2019).<\/li>\n<li>Open your file in Adobe Illustrator.<\/li>\n<li>Save your file by using the option \u201cSave As.\u201d<\/li>\n<li>Once the dialog box is open, name the file and choose \u201cSVG (SVG)\u201d from the dropdown \u201cFormat.\u201d<\/li>\n<li>Click on \u201cSave\u201d and wait for a new dialog box to open.<\/li>\n<li>In the \u201cSVG Profiles\u201d dropdown, select \u201cTiny 1.2\u201d and then click \u201cOK.\u201d<\/li>\n<\/ol>\n<p><img loading=\"lazy\" decoding=\"async\" width=\"928\" height=\"357\" src=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z1-1-1.png\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z1-1-1.png 928w, https:\/\/prodmarc.com\/knowledge\/wp-content\/uploads\/2021\/07\/z1-1-300x115.png 300w, https:\/\/prodmarc.com\/knowledge\/wp-content\/uploads\/2021\/07\/z1-1-768x295.png 768w\" sizes=\"auto, (max-width: 928px) 100vw, 928px\"><br \/>\n<img loading=\"lazy\" decoding=\"async\" width=\"568\" height=\"513\" src=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z2-1-1.png\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z2-1-1.png 568w, https:\/\/prodmarc.com\/knowledge\/wp-content\/uploads\/2021\/07\/z2-1-300x271.png 300w\" sizes=\"auto, (max-width: 568px) 100vw, 568px\"><\/p>\n<h5><strong>Step 3:<\/strong><\/h5>\n<h5><strong> Open your trusty text editor<\/strong><\/h5>\n<p>Next, you\u2019ll need to open your SVG file in a text editor (e.g., Notepad or Notepad++), or a code editor like Vim or Nano. As SVG files are text files, the most important point is that you can open, edit and re-save to a \u201ctxt\u201d format with a \u201c.svg\u201d file extension.<\/p>\n<p>After you open the file, there are a few edits you will need to make:<\/p>\n<ol>\n<li>While on the SVG file source, verify you see the following settings in the header:<\/li>\n<\/ol>\n<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xmlns=http:\/\/www.w3.org\/2000\/svg, version=\u201d1.2, baseProfile=\u201dtiny-ps\u201c<\/p>\n<p>There may be other information in the top of your file like the sample below, but these MUST be present<\/p>\n<p>For example, you may see a string like this:<\/p>\n<p>&lt;svg version=&#8221;1.2&#8243; baseProfile=&#8221;tiny-ps&#8221; id=&#8221;Layer_1&#8243; xmlns=&#8221;http:\/\/www.w3.org\/2000\/svg&#8221; xmlns:xlink=&#8221;http:\/\/www.w3.org\/1999\/xlink&#8221; viewBox=&#8221;0 0 1080 1080\u201c xml:space=&#8221;preserve&#8221;&gt;<\/p>\n<p>If you exported from Illustrator, you\u2019ll need to change the baseProfile to tiny-ps, and delete the x=, y= and overflow items.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" width=\"625\" height=\"228\" src=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z3-1-1.png\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z3-1-1.png 625w, https:\/\/prodmarc.com\/knowledge\/wp-content\/uploads\/2021\/07\/z3-1-300x109.png 300w\" sizes=\"auto, (max-width: 625px) 100vw, 625px\"><\/p>\n<ol start=\"2\">\n<li>Next, you\u2019ll want to add the title element.&nbsp;We suggest hitting return after the xml:space=\u201dpreserve\u201d item and put the title element there. Put your company name in this field.<\/li>\n<li>Careful you don\u2019t put the title item inside the graphic code itself. Like in this example screen shot below, right after the \u201c=preserve\u201d stuff on a new line is fine. But, if you go after the line that starts with &lt;rect&gt; then validation may fail.<\/li>\n<\/ol>\n<p><img loading=\"lazy\" decoding=\"async\" width=\"637\" height=\"195\" src=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z4.png\" alt=\"\" loading=\"lazy\" srcset=\"https:\/\/knowledge.progist.net\/wp-content\/uploads\/2021\/07\/z4.png 637w, https:\/\/prodmarc.com\/knowledge\/wp-content\/uploads\/2021\/07\/z4-300x92.png 300w\" sizes=\"auto, (max-width: 637px) 100vw, 637px\"><\/p>\n<ol start=\"3\">\n<li>Resave your file as text format, with SVG extension.<\/li>\n<\/ol>\n<h4><strong>Option 2: Use the BIMI working group\u2019s graphic conversion tools<\/strong><\/h4>\n<p>The BIMI working group has released graphic conversion tools to help format your logo as an SVG-P\/S.<\/p>\n<ul>\n<li>Their tools include: Adobe Illustrator Export Script: A script that can be added to Adobe Illustrator (either Windows or MacOS) and offers the ability to convert an open SVG Tiny 1.2 file into SVG P\/S format.<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>The first step you need to take to get ready for Brand Indicators for Message Identification (BIMI): Get your logo into SVG format. Preparing your logo: creating the SVG Your<\/p>\n<p><a href=\"https:\/\/knowledge.progist.net\/index.php\/2021\/07\/16\/getting-ready-for-bimi-prepare-your-logo\/\" class=\"more-link\">Continue Reading<span class=\"screen-reader-text\">Getting ready for BIMI: Prepare your Logo<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","om_disable_all_campaigns":false,"footnotes":""},"categories":[4],"tags":[30,31,104],"class_list":["post-2155","post","type-post","status-publish","format-standard","hentry","category-bimi","tag-bimi","tag-bimi-logo","tag-prodmarc"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/posts\/2155","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/comments?post=2155"}],"version-history":[{"count":2,"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/posts\/2155\/revisions"}],"predecessor-version":[{"id":3189,"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/posts\/2155\/revisions\/3189"}],"wp:attachment":[{"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/media?parent=2155"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/categories?post=2155"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/knowledge.progist.net\/index.php\/wp-json\/wp\/v2\/tags?post=2155"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}