Website Blunders: How to Look Like a Pro (and Not Like a Fool)

We all know we have just a split second to make a great impression online. Users hover over their mouses, ready to click away from your site if they don’t like what they see.

There’s a lot riding on the quality of our websites. (No pressure!)

This week on Hit Publish, I’ve invited three Copyblogger experts to share their best advice on designing websites that put the best face on your online business.

Tune in to hear from Rafal Tomal, Brian Gardner, and Tony Clark as we discuss:

  • The real reason “flat” design has taken hold, and how to recognize it when you see it
  • The website technology that’s the wave of the future, according to Brian Gardner of StudioPress
  • How to be inspired by other websites (and not follow their lead blindly)

The Show Notes

Website Blunders: How to Look Like a Pro (and Not Like a Fool)

Pamela Wilson: When your business is online, especially if it’s a 100% online business, there is a lot riding on the quality of your website — you know this.

And if your website looks like that it was put together by a 12-year-old, or if you’re using out-of-date technology, or — and this might be the worst problem — if you haven’t found a way to be original, and if your website looks like everyone else’s website in your space, you might be in big trouble.

Because here’s the thing: we all have a split second to make an impression online. It’s so easy for site visitors to just click away if they don’t get a great first impression.

Welcome to Hit Publish, where I cover simple ways to get better results with your online business. This is Pamela Wilson of Copyblogger Media.

This week I’m bringing in Copyblogger team members to share their answers to your online marketing questions, and show you how to build the business that grows your profits. I want to thank you for downloading this podcast, and I want to thank Rainmaker.FM for hosting it. Ready to go? Let’s Hit Publish.

The Real Reason “Flat” Design has Taken Hold, and How to Recognize it When You See it

Pamela Wilson: I want to start our conversation with Rafal Tomal, our Lead Designer. Rafal’s from Poland and lives in Chicago, and we are glad he’s here.

Back in 2011, Rafal began a major transformation of Copyblogger’s visual brand. His aesthetic sense now graces every element of the brand, from websites, to our Rainmaker Platform software, to the signage at our Authority Rainmaker event.

His design fingerprints are on everything. He’s not the only one designing for Copyblogger nowadays, but he’s the one who started the visual transformation. And it all started with a redesign that gave Copyblogger an updated, more contemporary look.

I asked Rafal, what are the design elements that make a website look dated? What should we be avoiding?

Rafal Tomal: I think one of the biggest things that makes a design look dated is big, fat, glossy 3D looking buttons. I think it’s an age of flat design, so we don’t need to make our buttons look 3D, big and glossy.

Pamela Wilson: So you’re talking about the buttons that look sort of three-dimensional, almost like they’re made of glass, or chrome.

Rafal Tomal: Yeah. I’m talking more about the style. It’s always a good idea to make your buttons look like real buttons, but you can achieve this using very shallow shadows or borders.

You don’t need to make them flashy. You don’t need to make them glossy, or add that kind of different style to them. If your entire design is very minimalistic, then you don’t have to overuse colors. Flat buttons with simple color, and no accent colors, stand out and look really good and modern.

Pamela Wilson: So for people who might be afraid to use a flat-style button, it sounds like as long as it’s used within the context of a site that’s fairly subtle and minimalistic, it’s going to stand out just fine.

Rafal Tomal: Yeah, it all depends on the context. So, if your entire design is flat and minimalistic, then flat buttons with a different color would stand out.

And, of course, if your design has too many distracting items, and color items, and there are some ads in the sidebar or different banners, then you may want to use different styles to make them look more prominent.

Pamela Wilson: Right, that make sense. It sounds like overall you’re saying that a more minimalistic style also looks more contemporary.

Rafal Tomal: Yeah, that’s for sure. The other thing that I think makes your website look dated is if you use too many, and too bold, drop shadows, and different elements.

Like I’ve said before, it’s the age of flat design and so everyone’s looking for this trend, and if most websites are half-using flat design, and your website has big, bold drop shadows, then, again, your website will be looking a bit dated compared to other websites.

But if you really like shadows and you want to still use them, I would suggest to use very shallow and minimal shadows, just a few pixels — and light gray shadows also look very good.

