Business, Technology, Tutorial, Ubuntu

How to Set Up a BIMI Logo with Inkscape

BIMI is some kind of logo plus security add on feature to email. In short, it uses a very specific kind of logo format for your company to a) show up visually in someone’s inbox when you send them an email (if they have that functionality) and b) increase email security / authenticity. So it seems good.

I was surprised not to find a nice tutorial that allows one to prepare a BIMI-ready logo using the awesome vector software inkscape so here it is for you. Inkscape is open source and very nice vectored drawing software (on steroids).

Some stuff to know about BIMI

First, your logo must be perfectly square. So if you have a few versions of your logo, you’ll want to choose the most square version and if you don’t have a square one perhaps you should make one now? Otherwise, you’ll have to force a square out of your logo and that is that. I’ll show you how to do that below too.

How to Prepare the SVG File in Inkscape

  1. Open Inkscape
  2. Open your svg logo in Inkscape. If you don’t have one, you’ll have to make one. You can also create a vectored SVG version of your logo in Inkscape and there are definitely tutorials around on this topic…
  3. Go to ‘file’
  4. Go to ‘document properties’
  5. Go to the ‘metadata’ tab
  6. Enter a title in using only lowercase and dashes for your logo title. Something like this is fine: company-bimi-logo
  7. Go to the ‘Page’ tab. If you don’t see the page tab you might have your right pane / panel closed so expand that.
  8. In the ‘Custom size’ row, you sill see a collapsed ‘Resize page to content’ arrow. Expand this.
  9. There is a ‘Resize page to drawing or selection’ button. Make sure your content is selected in the document workspace on the left and click the button. If your Width and Height are not identical, you will need to now ‘force the square’. Decide which axis you want to match the other axis with and make them the same number. Undo is your friend if you mess it up…
  10. To adjust the dimensions, click / select your drawing and at the very top right of the main Inkscape window up near all the main menu items, make sure the W and H lock icon is unlocked and force the W: and H: to be the same number.
  11. Assuming the W: and the H: are now the same number (square), go back and click the ‘Resize page to drawing or selection’ button again. Confirm (again) that the number in all sections is identical in height and width.
  12. Go to ‘File’
  13. “Save as”
  14. Select from file type options: “Optimized SVG (*.svg)”
  15. Click ‘Save’
  16. A new “Optimized SVG Output’ window pops up. In the “SVG Output” tab, click the ‘Remove metadata’ box so that it is selected
  17. Click ok.

You should now have your logo ready to be put through the final process.

Use the online bimi convertor tool which will convert the file you just made into a very specific ‘BIMI compliant’ version of the same thing (effectively). Once you finish the conversion process you should now have your logo ready with some extra stuff appended to the file name so that it now looks like this:

bimi-svg-tiny-12-ps.svg

You may wish to rename it slightly to add your company name back in so it is something like this:

company-bimi-svg-tiny-12-ps.svg

Once you have your processed BIMI logo ready to go, you should move it to your server where most of your content is being served, before you begin the creation of the actual bimi records. See blog on this where I explain how I did this for wordpress using ubuntu server if that’s relevant to you.

Once your processed BIMI logo is sitting on your server you can create an https:// link directly to the logo. Test this link by actually pointing your browser to it before proceeding to make sure it works. In firefox, mine displayed just fine when I put the link in the browser.

Once you have this link copied to your clipboard exactly, it’s ready to go on the bimi generator

Once completed, you will now have a BIMI record which you can input into your name record area of your host so that it will start working.

Tagged , , ,

1 thought on “How to Set Up a BIMI Logo with Inkscape

  1. Hi,

    “7. Go to the ‘Page’ tab. If you don’t see the page tab you might have your right pane / panel closed so expand that.”

    I spent 1 and half hours trying to find the Page tab on Inkscape. Indeed, the right pane might be closed, but I do not know what a “right pane” is other than a right pain.

    Regards.

Leave a Reply

Your email address will not be published. Required fields are marked *