Close
Close

The 5 Keys to Blog Usability

This guest post is by Neil Patel of Quick Sprout.

The user is king. That’s what a lot of pundits are saying these days, from usability experts to SEO gurus and content marketing pros.

Actually, it’s always been true, and it’s why the mantra “content is king” has always been so important. Content is exactly what users wanted. Naturally, you should give them what they want.

But content isn’t enough today. Total user experience must be baked into blog content if you want to make it bigger and better so that you stand out and dominate in your space. These five elements of user experience are essential to doing just that.

1. Navigation

When it comes to a site heavy with content like a blog, navigation is essential. The primary job of navigation is to lead the user around the site. When it comes to a blog, this is especially important. The goals are as follows:

  • New content should be available and obvious to users. They shouldn’t miss out on anything.
  • New users should be able to understand in a short period of time what content is exactly available.
  • Users should know how to find the content they want. They are looking for answers, and it’s your job to get them to the relevant content.
  • Older content should be available to users who liked newer, related content.

In the end, it comes down to putting the content where your users can find it. And the number one navigation strategy rule is this: the navigation should never change even though new content is being added.

Let’s deal with a couple of typical navigation problems: finding old content and keeping users reading.

A blog that is just a few months old will not run into navigation problems. There just simply isn’t enough content. As that blog grows, however, and new content is added, you will begin to run into navigation problems, namely older posts are getting lost and forgotten.

That’s not good.

The common way to handle this is by adding a Monthly Archives widget to the blog. That is probably the worst possible way you can handle this problem.

 

Instead, put your content in proper categories and use a workable search system.

The Popular Posts sidebar widget is a great place to start. And instead of allowing the plugin algorithm to decide which content should go there, you make the choice. It’s better to choose based upon your experience and what your analytics are telling you, than to let the machine guess.

The same is true for adding older posts as related material at the end of posts. This is how Smashing Magazine does it:

Internal links are also another great way to improve the navigation of older posts. This way you can give them related material that’s immediately relevant to what you are writing about … and may even expand on a point.

There are two ways of doing this correctly. One is to make the links organic to context, so that they flow, like I did in my 8 Things Blog Readers Want More Than Just Content:

Or you can highlight the post by suggestion it as additional reading, like James Aultucher does in his 10 Things to Do When They Don’t Call post:

 

One way you don’t want to link to older posts is like they sometimes do at Freakonomics:

 

That is neither helpful for SEO purposes, or to users. It’s bad user experience. You are not giving users any indication of what is behind the link, and that slows users progress.

The goal is to keep them reading. Once someone lands on your site, you want them to stay. Otherwise you have high bounce rates. That’s why a Popular Posts or Recommended Reading plugins are essential.

Categories are useful for navigation when done right, but I don’t use categories because my tests have proven they aren’t useful. But perhaps they make more sense for your blog. If that is the case, you always need to keep three rules of thumb in mind when creating them:

  • Keep the number of categories to a bare minimum: Remove categories that have fewer than five posts until you can fulfill your category authority plan and create more content in those silos.
  • Use keywords that explain what the site/blog is about: A user should be able to look at your list of categories and understand immediately what the site is all about. Here are some categories I would use: Advanced SEO Techniques, Web Analytics, Digital Marketing, and Entrepreneurs. In fact, your category labels should come from your SEO keyword research.
  • Use categories only when you can justify them as being useful to help users find content: They should be intuitive and easy to understand. A confusing category list can sow distrust in your user.

Here’s a poor example of category use by Dumb Little Man:

Copyblogger demonstrates a clean, unique, and simple way of using categories:

While categories can prove useful, you should always test to see if they are helping or hurting you.

2. Speed

In a 2009 Google study, it was reported that a 0.5 second delay in page-load time caused a 20% drop in traffic. Amazon experienced a similar drop in traffic and revenue due to a fraction-of-a-second load delay.

More recently, Google has reported that slowing down search results by as little as 400 milliseconds will actually increase dropped searches from 0.2% to 0.6%.

That’s a huge drop in traffic for 400 milliseconds, so it pays to minimize the page speed. This is usability 101. It forces you to always ask if that new feature you want to embed on your page is worth the drop in load times and traffic.

You might like the flashy features, but they can dramatically slow down site performance. And don’t get fooled by the fact that internet connection is speeding the web up. How much site load speeds impact user experience will always be important. Just look at how it impacted Google.

I’ve covered the topic of speed extensively in How Design Your Blog for Awesome SEO, as have authors here at ProBlogger.

3. Focus

When it comes to creating a user experience that will make your blog better, the focus of your blog is equally as important as any of the onscreen, tangible things we have been talking about.

For example, page load speed and conversion are both actions that can be measured. Focus is less tangible, but highly important.

Let me share some common mistakes people make to show you what I mean:

  • Trying to please everyone: A blog that thinks everyone is its target user is going to be a miserable failure.  But you can’t simply pick an industry and then think you are narrow enough in your focus. For example, saying that your target audience is people who love food is still too broad, especially if you want to dominate that space. You have to pick a unique, narrow segment of that broad space. People who love hospital food may be a little too narrow, but you understand what I’m saying.
  • Confusing your content with your context: Sometimes you can attract the wrong audience by giving them the wrong content. If you run a social media blog, for example, but write content about postcards, or something totally from left-field, like home-made beer, you might get your user to come to your site, but he or she won’t stay.
  • Hiding behind everyone else: Another focus mistake occurs when you copy someone else’s success and provide nothing new or unique to the conversation. Say you love what Seth Godin is doing, and think you have some worthy things to share. Your blog will flounder if you don’t define some way to make you different than Godin. You just simply can’t compete.

