SVG or PNG: Questions about logos

[Anonymous User]

I need some help understanding how logos work in StoryMaps and what the best format is. From what I understand SVGs are the best format for icons due to their ability to scale without pixelating. I also have a PNG of the logo we want to use. So I put an SVG logo in Collections and it looks great,

But when I open the individual story map it is super small,

I have noticed a post on this topic, https://community.esri.com/t5/arcgis-storymaps-questions/svg-image-shrink/m-p/1025263#M1684, but I'm not understanding it. I'm using Affinity Photo for exporting images at different sizes.

Now, after noticing this I opened the story map in builder and swapped out the SVG with a PNG (588px X 80px) but it still appears like it is not quite filling like I like,

When I saw this I played around with sizing options and arrived at a size that seems like fills well but looks distorted (400px X 80px),

So I guess I have x questions that I need help answering;

1. What is the best format for logo images?
2. Even when I have PNGs or different logos in the story maps themselves it seems that whatever I put on the Collections landing page takes priority and uses that image. Is this expected behavior?
3. What size should I be making these logos to fill in the logo area of story maps? I know when you put in an image less than 80px in height you get the following message,

Hope all this makes sense and thank you for your help.

[Anonymous User]

He was a termendous help and I got it work correctly.

I guess the only thing I'm looking for to close out the topic is if you could answer the following questions for future reference,

1. What is the best format for logo images?
2. Even when I have PNGs or different logos in the story maps themselves it seems that whatever I put on the Collections landing page takes priority and uses that image. Is this expected behavior?
3. What size should I be making these logos to fill in the logo area of story maps? I know when you put in an image less than 80px in height you get the following message,

Thanks everyone for your help!

[OwenGeo]

@Anonymous User 

1. There is no best format, but PNGs and SVGs are recommended as mentioned in the tooltip. JPGs are not recommended since they do not support transparency.
2. Yes that's expected. A collection always shows the collection logo in the header, even if you are viewing a story in that collection. Let us know if you have specific feedback about this and if there would be an alternative treatment that you'd expect here.
3. 80px tall is meant as a guideline so that a logo of the appropriate quality is used, but the logo (as long as it has its size set correctly if it's an SVG) should fill the height of the header area.

Let me know if this answers your questions or if you need additional clarification.