What your site is missing: A simple trick to make eyeballs stick (#1 in a series)

by Craig McBreen · 27 comments · Branding, Design


If I told you there was one little change you could make on your site to build audience, would you want to do it?

You would want to implement it right away, correct?

Yeah, me too.

Listen. I’m no blogging guru, but you know what? I don’t trust those guys anyway.

I do have 20 years of experience in branding and design, and if there’s one thing I’ve learned, it’s that little tricks make all the difference.

So, I imagine you would like to learn and implement this stuff, huh?

Well, please read on.

This is about understanding the subtle nuances that guide the eye, then using this knowledge to help grow your audience.

There once was an über group of German psychologists who developed a term called Gestalt, which basically translates to “unified whole.”

It’s one of those graphic design 101 principals the wizards at Design U. usually teach.

There are a group of principles, but today you’ll be introduced to one. But it’s bang-on and so easy to put into use.

These theories describe how peeps (read: your potential customers) often organize visual elements into groups. And applying just one of these principals can help you in many ways.

Draw your reader’s eyes to the sweet spot.
Continuation (Continuity). You’ve heard those terms before, right? Uh-huh. But now think about Continuation in the context of one simple design element on your page.

If someone is looking at a part of your site and their eyeballs are guided from one object to the next, well bammo, that’s continuation.

Those lively eyes are compelled to move.

Some even call it Good Continuation, but it still means the same thing: If two or more thingamajigs intersect, most good citizens perceive one, if there is good continuity of course.

In other words, elements are seen as a whole if they follow a direction. Think about a pattern appearing to continue, even if it doesn’t.

Now take a look at this

Do you see how continuity is a more powerful guide than color?

Eyeballs will follow a pattern if shown the way.

And you can implement this little practice right away.

Think about photos.

Now go back through my posts and take a look at the shots I’ve used.

Do you see a pattern?

In many cases, the model’s glance guides your eyes to a headline or the opening sentence of a post.

Now look at the image at the top of this post ;)

It’s so “marketing 101,” but it works.

And even if there isn’t a face, I still use direction to guide the eyes. In this post, I “flipped” the shot horizontally so the nasty snake and delicate hand both guide the eyes to the opening.

Take a look at the flame here.

This isn’t Gestalt perfected, but you get the picture. I don’t use this method all the time, but it is a good practice to get into.

I also use continuation at the top of my right sidebar. A simple, but effective arrow works and helps bring in a few subscribers.

Take a look here and see where the chimp guides your eyeballs.

Or here. Chris Garrett does a great job with his opt-in, dead-center and a subtle use of arrows.

Now go back and look at my images again, just for fun :)

So, what are you going to do?
If you’re willing to burn the midnight oil writing that killer post, why not spend a bit more time looking for “that” image or simply edit a shot to make it work for you?

A subtle design change using this principle might make all the difference in the world.

Oh, and talk about continuity … this is a series, so stay tuned, or better yet, just subscribe.

I’ll still be motivating, but this place is going to be more about helping you grow your business through branding, design, the psychology of design and story.

Have you used this law in your design?

How have you used images on your blog?

If you think this was of any help whatsoever, spread the knowledge and Tweet away by clicking here.

Sign-up Today to Get Your FREE eBook.

I take your privacy very seriously

{ 24 comments… read them below or add one }

Brian Thompson October 15, 2012 at 2:25 pm

Great tips and advice Craig.

And I too have a wee-little tip I’ve learned along the way, which I’d like to share.

When blogging, I recommend never interrupting or disturbing the left-hand reading margin, it affects the reading “flow” and people often won’t read past the first “jump”.

For example, this usually only occurs when people use the left-align option for an image (as it is in this post), rather than right-align.

It’s a super-tiny small change that most people won’t even notice, but I find it makes reading and skimming so much easier.

What do you think?

Keep up the great work!
bt
Brian Thompson recently posted..The DIY Daily Podcast #229 – October 12, 2012My Profile

Reply

Craig McBreen October 16, 2012 at 12:30 am

Hi Brian,

It’s funny you mention that, because with the new design I’ve been thinking about switching this. In fact I was considering making this change recently and got hung up on the left-aligned images, mainly for overall balance.

My main goal regardless was to make the first few lines very short in length which also helps. But a great suggestion and I might be making that change very soon. Keep an eye out ;)

Thanks!

Reply

Ralph October 15, 2012 at 5:29 pm

Very interesting sir. NOW you are talking my language. Even though my design sensibility comes from bricks and mortar we represent everything graphically so this really resonates with me. Great tip.