A good, focussed blog strategy has the following elements:

  • Narrow definition of what you are trying to accomplish: As I mentioned above, your blog should be focused on delivering content that fits into your definition of cornerstone content.
  • Narrow definition of your target user: Your defined cornerstone content should fit perfectly with your defined target user. These should really mirror each other.
  • Unique selling proposition: Next, your focus should be on something that your competitors don’t provide. And this should be a focus that you regularly highlight. The harder you can make the focus uncopiable by your competitors, the longer you will be able to dominate the space.
  • Cornerstone content creep: A narrow focus will also help keep you from straying too far off topic when it comes to creating content. A warning sign that you may be experiencing cornerstone content creep is that your category list keeps growing.

Creating a focused strategy begins with user research and analysis of your competitors. And as you do your research, you’ll come up with a lot of ideas. It’s key that you rank these ideas in order of importance. Keeping just the top two will help you keep your focus narrow.

4. Display

You may not think about display too much, but whatever stage you are going through in your design process, you will need to think about how most visitors will see your layout depending on what screen resolution they use. Remember that you want to give users what they want.

This means that you have to take into consideration height and width and line length. But that’s not so easy. High-resolution monitors have a high screen resolution, which means users get in a habit of browsing in small windows in which the browser window resolution is much smaller.

In other words, we want to know the size of people’s browsers’ content windows.

So your first step is to figure out who your average user is.

Look at your Google Analytics and see the average screen resolution of your visitors. This data will also tell you about their preferences and behaviors. Then see which user is staying on your site longer, and start to design user display size toward that average profile.

In an older study in which over 18 million screenshots above the fold on browsers, most users will be able to see content that is located within a 500px by 800px space. Over 80% will see the content in a display that is 1000px wide, while the remained browse in a display that is 1250px wide.

The moral of the story is that you need to design displays for your average user. For most, that means the layout will be less than 1000px wide. To give you an idea of what you can do with that, check out The Big Picture Blog by the Boston Globe.

5. Readability

Readability is all about what your user reads on the screen. And the golden rule to good readability is this: the easier your content is to read, the better.

If you want to see how your blog ranks when it comes to readability, run it through the readability test. In the meantime, here are the basics behind good readability:

  • Contrast font color with background color: This is critical, because it’s easier to read font text when its color contrasts with the background on which it appears. Black text on white background is the most basic and easiest to read:

     

    Just so you can see how awful a bad contrast can be, check out this pink on blue page:

     

    Also, check your site with Vischeck to see what colorblind people see when they visit.

  • Break your copy into chunks. Large blocks of text will discourage people from reading.
  • Use bullets. 
  • Keep your paragraphs short. 
  • Keep your columns narrow so the eye doesn’t have to travel across the page too far: The best line length is between 60-80 characters. This metric should remain constant across different browsers and screen resolutions.
  • Avoid backgrounds that are busy: Think of MySpace and how awful those pages were to read. Talk about distracting!

     

  •  

  • Keep it simple: From your home page to an article page to your contact page, a user should know quickly what the site is about and what the main goal is of that page, wherever they are.

  • Keep the font style clean: A sans-serif font is the easiest to read on the web. Serifs are the little hooks at the end of letters in fonts like Times New Roman and Courier New. Helvetica and Calibri are good sans-serif fonts.
  • Avoid tiny fonts: That will certainly cause eye strain and frustrate your user. Font size 12 or larger is optimal.

Blog usability means content usability

It used to be that content was king. It still is from the perspective of the user. You need to deliver that. But it’s not enough these days. Your readers want a good experience, too.

In 2012 and beyond the user is king, and so you need to design your blog with these usability elements in mind: navigation, speed, focus, display, and readability. It’s essential to get these right if you want to attract and keep more visitors and create a link-worthy blog.

So, what other elements of usability do you feel are important for creating a killer blog? Share your perspective in the comments.

Neil Patel is an online marketing consultant and the co-founder of KISSmetrics. He also blogs at Quick Sprout.

Looking Good: Simple Ways to Create Sensational Blog Images

This guest post is by Jo Gifford of Cherry Sorbet Creative.

Blogs that look great attract the attention of the reader, it’s as easy as that. Your content might be amazing but if your blog has a terrible aesthetic you are missing out on a slice of magic to make people enjoy their stay.

In 2011 visual social media platforms like Pinterest and insta.gram exploded in use, signalling a trend towards lifecasting in a more visual way, which applies to the blogosphere too; readers want your pages to look interesting. The more they stay on your site and engage, the prettier those stats look too.

This post gives some simple and easy ways to create and generate original and eyecatching imagery for blogs, without needing to be a designer. So, let’s get looking good:

1. instagr.am

Love it or hate it, instagr.am is a fantastic way to create eyecatching imagery for use on a blog, all from your mobile. I use inkstagram, which uses my instagram sign in to produce an easily scrollable stream (instagram itself is a little limited in image access). From there, I click on an image and copy the URL to add into the blog post. At this stage, the SEO savvy among you will want to make sure your image title and alternative text is changed to something relevant.

