Want to create website wow? Today I’m sharing a handful of graphic tricks that will spice up your website.
They’ll make it easier to use and more pleasant to look at.
These visual tweaks will help your site go directly to your visitors’ hearts, because it will be easier to navigate, and full of imagery and color that’s warm, inviting and makes a connection.
1. Pick one action and make it obvious
When a visitor arrives at the homepage of your website for the first time, what one action would you like them to take in response to what they find there? It may be:
- To sign up for your free e-mail course
- To purchase your product
- To contact you for a consultation
- To fill out a form requesting more information
- To download your white paper, case study or free report
Whatever one action you’d like them to take, make it the most visually prominent item on the page:
- Give it a top left or top right position on the page.
- Emphasize it with bright colors and bold typefaces.
- Use a compelling call to action.
- Don’t try to send them in more than one direction at once.
2. Focus on content with readable fonts
You want people to read the words you’ve written, and linger on your page. Make it easy for them by using typefaces that are easy to read.
I’ve written a lot about type on this site already. Here are the main points to remember:
Pick fonts with a large x-height. This is the space between the baseline the letters sit on, and the top of the lower-case letters. Fonts with large x-heights are easier to read.
Break up long paragraphs of text into manageable chunks. People read screens differently than they read paper, and small blocks of text are easier to skim.
Use no more than two typeface families at a time. Pick families with multiple weights; regular, bold, italic, bold italic, for example. Maintain a cohesive overall style by sticking to these two fonts.
Fonts can be hosted off site and “served up” on your website, allowing you to choose from a broad range of fonts.
Use the posts below for guidance when choosing and combining typefaces:
- 7 Typographic Resources and 1 Type Joke
- Typeface Combinations That Work on the Web
- Please Don’t Squeeze the Letters
- Why I Hate Verdana
3. Direct their eyes with plenty of bold subheads
Web surfers skim pages rather than read them in great detail.
Some people think this is a reflection of short attention spans, too much television and widespread Attention Deficit Disorder.
Not me. Here’s what I think: screens are lit from behind. They’re reflective. They’re not the easiest surfaces to gather information from.
Because of this, we skim. We zip down web pages, moving in an “E” pattern from top left to top right, down the page and across again.
There’s nothing inherently wrong with it. It is what it is!
You can either fight reality or work with it. I prefer to work with it.
If you want to work with it, too, break up your website copy with plenty of subheads. Spend time making them compelling, and make sure if your reader skims over your article reading just the subheads, they’ll want to dig in and read your whole piece.
4. Use color to make it cozy
You might be a little intimidated by color, but there’s no reason to be.
Oh sure, it’s easy to get it wrong, but taking the time to get it right can be one of the best things you do on your website.
Let’s talk website backgrounds, for example. Many people use WordPress as a content management system for their sites, and apply a theme to give it an overall style. This is a great solution, but I see people missing a fantastic opportunity to inject some color and warmth into their sites because they leave the site background white.
I’m not talking about the content area. I mean the background areas around the content. If you leave this white, and your content area is also white, it’s like placing a white piece of paper on top of a white table. The content area doesn’t stand out, and it’s just boring.
There’s nothing wrong with mostly white sites, but if you want a quick injection of personality and warmth, add some color to your background. It will “contain” your content area and make it seem cozy. It won’t be floating in a vast white space with no edges.
You’ll see that your content stands out better, and your website seems more intimate and easier to read.
5. Find images that convey a feeling
A thought-provoking image can draw people into your text like nothing else. If you accompany the image with a caption, that’s even better! Studies have shown that captions are consistently some of the most-read text on a page.
Look for photos that convey a feeling. If you plan to use a photo of a person, try to find one where the person in the photo is making direct eye contact with the viewer.
If the photo has specific “direction,” use the photo’s sight lines to send your readers’ eyes where you’d like them to go.
For more on images, visit these posts:
From website boring to website wow!
Your site might not be exactly where you’d like it to be right now. But you can create that “wow” factor by spicing it up with clear navigation, readable content, cozy colors and compelling images.
Want more design advice?
Check out my Classics: The Design 101 Series of videos on my YouTube channel.
While you’re there, make sure you subscribe so you don’t miss out on any of the new videos I’m creating to help you grow your online business!
36 thoughts on “Website Wow Techniques: 5 Ways to Spice Up Your Boring Site”
I find is really surprising that there are not much comments on this blog. There is so much awesome information which took me years to learn from various blogs.
Today, i can find all that I’ve learned with ease here. I wish you the best and congratulate on your blogging.
I am working on an free ebook, that I will write to you about personally to discuss. I also downloaded your ebook from the previous post and liked the information you shared there.
Thanks, Eddie! I find people are a little shy to add a comment until someone else has left theirs, so I’m always extra grateful for whoever breaks the ice and makes the first comment. Today that’s you 🙂
I am gonna do my best to be a regular here. Hoping that others would follow.
I am gonna share my views and suggestions.
“I’m going to be a regular here” is music to any blogger’s ears, Eddie. Thank you!
I agree whole-heartedly about your statements on typography and clear navigation…. But I have trouble with the white background comments. I have a white background, and I’ve done it that way strictly on purpose. I want people to focus on my product, which is often colorful or well lit. So I’ve done away with distracting backgrounds. Why would you advise colored backgrounds in this particular case, instead of white? Drawing attention to the product is the idea, and if it’s the only colored thing on a page, surely it would standout and be eye catching…?
Thank you so much for your tips and techniques. I truly enjoy your newsletter, and always look forward to your information!
I had a feeling that statement might be controversial!
It’s not a blanket recommendation that works for everyone, of course. In the case of your site, you have borders that are clearly delineating the content area, and those help focus the eyes.
That being said, I wonder if you have you ever tried using a light colored background on either side of your main content area? So many of your jewelry pieces are silver, and you might find a light tone surrounding your content really makes them pop from the page.
Seeing is believing. If you try it and don’t like it, then you know for sure.
Thanks for the positive feedback, Kaelin. As with most things, your mileage may vary!
Yes, the white background point is an interesting one! I recently redid the look of my blog, and I went with a white background. The reason being that my header and especially the email signup form are in really bold colours. But this has given me food for thought. Maybe I’ll play around and at least take a look at what a coloured background would look like. Thanks Pamela!
I helped someone just recently who had a white-on-white website. We were on the phone on a Sunday (low traffic day!), and I tweaked his site and had him refresh with every change I made to see what he thought.
The biggest “oh, yes!” reaction I got was when I turned his background from white to a very light, warm beige. It doesn’t sound like it would make that much of a difference, but it did. It looked great!
I think sometimes people leave their backgrounds white because they can’t or don’t want to make a decision about color. It’s worth experimenting to see if it makes a difference. It’s not for everyone, but I think in most cases backgrounds look better with at least a hint of color.
Great post, thank you! The first point is a revelation, something I never would have thought of–I’m definitely going to keep that in mind when designing my business site.
I’ve heard some of your other points before, but I’m more inclined to listen this time because you use them pretty effectively. Not to fangirl all over you, but this is probably one of my favorite layouts; there’s a splash of color but not too much, the interface isn’t too crowded, and you have a great balance of text-to-line breaks. Walls of texts are a scourge, but I hate one-sentence paragraphs even more! This article was nice and readable thanks to that balanced ratio. Oh, and I love that the logo is big, but doesn’t dominate my small netbook screen and hide the content below it.
Thanks, Eileen. I’ll confess I sneak one-sentence paragraphs in once in a while, so my apologies in advance for annoying you. 😉
Seth Godin and Steve Krug have both written a lot about the concept of deciding on the one action you’d like visitors to take. It makes sense: people get to your site and are trying to sort through your information. The easier and more obvious you make it for them, the better the chance they’ll respond and take the action you’re looking for.
One-sentence paragraphs are great for effect–occasionally. Having an entire article made out of them is like putting the entire article in caps, or in bold, or ending every sentence with an exclamation point!
Agreed: anything that’s repeated over and over like that gets annoying. Thanks for your comments, Eileen.
I would disagree with Eileen over there. If you check out copyblogger. All his articles are formulated in a very similar pattern. Its easy to read and does not scare the readers away.
I have tried colored backgrounds in the past, and my clients have one and all disliked them
Intensely on my site. They’ve said it takes away from the spacious feeling they associate with my website, rather like wandering through a large art gallery. That said, I do want to make my website more approachable and friendly to new browsers. I will definitely give it further thought- thank you!
I’d love to hear how it goes for you, Kaelin.
If I was to make any color recommendation at all, it would be to try colors that are just one shade away from white. Sort of like when you go into the paint store and look at the chips displayed under “Whites.” They all have a hint of one color or another. Using a tint like that would maintain the spacious feel, and might warm it up just a little.
Keep us posted!
After playing with the hexadecimal color wheel (and a whole slew of paint chips) I did end up taking your suggestions. What do you know…. my clients are telling me how warm and inviting my site is now. It still looks white, it still looks spacious, but the tone is different. Thanks, Pamela! Now to work on my calls to action… 🙂
That is so cool, Kaelin. I visited, and you’re right: it’s a very subtle difference, but it seems just a little warmer. Congratulations!
One of the best tips I have (and I think I stole it from your free Design 101 course, Pam) is that the text and its formatting are part of the design. I find it helpful to look at the text and ask, does it look nice?
A little variety works wonders: short paragraphs, one-sentence paragraphs, sub-headlines, maybe a few embolds and italics, a few links, a few bullet points. Like your current post. It looks attractive. It looks easy to read. And it reads well. Perfect!
You can’t steal something that’s given away for free, can you, Jack? 😉
Thanks for your comment!
Pamela: Great list of actionable steps! I know a lot of real estate agents (my niche) who can benefit from a little of this. Often, it’s information over-load when you visit a site or the intention is all wrong.
I’m all of simplicity and positioning things with intent. What do you want the user to take action on? Is it clear? If not, how can I make it clearer and simpler to navigate?
Anyway, love the advice 🙂
Thanks, Ricardo! It has to be tough for agents: I’m sure they have lots of ideas they want to push on the home page. It must be very tempting to load it up with properties they’re trying to move.
Yes, they have tons of things they want to “Push” on the homepage. Sometimes, less truly is more (and this is a point folks often forget).
Have a great week Pamela!
You, too. Keep up the good fight, Ricardo!
Color! I’m creating an E-book right now, I just took a break to read some blogs and interact and I was LITERALLY just writing about this. Great post.
Awesome, Ryan. I’m glad you found my blog! Thanks for the visit, and don’t be a stranger, OK?
This is interesting and timely food for thought. I’m in the middle of a web redo (including a new url w/ just went live yesterday). I have a new header and think I plan to keep things white/white for the spaciousness but I might consider playing w/ some subtle background color variation. I’ve redone the blog and I’m pleased, the main site is next and it’s a biggie. Color might be fun.
FYI, your post on photo sight lines has been a lot of fun for me to implement on my blog. Can’t see what fun ideas you come up w/ next for me to explore. Thanks!
Have fun, Cynthia. The great thing about the web is it’s easy/cheap to tweak. The bad thing is it’s so easy to tweak, you could spend your life tweaking! 😉
Wow!! This was life-giving information to a newbie website designer. Thank you so much for sharing your knowledge with us! That is why I love reading your posts…always helpful.
Thanks, Sven. I appreciate the feedback!
I love the font that you use for your website. Could you please let me know what font you use?
Sure, Pete: I use Chapparal Pro, from typekit.com, which is a paid font service. The headlines are League Gothic and they’re served up from typekit.com, too.
Awesome. Thank you so much. It’s the best font for the web I’ve come across so far!
Another amazing post. So rich with great content.
Thanks so much. I have been buried in fonts to create a custom signature today.
Any recommendations for something close to Ministry Script but not as expensive?
It seems silly to pay a high price for something that looks like your own signature.
Thanks for sharing all your great wisdom and talent!
Stephanie, try looking on fontsquirrel.com. All the fonts are free, and you might find a good match. You can find their script fonts on this page.
Comments are closed.