BTW, have you seen this (F pattern for reading web content)? Whattya think? Does that play into what you are saying or relate in some way that makes sense? http://www.useit.com/alertbox/reading_pattern.html
Ralph recently posted..Does a dreamer have any business being in business?My Profile

Reply

Craig McBreen October 16, 2012 at 2:33 am

Hi Ralph,

I was hoping you would give this your stamp of approval. Thanks!

Thanks for the link. The standout of the F-pattern study: “Users won’t read your text thoroughly.”

and “The first two paragraphs must state the most important information.”

No duh, right? But like the continuity stuff many forget to do it. I still have work ahead of me to truly optimize this site.

… Webdesign.tuts also has a nice little write up on this with examples: http://webdesign.tutsplus.com/articles/design-theory/understanding-the-f-layout-in-web-design/

Reply

Ralph October 16, 2012 at 10:16 am

Well, thanks. The tut’s examples and description is great. See? There’s something basic that I didn’t know about web design or a reader’s inclinations that should in some way be obvious. Very helpful.
Ralph recently posted..Does a dreamer have any business being in business?My Profile

Reply

Craig McBreen October 16, 2012 at 11:38 pm

Trying to be as helpful as I can … even with the most basic stuff ;)

Reply

Josh October 15, 2012 at 6:20 pm

I think about this quite often and play around with ideas about how to adjust my site so it does a better job of retaining eyeballs.

I find it all very interesting. Hebrew is read from right to left and I think there are other languages like that too.

I am focused on serving the largest community of my readers, but I sometimes wonder if there is a way/benefit to trying to adjust things to serve more.
Josh recently posted..Your Blog Is Killing Your Love For WritingMy Profile

Reply

Craig McBreen October 16, 2012 at 2:49 am

Hey Josh,

I think about it all the time, and will be paying a lot more attention to detail on my site … and writing about it.

Isn’t Arabic read from right to left? What I really find interesting is something like Japanese Kanji … Top to bottom or left to right. And used to be right to left, me thinks at least ;)

One of my goals from here on out is to make the site as clear and easy to navigate as possible. A redesign is in the works, but a slight update will come first ;)

Looks like you are always tweaking over at your place.

Thanks!

Reply

Jeevan Jacob John October 15, 2012 at 8:50 pm

Now, I have learned about this in a few of my classes – especially my art class that I took last semester (but, never took it seriously – I guess I can blame me for one and blame the education system itself for being so “dry” and focusing just on the definition of the terms).

Do you buy your photos, Craig?

Your photos do give me an idea – to take my own photos (poses of myself and my surroundings for my posts – hmm, that isn’t a bad idea, is it? Plus I don’t have to spend any money).

Do appreciate the tip, Craig ;) I never actually thought about the practical application. How about discontinuation? (you know, put a gap in that red/grey pattern you have right there – does that help to get more attention?)

Reply

Craig McBreen October 16, 2012 at 2:57 am

Hi Jeevan,

Well, Sir, you won’t get any argument from me when you call the educational system dry. Did you ever see my schools killing creativity post? ;)

Most of my photos come from iStock. I have an account with them and yes, I do pay for the shots.

I know there are many free options, but taking your own shots is a great idea. I’ve always loved photography and hopefully will be doing the same :)

I think it depends how you apply it. For this site, I’m actually going to be changing things around quite a bit over the next few months. I’ll be writing about it to, if you want to check in.

Thanks!

Reply

Ryan Hanley October 16, 2012 at 11:14 am

Craig,

Design is a failing of mine… Simple put powerful tip here dude. I’m looking forward to what’s to come. I definitely am going to start implementing this directional Marketing 101.

Thanks buddy,

Hanley
Ryan Hanley recently posted..Why Great Ideas Do Not Create Success OnlineMy Profile

Reply

Kaarina Dillabough October 16, 2012 at 3:47 pm

Great post here Craig: love the way you provide power-packed information with an elegance and simplicity that makes it understandable and actionable. Cheers! Kaarina
Kaarina Dillabough recently posted..Effective Telephone Techniques – Do you give good voice?My Profile

Reply

Craig McBreen October 16, 2012 at 11:39 pm

Hi Kaarina,

Thanks! You’re way too nice, but I appreciate that. I do want to pump out more posts like this. Things people can actually apply. We’ll see how it all works.

Thanks for stopping by!

Reply

Adrienne October 16, 2012 at 6:29 pm