2. Screen grabs

Screen grabs of images or text can make an easy collage tool. If your screen is full of images, text, maybe a mindmap of work in progress, consider capturing the screen and taking it into an image editor for a vibrant and personal illustration for your blog.

3. Picnik

I love to use Picnik, an online image editor which is currently free in premium form until April when it is fully taken over by Google Creative kit. Both Picnik and the new Creative Kit in Google + allow images to be re-sized, effects added (including saturated and lomo effects), the inclusion of frames such as polaroids, and the addition of text too. This makes them great alternatives to Photoshop and are free resources online, so are easily accessible.

By editing and creating your own images you can have a fabulous looking blog post without worrying about Creative Commons licences or the dreaded copyright, and you needn’t be a designer!

4. Polyvore

Polyvore is a website used mainly by the fashion blogging world, but has useful features for all bloggers. Simply create an account, and go to “create a set”. You can then literally drag and drop a multitude of images including useful things like notebooks, post it notes, coffee stain and paint splash effects, alongside all sorts of images. Add text in some great fonts too by dragging and dropping text.

Once the set is finished you can click the “publish to WordPress” section; before you go ahead with it, simply copy and paste the code and add to your html section in your post.  Polyvore automatically includes links to the products in the set, but you can deselect the check boxes to have code without the links. Voilà, original, fabulous imagery with a footprint on another site to boot!

5. Collages

There are some great apps available to help you make collages for post inclusion. I currently use Picframe for iPhone and iPad which allows photos from your library to be added into collages. You can drag and drop, re-size and alter frame edges and effects, and also export to instagr.am to add a filter and share in your stream or on Flikr.

I also use a desktop application collage maker for larger and more complex collages—there are myriad options available and a quick google search will provide some free collage resources for you. I happen to use an Apple App store called Collage Maker, and I find it to be really handy and effective.

6. Camera

It’s great to take a camera put and about with you if you have one. I use a Nikon D40 to snap away at places, signs, buildings and all sorts of interest. You never know what might appear that has relevance to a blog post you are writing, and you can always crop in, edit the images and form as part of a collage. Using a digital SLR allows a igher resolution to zoom in and crops parts of images not so easily done with iPhonography.

7. Creative Commons search

Creative commons images are images licensed by the creators to be used with a attribution link. You can search for images using the Creative Commons search tool, which may produce some exciting work you have permission to include on your site. Remember to attribute where necessary though.

8. iStock

iStock is a fantastic and inexpensive library of images that are perfect for bloggers. Images and illustrations are purchased in block of credits, and web friendly images can be very cost effective indeed for the odd post here and there.

So, go forth and get creative! Your readers will love you, I promise.

Jo Gifford is a designer, writer, blogger and founder of Cherry Sorbet Creative. Working primarily in the beauty, fashion and lifestyle industries her work spans graphic design for print and web, social media management and training, copywriting and editorial for on and offline publications. You will find her blogging as Dexterous Diva, on Twitter both as Dexterous Diva and Cherry Sorbet, and on Linked In.

Make Your Blog Load Faster than ProBlogger: Part 2

This guest post is by Devesh of WP Kube.

A few months ago, I wrote a guest post here called How to Make Your Blog Load Faster than ProBlogger. Today, I’ll go into some more detailed advice to help you speed up your site even more.

If you’re a blogger, you already know about the importance of blog loading speed, and the role it plays in search engine rank and marketing your blog. But if this is new territory for you, here are three quick reasons why you need to speed up your blog:

  1. Google includes website loading speed as an important metric in their ranking algorithm. If you want your blog to rank high in the search results, you need to make sure your blog loads faster than others.
  2. It can increase the quality of your blog’s user experience and engagement. Having a good-looking blog won’t make your readers’ experience better if it takes ages to load. You need a theme that loads fast and is well coded.
  3. It can help you decrease your bounce rate, and we all know that the lower your bounce rate, the better your chance of driving engagement and generating leads.

Before we get started, check out these five tools you can use to measure your WordPress blog’s loading speed.

1. Optimize your database

One of the very first things that a blogger needs to do is optimize your blog database and delete the post revisions. You can use phpmyadmin to clean up the database, but if you don’t want to play with phpmyadmin, you can set up WP-Optimize instead.

Make sure to remove all the unnecessary tables, old post revisions, and spam comments from your blog’s database. You can use the Better Delete Revision plugin to remove those post revisions, too.

2. Use CloudFare

CloudFlare is a (free) service that makes your blog faster, safer, and smarter. In other words, CloudFlare supercharges websites. It is a CDN service that will protect and accelerate your website, and doesn’t interfere with the WordPress Caching system (W3 Total Cache).

This plugin keeps your blog safe from the Hacking attacks, spammers, and bots by challenging them with a CAPTCHA system whenever it doubts a user’s authenticity. With this tool, you’re easily able to block the spammers’ IPs and websites with just few clicks.

3. Use the P3 plugin

P3 (Plugin Performance Profiler) is one of the best plugins for those wanting to see a performance report of their blog. It comes with a lot of great features, but primarily, it can show you what plugins are slowing down your blog.

It creates a profile of your WordPress site’s plugins’ performance by measuring their impact on your site’s load time. Often, WordPress sites load slowly because your plugins are pooly configured, or because you’re using so many of them. By using the P3 plugin, you can home in on anything that’s causing your site’s load time to slow.

