Don’t use JPEG for logos… and don’t think you can solve the problem by re-saving the JPEG as a PNG

Once you go JPEG, you can’t go back.

You may recall having seen this previously on my blog:


I’ve been singing the “Don’t use JPEG for logos!” refrain for so long that most of my clients (and whoever they’re dealing with to deliver logo image files to them) know logos on the web should be in PNG format (or even better, SVG), not JPEG.

But a lot of people don’t seem to understand that you can’t turn a JPEG into a PNG.

Oh, sure, you can technically do that. By which I mean, you can open a JPEG in Photoshop or a similar image editing program, and save it as a PNG. But doing that won’t fix anything.

JPEG is a “lossy” format. That means that its compression algorithm permanently loses data about the image for the sake of a smaller file size. There’s no way to get that data back. PNG is not a lossy format, which means that it compresses the image data in a way that it can faithfully recreate the original input image.

So, what do you think happens when you open a JPEG and re-save it as a PNG? That’s right… it looks exactly like the JPEG did.

Like I said at the beginning, once you go JPEG, you can’t go back. The only option is to track down the original source image in a lossless format, or to manually clean up the results as best as you can.

I wish I could say I’ve never done this, but I’m a pragmatic individual, and I also like to try to solve problems myself… it’s often faster and easier than tracking down the original source. More times than I can remember, I have used the flood tool to turn splotchy logos back into blocks of solid color — doing my best to clean up the anti-aliased edges. And when the characteristics of the logo are right, I’ll often re-set the text in the original fonts (recognizing fonts by sight is a valuable skill), tweaking Bezier curves if the logo has any customizations, and then try my best to faithfully recreate object shapes by tracing them with the pen tool.

It’s perversely kind of fun, and I especially like when I can do it without even bothering to tell the client. They usually just care about the results, not about how the sausage gets made. Except when the client is an Italian restaurant. Then I let them worry about the sausage.

Edge of what?

Let’s talk about Internet Explorer for a minute. Approaching two decades into a career as a web developer — cripes! how is that even possible? — I have spent a big chunk of my life hating Internet Explorer.

There was a time when I didn’t hate it. For several years, Internet Explorer was the best web browser for the Mac. (Yes, really!) But right around the time Apple released Safari and Microsoft decided to pull the plug on the Mac version of IE, everything started to go sour.

In the early 2000s, when Windows XP was released, and Internet Explorer 6 along with it, Microsoft dominated the tech world. Especially the business tech world. And with the web standards movement in its infancy, Microsoft could pretty much do whatever they wanted with the browser. Internet Explorer 5, 5.5 and 6 each introduced new, Microsoft-only technologies (VBScript, ActiveX, .NET, etc.) that became deeply entrenched in the business world, where countless corporate developers created indispensable internal web applications that were not only dependent on Internet Explorer, but specifically on quirks of version 6 (or 7) of IE. It’s a big reason why there are still office computers running Windows XP and IE 6 or 7. Because even as bad as IE 8 is, it was the beginning of Microsoft’s acknowledgment of the changing times and reluctant move towards web standards.

Long story short, I don’t just hate IE because it’s from Microsoft, or because it’s fun to bash on. Contrary to the impression I sometimes give, I don’t hate Microsoft, and as much as I love to crank, I’d prefer a world where I didn’t have things to crank about. I hate Internet Explorer because it has made my job harder, for most of the time that I’ve been doing this work.

So, it probably goes without saying that I took the announcement of the death of Internet Explorer as good news. Of course, Microsoft has to make its own browser. Uh… just… ‘cuz. Of course. So with IE going away, Microsoft has announced “Edge”, their new browser.

Meet the new browser, same as the old browser

This morning Brand New posted the new logo/icon for Edge. At least, I think it’s a new logo. For a new browser.

Source: Brand New

What is this? No, seriously. What. Is. This.

This logo fails for me on several levels. First, and most obviously, it evokes Internet Explorer. Why would Microsoft want to do that? They’re killing IE for good reason. Why create an immediate association between it and their new browser?

I think this new logo fails both conceptually and in its execution. It’s just plain ugly. But more than that, the slice/swoosh thing doesn’t work. In the old logo, it was part of the “ring” around the “planet” that the perfect circle “e” represented. A bit hackneyed conceptually, but at least it was a consistent concept. But by using the “e” from Microsoft’s new humanist corporate font (I think) — which, taken on its own, is kind of an ugly shape anyway — I think, you lose the “planet” concept. And the rest of the ring outside of the “e” is gone too. So all you have left is this weird “e” with a slice missing, which makes absolutely no sense. The only explanation for the slice is as a deliberate evocation of the old Internet Explorer logo, which again it seems they should want to distance themselves from.

I like the new blue color. That’s about the only good thing it has going for it.

So far I have not tried the preview release of Microsoft Edge. Frankly, as a web developer, I am not enthusiastic about having to support another new browser, and I’m not confident that Microsoft is going to make a very good new browser, even though IE 9 through 11 were pretty decent. All I have to go by, at this point, is this logo. And what it tells me is that Edge is just a crappy knockoff of an already crappy browser. No thanks.

Postscript: I just noticed that exactly 6 years ago today I wrote a blog post that also discusses Internet Explorer. Even then — SIX YEARS AGO — IE 8 was out and I was already cranking about IE 6 as an old and outdated browser.

Brand New: Room 34 Edition

I’m a big fan of the blog Brand New. I like seeing the “before and after” of various brand identities.

Lately I’ve been contemplating a brand refresh of my own. I’ve been mostly satisfied with the current Room 34 Creative Services logo. I really like the “rings” design element, the color palette, and, even though it’s overused, the Avenir font:

But there are some things I don’t like about the logo. I’ve been getting a little tired of the colors (even though I like them); I’m increasingly regretting including the “.com” (even though I like the fact that my logo is my web address); and I don’t like the redundant “Room 34.” Plus, Avenir is overused.

So, today I took a first stab at a new identity. It has a new color palette, using one of my favorite colors, reddish-orange (or vermillion if you prefer a more poetic name for it), it eliminates the redundant text, and it switches to another of my favorite, but much less common, fonts: Proxima Nova:

I’m not 100% committed to this change yet; rebranding is a big undertaking, even for a business as small as mine. Switching to this new logo will require redesigning my website, my letterhead and my business cards. But I like the direction. I especially like the letterforms (or, I guess, numeralforms) of the “3” and “4” in Proxima Nova Black. So nice. The new logo is also more compact and scales down better than the old.

Update: Based on JW’s excellent recommendations (and a few observations of my own) I’ve made a few adjustments: 1) improved spacing between the “o’s” in “room”; 2) resized the rings slightly for better lockup with the text — the top of the “4” ring group is now aligned with the top of the letters in “room”; 3) slight change to the color in “CREATIVE SERVICES” so it is more readable on either a light or dark background.

Here’s the new version, on both white and black:

New Room 34 logo, revised
New Room 34 logo, revised

As long as I’m complaining about advertising…

Pepsi, what were you thinking?Yes, I am annoyed with the fundamentally stupid concept of the Cupcake in Bloom. And the guy in the Qwest ads, in the words of one reader, “just screams of d-bag.” But perhaps nothing in in the world of advertising, circa early 2009, is as ubiquitous or incomprehensible as Pepsi’s hideous new logo.

It’s even more hideous when you discover the full hogwash design pseudo-philosophy behind its creation. To that end, Brand New is here to help.

I think this really sums it up though. And no, you are not alone if you think it bears a striking resemblance to Strong Sad.

Then again, now more than ever there’s no such thing as bad publicity, and this whole thing has gotten me thinking a lot more about Pepsi than I ever would have otherwise. But I’ll still only drink it when there’s no Coke products in the soda fountain.

Obama: anatomy of a logo

OK, I will admit it. The first thing (OK, the second thing; his speech at the 2004 DNC was the first) that piqued my interest in Barack Obama was the sight of his logo on a sticker, way early on in the primary campaign (like, summer of 2007 early). It was clear right away that Obama had the best design team in the history of political campaigns working for him.

Let’s take a look at what makes this logo so great. Ultimately what it boils down to is that every detail is imbued with relevant meaning, and the overall result is very aesthetically pleasing.

First, it’s an O, for Obama. No-brainer there. It incorporates the requisite colors: red, white and blue. But what it does with them, and with a few simple shapes, is brilliant. The red and white stripes of the U.S. flag are there as well, blended into an unmistakable and powerful image: the sun rising over a rural American hillside (a cornfield, no less) into a perfect, clear blue sky. Now that’s “morning in America.”

On a related note, I’ll leave it to you to interpret the meaning of the logo’s appearance in a John McCain commercial.

On another related note, this.