Pamela Wilson: Right. It’s funny, I’m smiling over here because drop shadows definitely had their day, and it was almost like we were trying to pretend that our screens weren’t screens — they were this three-dimensional space, and so everything had to have a drop shadow behind it.
But now it seems like we’ve embraced the fact that the screen is a flat surface, and that’s okay, we like that. It looks more contemporary.

Rafal Tomal: Yes, I think the audience has also changed through the years. People have learned how to use the interface of websites and applications.

I give a big shoutout to mobile apps for introducing flat design, and for teaching people how to use interfaces.

So now, people can use an interface just by looking at icons. We don’t even need to use text anymore. If you have a hamburger icon, everyone knows it’s a menu. You don’t need to explain that it’s a menu.

I think everything has changed and flat design became very easy to read for the average user.

Pamela Wilson: It’s definitely less cluttered-looking, and it’s interesting to think that it’s a result of people simply becoming more sophisticated about the way they interact with websites and with devices.

The three-dimensional design maybe gave them more of a clue about what they needed to do — click this button that’s all shiny and has a drop shadow under it — but we don’t need that much help anymore.

Rafal Tomal: It’s all evolving, and now, modern web design is also more spacious and everything is fluid, everything is responsive.

So that’s another thing if you make your website, maybe if you add more white space and if you make more amends that are responsive to how big the screen is, you’ll make your website look more modern, and it won’t look so dated.

Pamela Wilson: Rafal recommends we flatten out our design. He says that users are more sophisticated now and don’t need fake, 3D items on their screens to understand where they are on your website.

There’s a lot more where that came from, but first, I want to share an opportunity with you.

Coming up this May, we’re holding our Authority Rainmaker event. It’s an opportunity to spend two focused days on building a solid foundation under your online business.

It’s a little different than other events, as there aren’t tracks you have to choose from.

Instead of that, the entire group stays together the whole time, listening to the same speakers, and learning the same things. What this means for you is that at the meals (which are all included and delicious), you have an opportunity to really absorb and process what you’ve been learning during the day, because you have a chance to talk to other people at the event, and you know that they’ve listened to the same information that you’ve listened to.

You can share a little bit about your business, and just do some old-fashioned networking, too.

On top of that, there are two parties, so you have another opportunity to do even more networking. This year the event is going to be held at the beautiful Ellie Caulkins Opera House in Denver, Colorado. If you’re a Hit Publish listener, I would love to see you there.

Learn more at rainmaker.fm/event.

The Website Technology That’s the Wave of the Future, According to Brian Gardner of StudioPress

Pamela Wilson: I want to tap Brian Gardner next. Brian is Chief Design Officer and is a founding partner at Copyblogger Media.

Brian has his fingers on the pulse of what is working on the web. He kind of has to, so I asked Brian what he thought was the up-and-coming technology that we should all be paying attention to.

And I have to tell you, I didn’t expect him to say what he said, so listen in and see what you think.

Brian Gardner: Now that’s a very relevant question to me, because within the last few months, I’ve recently moved my website from a stand-alone installation of WordPress, with a theme system and a number of plugins, over to our Rainmaker Platform.

Now it might sound like I’m eating my own dog food, and I am, but I’ll tell you why. When I had my theme, and maybe about ten plugins, there were a number of things I had to continually focus on, and update, and make sure worked well together.

When I moved to Rainmaker, I knew that everything was going to be cohesive, and that all I had to do is just focus on my content and pushing my brand.

Pamela Wilson: Well, I’m joining you next to the dog dish, and I’m eating the same dog food, because I just finished doing that for my own site, and I have to say, it is such a relief to not have to keep up with all those little bits and pieces.

And then the other piece for me is that there are all these technologies that I was paying for separately, and having to patch together and make sure they all cooperated and talked to each other, and I don’t have to deal with all that with Rainmaker, because it all fits under that one umbrella.

It’s been a great product for me. I’m glad that it’s been a good experience for you too.

Brian Gardner: Yeah. Also, from a user perspective, the interface that we’ve built with Rainmaker is so much cleaner and things are where they feel they should be.