Note that this plugin uses the canvas element for drawing charts and requires Firefox, Chrome, Opera, Safari, or IE9 or later. This plugin will not work in IE8 or lower.

4. Disable hotlinking

Hotlinking is when other sites link directly to the images hosted on your blog from their blog posts or pages. This makes your server load high and decreases the loading speed of your blog.

It is very important to disable hotlinking. To do so, add the following code to your blog’s .htaccess file. Make sure to back up your .htaccess file before you begin to make any changes.

#disable hotlinking of images with forbidden or custom image option
RewriteEngine on
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{HTTP_REFERER} !^http://(www\.)?yourdomain.com/.*$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?feeds2.feedburner.com/yourdomain [NC]
#RewriteRule \.(gif|jpg)$ ñ [F]
#RewriteRule \.(gif|jpg)$ http://www.yourdomain.com/stealing.gif [R,L]

Make sure to allow your feeds to display the images, however.

5. Limit front page posts

Limit the posts that are shown on your home page. Never show the full posts on the home page, because this will make your site very slow to load. Imagine you have more than eight posts on your home page, and all of them are of 600 words or more—it will likely take a significant amount of time to load the home page.

You should use the excerpts on the homepage and most other pages, instead of showing full posts. To use the excerpts, find the below code in your index.php and other pages that list posts, like archives.php, category.php, and so on.

<?php the_content();?>

Replace that code with this:

<?php the_excerpt();?>

More resources

For more ideas on speeding up your blog, see:

These are simple tips that can help you to make your blog load faster than ProBlogger. What others can you share to increase blog speed?

Dev is a part time blogger and blogs about WordPress Marketing at WPKube. Hit him up on Twitter if you need anything, Dev will be quick in responding and helping you out.

Six Steps to Make Sure Your Site Is Ready to Go Viral

This guest post is by Nancy Sathre-Vogel of Family on Bikes.

I couldn’t believe what I was seeing. Surely Google Analytics was confusing my site with another, way more popular site. There was no way my visitor numbers could be so high!

And yet they were. One of my posts had taken off and was spreading like wildfire. Those viral post phenomena that happen to others were now happening to me.

The first day, 17,000 visitors came to my website. The next day we topped out at 56,000. Readers were coming in droves.

It was exciting. It was exhilarating. My site, viral! Wow!

And then I took a moment to see what they were seeing. Oh my.

I, like so many other bloggers, had figured people would come to my site in the way I had designed it. They would enter via my homepage, then click on to individual posts. Everything was ready for that kind of traffic.

But the viral post, 50 Lessons I wish I had learned earlier, wasn’t following that pattern. Hundreds of thousands of visitors were pouring into my site directly to an individual post. When I took time to evaluate that post, I realized just how unprepared I was.

For the next few days, my husband and I scrambled to get our site up to snuff. We evaluated and planned and created images and installed widgets. Had we done all that before the spike hit, we could have captured more of that traffic.

Maybe it’s not too late for you. Here are six steps you can take to make sure your site is ready to capture new readers when one of your posts starts spreading like wildfire.

1. Create a new page with no text at all

You don’t want to be distracted by a post; you want to look at everything else on the page. Study your title, your sidebars, your footer. Look at the layout with no post there at all and see what kind of message it sends. Is it consistent with your goals?

2. What do you want your readers to know about you and/or about your site?

That one viral post may or may not be typical of your other posts, so make sure you’re crystal clear in terms of communicating what you’re about on every page.

Our site is about the lessons we learned as we bicycled from Alaska to Argentina, but nowhere on the viral post was that information to be found. Had the new readers entered through the home page, they would have read all about it, but they didn’t. So they didn’t! They had no idea what we’d done or what we were about. We quickly put together a brief bio to add to our sidebar.

3. What do you want your readers to do?

Do you want them to be inspired to take further action? Buy your book? Sign up for your newsletter? Make sure that action is spelled out on every page. Maybe you’ll take care of it with a widget on your sidebar, or maybe a popup. However you want to get the message to them, make sure readers know what you want them to do when they enter your site.

We had written some books, and wanted to direct attention to them. But that information was on the home page, not on individual posts. We scrambled to get that up on the sidebar too.

4. Can they easily share your post?

If your Twitter and Facebook share buttons are hidden away down in the gobbledygook at the bottom of the post, how likely is it that your readers will find them? Likewise, if the buttons appear only at the top of the post, what’s the likelihood that they’ll scroll back up after reading?

Don’t clutter your site with share buttons everywhere, but make it easy for readers to find and access them.

5. Are your RSS feed, signup, Twitter, and Facebook buttons easy to find?

If your reader likes what he sees, you want to make it easy for him to follow you.

6. Are your categories self-explanatory and detailed enough?

Put yourself in the shoes of someone coming to your blog for the very first time. Will they be able to find the info you’ve just encouraged them to look for?

Remember that you’ve got only a few seconds to capture a new reader. Whichever page they use to enter your site, that’s the page that needs to be prepared. Which means, of course, that every page needs to be prepared. If you’ve done everything you can to get key information in your sidebar, header, and footer, then you’re ready to go. Let it fly!

Nancy Sathre-Vogel is chief blogger at Family on Bikes. Together with her family, she spent three years cycling from Alaska to Argentina. Now, she back at home writing books and blog posts about their adventures.