What a cool idea with the photos Craig. Maybe I should have a lot of photos taken of me looking up. Think people will get sick and tired of that? Just kidding of course but I went back through your photos and you’re right. But then of course, I’m going to read your content anyway so there.

Thanks for these tips though, that was really cool and I’m in the process of redoing my opt-in box. You know, testing things….

Thanks Craig!

~Adrienne
Adrienne recently posted..Taking Responsibility For Your Lack Of Success And Where You Need To StartMy Profile

Reply

Craig McBreen October 17, 2012 at 3:37 am

Hi Adrienne,

Thanks and glad you liked it! I honestly don’t think you’re community would get sick of anything you do. I do go a little crazy with the photos, but it’s all with purpose ;)

You’re most welcome. Looking forward to seeing the new opt-in. I made some subtle tweaks to the design today … sneaking those in.

Thanks so much for stopping in. Great to see you.

Reply

Sue Neal October 16, 2012 at 9:03 pm

This is really helpful stuff, Craig – I do use images and pay a fair bit of attention to how my posts look, but it hadn’t occurred to me to use images in the way you suggest, to draw the reader’s eye to particular bits of text. The way you’ve placed the image with the flame is fantastic.

BTW, I’m interested to hear you say you use images purchased from istockphoto. I used to use paid images from that site and also bigstockphoto, but I was told I couldn’t necessarily share them on Pinterest, even though I’d purchased them, so I’ve started using creative commons images that I know are safe to ‘pin’.

I do so envy people who can create their own images – I’m terrified of inadvertently breaching someone’s copyright.

Many thanks for this fascinating post – really enjoyed it.

Sue
Sue Neal recently posted..Do Your Blog Posts Have Too Much Bounce?My Profile

Reply

Craig McBreen October 17, 2012 at 3:43 am

Hi Sue,

Glad it was helpful. Yes, I tend to be a little obsessive, not only with image placement, but with finding the perfect image ;)

Thanks for the tip on royalty free images. I still haven’t dabbled in Pinterest, but this is certainly something I’ll take note of. I haven’t really taken the time to look into creative commons images, but that might be something I consider in the future.

I would love to shoot my own images and my do that one day soon. Not so sure about illustration though ;)

I’m glad you enjoyed and come back anytime. So glad you stopped in to comment!

Reply

Tim Bonner October 18, 2012 at 3:10 pm

Hey Craig

I never spotted the photos before although I’m sure I did sub-consciously.

Thanks for the tip, that’s a brilliant idea!
Tim Bonner recently posted..I Love Italian Ice CreamMy Profile

Reply

Craig McBreen October 18, 2012 at 8:27 pm

Hi Tim,

They are littered throughout my site ;) You’re most welcome and thank you for stopping in!

Reply

Jayme Soulati October 19, 2012 at 3:02 am

And, I always wonder whether my blog needs to have all those lovely badges going down the sidebar that I’ve never bothered to add. That makes for a killer blog, right? All those little bragger badges; I could add a few so I have 1 or 2 and be like Mikey?

Yep, the imagery is critical; it’s one of the first things people look at…thanks for this great provoking post.
Jayme Soulati recently posted..Discern If SEO Marketing Pitch Is SpamMy Profile

Reply

Craig McBreen October 21, 2012 at 7:08 pm

Hi Jayme,

I even wonder if I need those very small social media icons in the upper right. I’ll leave them up for now, but really think the sharing buttons (within each post) is enough. “Bragger badges” … ;) I like that.

Reply

Sheila Bergquist December 23, 2012 at 8:50 am

This is something I never thought about! I love your examples and will definitely be thinking of this in the future…thanks for such a fascinating and useful article. There are so many subtle things to think about, aren’t there?
Sheila Bergquist recently posted..HAPPY HOLIDAYS TO ALL OF YOU!My Profile

Reply

Craig McBreen December 23, 2012 at 8:29 pm

Hi Sheila,

I’m glad you like the post! Yes! this is fairly basic stuff of course, but subtle things do indeed add up. I’ll be writing another post in the series in January.

Reply

Kevin Davis @ Alphagraphics August 20, 2014 at 9:52 am

This is a great article. I’m glad you covered this topic, it can be applied to so many things from print media to online. A lot of designs fail to draw the eye in the direction they intended. Often times a reader will skim the content and you’d be surprised at how many don’t even notice your logo when they do that. Make sure you know what you want your readers to see and draw their attention to it.

Reply

Leave a Comment

CommentLuv badge

{ 3 trackbacks }

Previous post:

Next post: