11 Trends in Web Logo Design: The Good, the Bad and the Overused

By Jolie O'Dell  on 
11 Trends in Web Logo Design: The Good, the Bad and the Overused

This series is brought to you by the Intel AppUp℠ Developer Program, which provides developers with everything they need to create and then sell their applications to millions of Intel Atom™ processor-based devices. Learn more here.

Mashable Image
Credit:

We've also picked up some knowledge about trends in this field. Some of the trends are good; others, regrettable. Others still are simply overused, which is the saddest scenario of them all. We hate to see a good design trick or typeface grow hackneyed over the course of a few months, but it happens all the time, unfortunately.

In this article, we've identified 11 trends in web company logo design. Hopefully, you'll see a few here that apply to the startups and web apps we write about every day. And of course, we've included some handy illustrations as a sort of field guide to the logos of the web.

Take a look, and let us know what you think of these trends -- and what trends we should have included -- in the comments.

1. Badges and Buttons

Mashable Image
Credit:

We've moved away from the once-ubiquitious BETA! button, but location-esque badges, app-like icons, and "play" buttons are still showing up all over the web. These logos tend to be quite "shiny," thanks to a few carefully-blended white gradient layers. The square logos have rounded corners. Some appear to glow as if lit from within, which is a compelling and trendy effect in itself. All in all, the badge-and-button set look quite touchable.

Still, this trend's days may be numbered, if only due to overuse and association-bordering-on-marriage with the Apple/iPhone brand. See also: Wet floor effect. Unless you're designing for a pure-play iPhone app shop, sail these seas with caution.

2. Speech Bubbles and Megaphones

Mashable Image
Credit:

If social web apps are all about communication, then it stands to reason that many social web company logos are all about talking. We see fewer logos that revolve around listening (if you happen to see a giant ear logo in the wild, do let us know), but megaphones and speech bubbles abound.

3. Fun With Opacity!

Mashable Image
Credit:

Remember the first time you discovered Multiply and Overlay blend modes in Photoshop? If that moment changed your life forever, then you probably understand the beauty of a simple, elegant logo that delicately plays with opacity.

While this logo treatment won't work for every web app, it's a versatile and timeless way to present classic shapes in a new light. We're seeing this basic effect used simply in MasterCard-reminiscent designs, and we're seeing much more complex opacity effects used in logos for HTML5 and Microsoft Silverlight, for example.

Playing with blending modes, opacity and overlapping shapes can also be a fun way to experiment with analogous color schemes.

4. Kawaii Illustration

Mashable Image
Credit:

Calling all woodland creatures: You're wanted on the Internet. In fact, the only time you've been in greater demand than you are now was when Disney was making those saccharine "princess" films.

Why are these wide-eyed, adorable critters making their way into logo design? Apps are for adults, right? Especially apps such as Seesmic, a powerful web app dashboard for power users and the enterprise, and GitHub, an industry standard for source code hosting.

We don't know exactly how, when or why kawaii made a comeback into serious-business logo design, but with logos this cute, who are we to complain?

5. Scripts, Slabs and Other Cool Fonts

Mashable Image
Credit:

Say it with me: "I will not use Archer for a web company's logo design."

Archer and its ilk were used to great effect over the past couple years on a number of memorable web company logos. That being said, the Year of the Slab is definitely not over. In fact, it's more of an epoch than a traditional Gregorian year at this point. Slab serif fonts -- if they're unique fonts -- are still a viable alternative to been-there-done-that sans serifs in logos, and the web community still enjoys them.

That being said, a good, juicy script can be one of the liveliest, most unexpected logo choices yet, particularly if your logo is solely typographic. Rephoria uses my personal favorite, Candy Script, a swash-heavy number that's almost too voluptuous for work but which still makes the cut for a single-word logo.

Just remember: When using more unusual fonts for logo design, restraint and legibility are key.

6. Verdant and Plant-Inspired

Mashable Image
Credit:

Plants and leaves aren't just for green tech companies, folks. When you're trying to project growth, one of the most obvious logo choices is flora. A shy set of leaves, a furling bud, a sprouting seed -- what could better convey your company's fresh problem solving and rapid expansion?

7. Quadrangles

Mashable Image
Credit:

It's not a rectangle, it's not a square, but whatever it is, it's popping up everywhere. Quadrangles are, if the web is to be believed, the new dots. From rhombuses to parallelograms to indescribable yet angular blobs, these shapes strive for post-modern and consumer-friendly.

8. Retro Game References

Mashable Image
Credit:

Perhaps it's because the newer crop of web designers are also children of the late eighties, but we've been seeing a lot of pseudo-retro, video game-inspired logo work lately. While these designs are definitely quirky, geeky and cool, beware using them for a general audience; not everyone feels the same nostalgia we do for an 8-bit, pixelated graphic of a mushroom.

9. Color-Coordinated Compound Words

Mashable Image
Credit:

Web startup names and logos are inextricably linked. We're a couple years past the compound word phase (which was most virulent right before the tragic "missing vowel" phase that gave birth to web companies with names like "Packg" and "Clevrr"), but we haven't left behind our love for merged-word logos in two snappy, coordinating colors.

This trick is one of the oldest in the book. It was notably used for Vignelli Associates' 1967 rebranding of American Airlines, whose two-word name became a one-word logo in red and blue.

10. Logotypes

Mashable Image
Credit:

The big boys of the web, sites such as Google and Facebook, have inspired the logo design of a generation with their utter simplicity. In many cases, those initial logotypes were less legitimate logo design and more "put our startup's name in a simple font and stick it up on the web, we'll deal with branding later."

The name-in-a-sans-serif look says your company has nothing to prove and that you focus on product over promotion. If it's well-executed, it's a powerful statement to make. However, if poorly executed, it looks hasty, sloppy, juvenile and amateurish.

Logotypes can also be a great excuse to play with exciting typefaces and trendy treatments, such as the embossed or letterpress look that's getting so much play these days, thanks to CSS3.

11. Nodes, Spokes and Hubs

Mashable Image
Credit:

Between concepts such as linked data and the synaptic web, you had to see these designs coming. They remind us of molecular structure and K'nex, an updated take on the crop of mid-century modern Sputnik-inspired designs of the 1950s. These logos are usually intended to represent the interconnectedness of people and content on the web, or, in a more literal interpretation, computer hardware circuitry.

An excellent study of this concept is Bernard Barry's designs for the 2010 f8 conference.

What Trends Are You Spotting?

What trends are you seeing in web company logos these days? What are you already sick of, and what do you want to see more? Please share your observations in the comments.

Series supported by Intel AppUp℠ Developer Program

This series is brought to you by the Intel AppUp℠ Developer Program, which provides developers with everything they need to create and then sell their applications to millions of Intel Atom™ processor-based devices. Learn more here.

More Dev & Design Resources from Mashable:

- Top 5 Web Font Design Trends to Follow

- HOW TO: Be a Hybrid Designer/Developer

- Flash vs. HTML5: Adobe Weighs In

- 10 Free Web UI Kits and Resources for Designers

- Top 10 Accessories for Typography Nuts [PICS]

The biggest stories of the day delivered to your inbox.
This newsletter may contain advertising, deals, or affiliate links. Subscribing to a newsletter indicates your consent to our Terms of Use and Privacy Policy. You may unsubscribe from the newsletters at any time.
Thanks for signing up. See you at your inbox!