Why You Should Create Your Own Graphics for Your Blog

This guest post is by Naveen Jayawardena of sleepWRITER.

When I decided to start a blog on sleep habits, I wanted to try something different. As any aspiring blogger, I was trying to stand out from the crowd. And I did it by creating my own graphics.

Now I run my blog exclusively with “home-made” graphics. My readers love it and I enjoy making graphics as much as writing posts.

The alam bully, who features on Naveen's SleepWriter.com website

I am not a professional graphic designer. So I can assure you that most people can learn how to make graphics with a little practise.

I am a self-taught amateur graphic artist. And I started out from scratch. And I will tell you how to do it yourself.

I use “home-made” graphics for each and every one of my blog posts. If you are wondering whether this is worth all the trouble, then consider these benefits you can get from using graphics:

  1. Graphics blend in with the blog design more easily than photos. I have limited my blog design to few colors and could not have achieved this without the use of graphics.
  2. It’s much cheaper than buying photos or graphics.
  3. It introduces your own, unique voice to the your posts via graphics.
  4. You can come up with the right picture for the posts every time.
  5. You can explain difficult concepts with infographics.
  6. Making graphics is fun. Drawing a few sketches after writing a post can help you relax and think creatively.

How do you start?

If you’re an absolute beginner, I suggest you start simply. Don’t worry about your graphics not being lifelike. The idea is to create your own style, with which others can identify your graphics.

You can draw something on paper and scan it, or take a picture of it from a digital camera. This is a very basic method of using graphics. You can draw cartoons and add lists in your own handwriting.

At some point you need to learn to use graphics software. I use Adobe Illustrator, but there are plenty of other software packages that can do a good job. I suggest you stick to one and learn it well.

You can learn from books, web tutorials, video tutorials and by attending classes. There is a range of brands under each category, and most of them cover the basics. I used video tutorials but I feel that having someone to show you the ropes can help you learn faster. Take time to learn the basic functions, and remember that learning keyboard short-cuts can save you a lot of time in future.

Once you have the basic skills in place, you can explore on your own. But if you are serious about graphics, then there are plenty of online tutorials that teach you, step-by-step, how to create advanced graphics. I use online tutorials to sharpen my skills and also to learn new “tricks.”

To create good graphics, you need to be a good observer. Look at the graphics on stock graphic collections and libraries. What techniques are they using? Can you replicate them? Look at the graphics and cartoons that appear on newspapers and websites and learn.

Once you are confident in making graphics, then you can adopt your own style and technique. When I write a post, I also think of the graphics which can go with it. If I don’t get a good idea for a graphic, I finish my writing and visit again with a fresh perspective for a graphic idea.

What are the drawbacks?

It would be unfair if I told you only the good side of creating your own graphics. I have encountered few disadvantages of using graphics for my blog:

  1. Detailed graphics take time. This can affect your posting routine. But with practice, you can create them faster. You can recycle old graphics to save time.
  2. It takes time to learn to make graphics. It took me few years to master the art of graphics and I still learn. It is not a quick fix.
  3. It may not suit all types of blogs. But it is worth a try.

Graphics can be a nice addition to your blog. I hope I inspired at least a few of you to bring your inner artist to your blogs! Please do share your own experiences using graphics on your blogs.

Naveen Jayawardena is a doctor by profession and blogs during his free time. You can find plenty of graphics and sleep tips at sleepWRITER.

How to Use Images in Your Blog Posts

This guest post is by Karol K of ThemeFuse.

“A picture is worth a thousand words.”

I’ve always liked this adage even though it’s one of the biggest cliches ever. Pictures, photos, image—they are all great for visualizing your posts and making them more memorable.

I know that it’s the content of the book that’s important, but what would be a book without a nice cover? Okay, let me stop being poetic and get straight down to business.

Why you should use images in your blog posts

1. They help your written content to deliver the intended message with a bigger impact

There’s really no better way of doing this. If you want to really emphasize a strong point, you can do it by writing it in bold as a separate paragraph and then placing an image next to it. Of course, the image has to be of some relevance to the text, or it won’t work.

2. They make your post more memorable

We humans need an anchor of some kind to memorize things. Most of us tend to remember things in snapshots—by visualizing them. It’s not natural for us to remember something as text—a set of words and sentences. It’s difficult to make a snapshot of a piece of text. Images do this job a lot better.

(Quick note. Sorry, but a headline is still the most important factor for every blog post. Just wanted to make this clear.)

3. They break the text visually

In most cases, reading from a computer screen is not comfortable. Eyes get easily tired, you can’t be staring at a computer screen for more than an hour at a time, and let’s face it, sitting at your desk is not the most comfortable position either.

Images are not the magic-bullet solution to make all of these go away, but they do make it easier for the reader. If the text is long you—the author—absolutely must break it down into smaller chunks.

The first rule of breaking it down is to use short paragraphs, no longer than four to six lines. However, even if you’re doing this, you will still end up with a number of paragraphs, and they need to be broken down too. The solution: images.

When you place an image every six to ten paragraphs, the text gets really reader-friendly. Everyone can easily follow your way of thinking and do a little five-second break to look at an image. And then they can easily return to the place where they’ve left off.

I’m sure that there are many more reasons for using images, but I’m confident that the above prove my point well. And, of course, I’m not even going to discuss the situations in which a blog is totally image-driven, like all kinds of photo blogs, for example.