Pamela Wilson: What I think is so interesting on the Rainmaker backend is that the information is organized in a way that you would logically go through it, and put together on your site, and that’s the way that Copyblogger promotes running an online business.

It starts with design, because obviously, that’s the first thing that people see, and then content, conversion, traffic, and there’s a place to check results. When you are using it, it’s a great way to see the order in which you’re supposed to be tackling things.

I find that very helpful, do you?

Brian Gardner: Yeah. It’s also a time efficiency thing. Outside of the technology itself that I’m using to publish my material, being able to check analytics and statistics within the Rainmaker dashboard means I don’t have to go log in to other accounts, and spend more time looking into that kind of thing.

Pamela Wilson: So it sounds to me like your answer to this question is that Rainmaker is ushering in the future.

Brian Gardner: As far as I can tell, yes, and it’s doing a great job.

Pamela Wilson: Brian thinks we should be paying attention to Rainmaker, and I have to say that I agree. I’ll put a link in the show notes so that you can register for the 14-day free trial, if you haven’t tried it out yet. You can see for yourself how it works, and see if it’s a good fit for your business.

How to be Inspired by Other Websites (and Not Follow Their Lead Blindly)

Pamela Wilson: Finally, to wrap things up today, I went to Tony Clark, our Chief Operating Officer. One of Tony’s super powers is he has this innate sense of what a website needs.

There are so many great websites out there that are doing amazing things, but Tony sees a dark side to getting your inspiration from what everyone else is doing on the web.

He has some good advice for how to get inspiration, but also find your own path.

Tony Clark: I think the biggest mistake is trying to duplicate what somebody else is doing because it is the “followed methodology.” And not always is something right for your particular audience, just because somebody else is doing it.

I’ll give you an example: opt-in forms that pop-up.

There are people who hate them, there are people that love them, and there are people who say you absolutely must have them, and those are usually the people selling pop-up plugins or affiliates for pop-up plugins. There are other people who say, “I would never do that, so you should never do it.”

What you really need to do is determine what your audience needs and by testing, you can actually determine whether it is working, or whether it’s driving away your audience.

So I think the answer to that question is, copying what somebody else does just because you think that that’s what you should be doing, is one of the biggest mistakes that people make.

Pamela Wilson: So being inspired by what other people do isn’t necessarily a bad idea, but it sounds like you need to take that second step and test it.

Tony Clark: Exactly, and you saw that a lot back in the early Internet marketing days, where everybody followed the yellow highlighter methodology. It didn’t work for every product. It worked really well for some, but not for others.

Long copy still works really well for some sites. Videos work for some sites, but they don’t work for others. So you need to find out what works for you. Be inspired, but then take that and tailor it through testing, through good quantifiable data that you’re collecting, about how it’s actually working to get to the end result that you’re trying to achieve from your website.

Pamela Wilson: So there’s nothing wrong with taking the shortcut of looking at what other people are doing, but you do have to tailor it for your own audience and then check your work.

Tony Clark: Exactly, because you’re trying to achieve a result from your website and from particular pages, and you measure whether it’s working or not. Whether you’re getting that result. And if you take some inspiration from another site, that’s great. But then test it and make sure it’s actually accomplishing what you’re trying to accomplish.

Pamela Wilson: Let’s see where that leaves us.

Rafal recommends that we keep our sites pared down and simple. It’s the best way to keep the focus on your information.

Brian thought we should look at Rainmaker, and I’m leaving a link in the show notes so you can do just that.

Tony said to keep your eyes open and be inspired by what others are doing, but forge your own path, because that’s the only way to serve your particular group of customers.

So here are my questions for you:

What will you do this week to simplify your website design?

How can you take inspiration from what others are doing online, but find your own version of your solution — find a version that’s tailored for your audience?

This is Pamela Wilson, and I want to thank you for being one of the great-looking Hit Publish podcast subscribers.

Take a look at the show notes for more information on today’s topic. And if you enjoyed what you heard today, take a moment and leave a review for Hit Publish on iTunes.

I personally would love to hear from you, and leaving a review helps other people to find this great information. Thanks so much for listening.

Until next time, take action and Hit Publish.