What’s the best place for an image?

I’m no guru here, but I think that the best place is the beginning of a post (somewhere near the headline). It’s where the reader looks first, so if we want to help them to memorize anything, this is the placement to use.

Of course, you can use more than one image in a blog post. So my recommendation is to use the first image at the beginning, and then spread other images evenly throughout the post so they do their job of breaking the post down visually. Which brings me to the next point…

Don’t use too many images in short posts.

Images should make reading easier not harder. If you break the text too much, the whole purpose loses its sense and turns into an obstacle.

The perfect number of images per post for your blog is for you to decide. It depends on the blog’s design, the average post length, and the content of the post as well. You can find your number by testing a couple of possible setups and deciding which one works best.

The size of images

The maximum size you can use is the width of the content block on your blog. So again, it’s design-dependent.

That being said, the most common approach is to use images that are smaller (except for photography blogs) rather than bigger. That’s because the image is just there to aid you in conveying the message; it’s not to be the message itself.

An image is an extra element. If it’s too big it becomes the main element. I’d advise you to use images that are either not wider than one-third of your content block width, or even up to the whole width but really small in height.

Now, there’s an exception to this rule—screenshots.

Screenshots usually work as main elements of a post, so they need to be bigger. Also, they need to be bigger for readers to be able to see clearly what’s on them. Another approach is to present a screenshot as a thumbnail along with a lightbox gallery link.

How to embed pictures on your blog

Before you stop reading, bear with me! I know that this is basic and everybody knows this, so there are only two things I want to tell you here.

  1. Upload images in the exact dimensions you intend to use: always resize your image to the exact size you’ll use in a blog post. Bigger pictures consume more space than smaller pictures, so there’s no point in uploading a large picture and then scaling it down inside of WordPress.
  2. Use an image optimizer plugin: something like WP Smush.it. I’m not going to go into technical details because, to be frank, I have no idea how it works, but what I do know is that it optimizes the size (the disk size, not the dimensions) of images with no loss of quality. And it’s free.

Remember attribution

There are basically three types of images you can use:

  1. your own images
  2. free images
  3. paid images (usually referred to as royalty-free images).

Attribution is a thing you need to have in mind when using free images. It depends on the license a given image is shared with, but what you usually have to do is to somehow attribute the image to its author or creator.

The most popular way of doing this is by placing a link to the original image in your post. Some image directories require you to do this, and some don’t.

Treat attribution as a payment for the image—which essentially is exactly the case.

Do you have any strategies for using images on your blog you’d like to share? Feel free to share your opinion and advice in the comments.

Karol K. is a 20-something year old web 2.0 entrepreneur from Poland and a writer at ThemeFuse.com, where he shares various WordPress advice. Don’t forget to visit ThemeFuse to get your hands on some original WordPress themes (warning: no boring stuff like everyone else offers).

10 Of The Web’s Best Sidebars

This guest post is by the Blog Tyrant.

The sidebar is the second most important place on your site. It is where, after engaging with your content, people head over to subscribe to your list, follow you on Twitter, or buy your product.

It is vital that you get it right.

In this post I am going to show you some of the web’s best sidebars, and then talk about how you can improve yours with a goal to get more subscribers and conversions, and make more money.

NOTE: You might also like the best About Us pages and the best Contact Us pages.

Criteria for a great sidebar

So what makes a sidebar great? Well, I have come up with a few criteria over the years but, of course, I would love to hear if you can think of any others.

  • Above the fold: Do you know what I mean by above the fold? It’s everything you see before you scroll. Good sidebars have good stuff above the fold.
  • Eye-catching, but not distracting: The sidebar needs to be eye-catching in that it gets people to interact, but not so much that people forget about your content.
  • Takes readers deeper: The sidebar should take people deeper into your blog or site. It should get them to subscribe or convert them in some other way. That is the purpose of true navigation.

Of course there are more but these are the ones that really do it for me. After all, the whole purpose of the blog’s sidebar is to increase conversions.

The 10 best sidebars on the Web

Okay so let’s get into those sidebars. Here are the ones that I thought ticked the most boxes and really helped their users navigate their way towards a sale or a conversion, while still providing a fantastic user experience.

1. Tumblr Staff Blog

The Tumblr Staff blog is really cool because they show you the faces and personalities of everyone who works there.

Tumblr staff sidebar

Tumblr staff sidebar

Their sidebar is particularly useful because it advertises their product: Tumblr Blogs themselves. They give you a little form to start your own blog right there in the sidebar and then underneath have a very eye catching graphic on 30 reasons you will love their site.

This is a great combination—a sign up form and a list of reasons for why you should act. Might be a good idea for all blogs to explain to readers what they will get from signing up.

2. Copyblogger

Brian Clark of Copyblogger has totally redesigned his blog to appear more like a landing page that sends you off to his other products. The result? No sidebar. And that is something really brave and something that I had to include in this list

Copyblogger sidebar

Copyblogger sidebar

Sometimes the best thing you can do with a sidebar is get rid of it. If you are building a landing page that serves to get people to a sign up or purchase area, then a sidebar might just be distracting. Have a look at the way Copyblogger does things. It’s making money.

3. ViperChill

Pretty much everything that Glen does is amazing. He is a very talented guy. And his sidebars are simple but extremely effective.

Viperchill sidebar

Viperchill sidebar

The thing he does that I haven’t seen anyone else do is add testimonials from big players like newspapers and Fortune 500 companies talking about how good he is at what he does. This type of social proof really serves to solidify his brand and make him appear more authoritative.

4. Huffington Post

Huffington Post is the world’s most successful blog—it’s even listed on the Stock Exchange now. So following their lead is a very good idea.

HuffPo sidebar

Huffington Post sidebar

In my previous post on the best comment areas we saw that they used badges and rewards to “level up” their readers and make them feel invested in the site.

The sidebar takes that idea further by showing readers what’s hot on Twitter, Facebook, and in other sections of the site itself. The net result would be that they get more social shares and a lot deeper user interaction with their content.

5. Mashable

Mashable is the biggest social media news site online. And they get that part of it really right.

Mashable sidebar

Mashable sidebar

One of the best things you can do with your sidebar is get your readers to engage with your Facebook and Twitter accounts, and Mashable does this by getting people to log in with their accounts. Then, they show those users which topics are trending. It is a very clever way to mix both the social outlets as well as the site’s content. The result? They get a lot of viral content.

6. Smart Passive Income

Pat is a super-nice guy, and his sidebar lets you know right away. The first thing you see is a picture of him with his young son.

Smart Passive Income sidebar

Smart Passive Income sidebar

This instantly builds trust with the new readers and, aside from building his personal brand equity, it makes you feel at home and in a very personal space. Pat then follows up by offering his free ebook below, as a natural progression from his little introduction.

7. Digital Photography School

Digital Photography School, Darren Rowse’s other blog, is a gold mine of “how to do it right” information. It is one of the best blogs for user engagement and has a wonderfully successful and active community.

dPS sidebar

dPS sidebar

The sidebar is perfectly done for encouraging users to get involved—how to make money, how to write guest posts, how to start a weekly assignment, etc. Useing your sidebar as an advertisement for different areas and functions of your site is very important.

8. Youtube

YouTube, after Facebook, has the highest page views of any site in the world. Last estimates I heard were around 30 pageviews per person. That means that, on average, every time someone visits YouTube they end up watching 30 videos! The reason? It’s the sidebar.

YouTube sidebar

YouTube sidebar

By showing people related content with enticing screen shots from the videos, YouTube gets users to dig deeper and stick around longer than they normally would. All this browsing makes it more likely users will see an advert and interact with it.

9. Facebook

For some reason people always overlook Facebook when it comes to discussing excellent website and blog ideas. I think it is because it just seems to big and impossible to mimic. But the way they have designed sidebars is extremely indicative of what we as bloggers should be doing on our blogs.

YouTube sidebar

YouTube sidebar

It shows insights into the page, what your friends are doing, and any important notifications. All of these things, when applied to a blog, can serve to really make your readers more addicted to your site. And aren’t we all addicted to Facebook?

10. Men with Pens

Like some of the others, Men With Pens uses its sidebar to promote the variety of services on offer.

Men With Pens sidebar

Men With Pens sidebar


One thing I really like about this sidebar is that it is totally consistent with the rest of the design. It goes a long way towards keeping the site true to its brand. But, as always, the best thing about James’s work here is the copy. The way the calls to action are written in this sidebar are second to none.

Which is your favorite?

Leave a comment and let me know which sidebar is your favorite. It doesn’t have to be one on this list, either; if you know a good sidebar that I’ve missed, please drop the URL below. Lastly, will you be changing anything in your sidebar as a result of this post? Let us know.

The Blog Tyrant is a 26 year old Australian guy who plays video games at lunch time and sells blogs for $20,000 a pop.

Principles of Effective Blog Design

This is a guest post by Peep Laja, CEO of Traindom.

People judge books by the cover, and other people by their looks.

Take a look at these two men:

Two men

Now answer these questions (you can’t choose “neither”):

  • Which one would you rather ask investment advice from?
  • Which one would you rather have babysit your children?
  • Which one would you rather have cook your dinner?

… and so on. You don’t know anything about these men. Yet you make assumptions and can even take decisions based on their looks.

What does that have to do with your blog? Everything!

“As aesthetically orientated humans, we’re psychologically hardwired to trust beautiful people, and the same goes for websites. Our offline behaviour and inclinations translate to our online existence.”—Dr. Brent Coker

Dr. Brent Coker studied the impact of attractive websites on human behavior. Websites that are more attractive and include more trimmings create a greater feeling of trustworthiness and professionalism in consumers.

People judge your blog based on the design

If somebody knows you well, they don’t care about your looks that much. If they see you for the first time, looks matter a lot.

The content of your blog is always more important than the design, but you need to woo people with your design first. You draw them in with design, and keep with content.

“Design is not just what it looks like and feels like. Design is how it works.”—Steve Jobs

The following advice will help you design a better blog and this in turn will help you sell more (whether you’re selling free sign-ups, coaching sessions, products, or whatever).

Make it easy to find stuff

Who is your site for? What are they looking for? Value function over aesthetics: 76% of people want it to be easy for them to find what they want.

What kind of blog layouts are they used to using? Remember, people spend most of their time on other websites, not yours. Avoid totally new and never-seen-before layouts. Your car isn’t unique, and your house might not be either.

For return visitors, search is vital. Make sure your search box is clearly visible (above the fold), at least 27 characters wide and that the search can actually find relevant stuff. WordPress’s built-in search is very poor, and it lists the results by date, not relevance. Use a plugin like Relevanssi to improve it tremendously.

Less is more

Use plenty of white space. Don’t fill every possible space with banners, messages, or whatever else. The more breathing room there is, the easier it is for visitors to consume the information you produce.

Here’s an excellent post on using white space.

Rule of thirds

You should never publish a blog post without an image. A visual communicates your ideas much faster than any text can.

The best images follow the rule of thirds: an image should be imagined as divided into nine equal parts by two equally-spaced horizontal lines and two equally-spaced vertical lines, and that important compositional elements should be placed along these lines or their intersections.

The rule of thirds

Image licensed under Creative Commons

See how the image on the right is more interesting? That’s rule of thirds in action.

Clarity matters

Content and clarity are important parts of the design.

What is this place? What can I do here? How is it useful? First-time visitors need to get answers to these questions within their first seconds on your blog.

Make sure it’s possible to clearly understand what your blog is about and who’s it for—no matter which page the visitors land on. The better you build a connection between your reader and your blog, the higher the chances they will stick around.

People start reading your website from the top-left corner. The fixations go in order from left to right. That’s where you want to place the most important information.

Readability and typography

The text on your blog should be beautiful and easy to read.

Use large fonts (at least 14px), short lines (see the width of Tynan’s blog posts), and lots of white space. Create a new paragraph every three or four lines, and a subheading after every two to three paragraphs.

The best blog typography lends a meaningful purpose to the content while triggering emotions in your readers in the process. Besides picking a beautiful web font, make sure that different text elements have a different look and feel (main headings, subheadings, regular text, italic text, quotes, lists, and so on).

Here are 10 Examples of Beautiful CSS Typography and how they did it. Also take a look at Space, a WordPress theme designed for reading.

You can use TypeTester to test and compare different fonts, sizes and so on.

Invite repeat visits

Over 95% of people won’t buy anything on their first visit. Hence you should not even try to sell to your first-time visitors. Instead, try to get them to come back so you can build a relationship and add value before you make them an offer of any kind.

How can you do that?

  • Invite them to subscribe to your RSS feed (and state how many people already do as a type of social proof).
  • Use a lead magnet to attract them to sign up to your email list.
  • Invite them to subscribe to your blog posts over email (Feedburner is a good tool for this).
  • Ask them to follow you on Twitter or become a fan on Facebook.

Make sure you focus on one of these options most (email list is best), but give a choice of up to three options.

This is how aext.net is doing it:

aext.net follow invitation

The aext.net follow invitation

Signup forms

The best signup forms:

  • put the form labels above the input box (not next to it)
  • give clear reasons to take action
  • have the submit button say what’s coming next
  • ask for as little user data as possible—an email address is enough in most cases.

The more fields people have to fill in to subscribe, the less likely they’ll be to do it. Email personalization by name is not working as well anymore anyway, so you might as well not ask for those details.

The One Question, a site helping people find their life purpose, has 30% of new visitors sign up via this form every day:

The One Question subscription form

The One Question subscription form

Why is it so effective? The form offers the exact thing people search for on Google to come to the site. If you offer people what they want, they are happy to sign up.

Text logo: 1% pain, 99% gain

You don’t need to hire a fancy designer and pay top dollar for your logo. Even huge budgets might not make much difference here.

You can create a beautiful logo using text. Pick a beautiful fontand a background color you like—and voilà! A designer from Edicy took just 15 minutes to create this logo for an imaginary company (Tajo Oja):

Edicy's text-only logo example

Edicy's text-only logo example, by Tajo.ee

Careful with stock photos

Stock photos seem like a good idea, but 90% of them are utterly fake and cheesy. Have you googled “women laughing alone with salad” recently?

How can you expect to be taken seriously if you feature suits shaking hands and half-naked women measuring each others waists?

Some people advocate that given the proliferation of low-cost cameras and smart phones, your own photography should be used rather than stock.  I agree.

Can’t decide on the color scheme?

Let’s say you like the color red, but can’t decide what other colors match your favorite shade of red.

You don’t have to guess or ask your friends. You can use online color matching tools for this:

How often should you revamp your blog design?

That’s actually not the right question to ask. You should only change it if there’s a real need behind it. What’s not working for you today? Put the goal first, and the redesign second.

Will the new design help you get more clicks to your ads? Increase pageviews or signups?

Ideally you’ll see your blog as a living, breathing organism that never stops evolving. Constantly A/B test your most important pages and design elements, and measure the improvement. You can only improve what you measure.

Peep Laja is the CEO of Traindom, online software for building online courses and membership sites.

Boost Your Blog #6: Optimize Menus and Sidebars

Continuing our discussion of things you should be doing right now to improve your blog, today’s tip is:

6. Optimize your menus, navigation, and sidebars

One task that I think many of us could benefit from on a periodic basis is a critical review of menus and navigation areas on our blogs.

I include myself in this—recently it hit me that on my photography blog I wasn’t promoting my ebooks in my menus. I just had one menu item pointing to a very dated page that was no longer relevant. I swapped the photography ebook sales page link in and again saw an increase of traffic to that landing page.

Ultimately, it’s about working out what actions you want readers to take when they visit your blog and then making sure that you’re calling your readers to those actions in prominent places on your blog.

Are you doing this? Can you optimize your menus and sidebars further?