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.

Replace that code with this:

More resources

For more ideas on speeding up your blog, see:

• 8 Things You Can Do to Speed Up Your Site and Get More Traffic in 2012
• How to make your blog load faster than ProBlogger
• Speed Up Your WordPress Website: 11 Ways to Improve Your Load Time

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.

Originally at: Blog Tips at ProBlogger

Make Your Blog Load Faster than ProBlogger: Part 2

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.

Originally at: Blog Tips at ProBlogger

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

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 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.

Originally at: Blog Tips at ProBlogger

Why You Should Create Your Own Graphics for Your Blog

“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).

Originally at: Blog Tips at ProBlogger

How to Use Images in Your Blog Posts

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

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

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

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.

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

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

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

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

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

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

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.

Originally at: Blog Tips at ProBlogger

10 Of The Web’s Best Sidebars

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

Take a look at these 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.

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:

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

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, 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:

• Adobe Kuler
• Aviary Color Swatches
• Colorexplorer

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.

Originally at: Blog Tips at ProBlogger

Principles of Effective Blog Design

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?

Originally at: Blog Tips at ProBlogger

Boost Your Blog #6: Optimize Menus and Sidebars

You may not realize it, but the font settings on your blog can have a huge effect on how many people read your content.

And how many people read your content has a huge effect on whether a post goes viral.

How huge? Well, by some accounts I’ve read, just one common mistake with colors could reduce readership by a factor of five. And if you’re not making that mistake, you’re probably making at least one of four others. So in this article, I’ll give you the five most important best practices for presenting text to keep readers glued to your content, and away from the old back button.

Font size—16px minimum

At the very top of the the pile of legibility problems is font size. Back in 2005, Jakob Nielsen reported that in a survey of web design problems, bad fonts got nearly twice as many votes as the next contender—with two-thirds of voters complaining about small font sizes.

Sadly, nothing has changed since then. A random sampling of new blog designs at SiteInspire (a web design gallery showcasing the best of the best designs) shows that the average font size for body copy is 12 pixels. Some as low as ten pixels. None over 14 pixels. Similarly, if you randomly sample offerings from the popular Elegant Themes or ThemeForest, you’ll find that every single theme sets post content at 12 or 13 pixels.

And of course, other theme creators tend to follow the lead of the bigwigs.

But as usability and typography expert Oliver Reichenstein of Information Architects points out, 16 pixels is the font size that browsers were intended to display by default—and it is not big. 16px text on an average screen looks about the same size as 12-point text in print. That’s the default size for most magazines, as well as all word processors, because it’s the size people find most comfortable to read. Many people—especially those over 40—find it very difficult to read smaller text. As Reichenstein observes:

There is no reason for squeezing so much information onto the screen. It’s just a stupid collective mistake that dates back to a time when screens were really, really small … At first, you’ll be shocked how big the default text is. But after a day, you won’t want to see anything smaller than 100% font-size for the main text. It looks big at first, but once you use it you quickly realize why all browser makers chose this as the default text size.

Use dark on light text—reversed is no good

Fortunately we’ve pretty much moved past the days when content authors thought that fuchsia on blue text was cool. But white on black text, known as reversed type, is still pretty common. As are variants like white on some other dark color.

Reversed type reduces not only the number of people who’ll bother to read your content, but also their comprehension of it. This is because it strains the eyes. Staring at reversed text for an extended period tends to create a kind of “glare” effect, where you feel like the letters are too bright to look at. Depending on what research you consult, studies show that light on dark text reduces your readership between 50% and 400%.

Why risk losing so many readers? Black or very dark gray on white looks clean, and there are plenty of great themes that use those colors.

Line width—45 to 75 characters

Here’s another little-known rule that a lot of blogs break. In order for your eye to easily follow one line to the next, you want no more than 75 characters in each line. This is called the line measure. Beyond a measure of 75 characters, it’s hard to track the end of one line to the beginning of the next without getting lost.

On the other hand, if you have a measure of less than 45 characters your eye will get fatigued quickly, because you’ve barely started to read one line when you have to jump to the next. You feel like you never get a chance to rest.

For this reason, your ideal post content area will have lines of text about 60 characters long. Of course, you do also have to take aesthetics into account. On many blogs, the “ideal” measure leaves a huge gap on the right margin, or makes the text seem squished into a tiny area. I use a measure of around 70 characters on my own website for exactly that reason. But if you’re pushing past 80 characters, you’re reducing your readership—guaranteed.

Line height—130% or more

Fortunately this is a less common mistake. If you’re using a professional theme, you probably don’t need to worry.

To give you an example, I’ve set this paragraph at the default line height (also called leading, after the strips of lead used to separate lines of text on old printing presses). It feels cramped and uninviting to read, and it’s hard to follow the lines from one to the next because they blend into each other.

On the other hand, this paragraph is set with a line height of 200%—equivalent to double spacing in a word processor. I’m sure you’ll agree that the lines here feel way too disconnected from each other, and unless you’re submitting a research paper this is not the way to go.

Finally, this paragraph is set with a line height of 150%. That means that for every pixel of font size, there’s one and a half pixels of distance between the lines. This turns out to be pretty reliable sweet spot for most fonts you’re likely to use on a blog—but feel free to experiment between about 130% and 160% to see what works best for your own content.

The left margin—don’t break it

This last tip isn’t exactly a font issue. But it fits into the same general category. Bloggers routinely include images in their posts. Whether or not that’s really a good idea is a topic for another time—but for now, let me just give you one piece of advice.

The left margin is sacred. It’s how we track text down a page in the Western world. It’s the “ground” out of which the lines grow (often to quite different lengths), and it’s the foundation for our eyepath as we read down the page.

But if you break the left margin, that all goes to hell. Your eye has to scan around to try to pick up the new margin, so you can keep on reading.

In other words, every time you left-align an image, you put a speed-bump in your reader’s path. And you’re compounding the problem by dragging his attention away from the text with your visually dominant image. Needless to say, readers who keep being distracted and having to relocate the left margin often don’t read to the end of a post—so they often don’re share it or comment on it.

Bonus tip: drop caps increase readership

By “drop caps” I mean initial capitals, where the first letter of the first word of your post stands out much bigger than the rest. According to research conducted by Ogilvy & Mather, this increases readership of a piece by an average of 13%.

Drop caps aren’t built into most blog themes, and they can be tricky to do on the web, but if you’re up to a little coding, check out this tutorial on how to create them.

Five mistakes: which ones are you making?

Now is the time to head on back to your own blog and see which of these five important best practices you’re not practicing. Then, fixum! But don’t forget to share the changes you’ve made in the comments below!

Bnonn is the author of 25 free video lessons on how to turn visitors into customers—part of his conversion-optimization course ‘Attention-Thievery 101’. Known in the boroughs as the Information Highwayman, he helps small businesses sell more online by improving both their copy and design. When he’s not knee-deep in the guts of someone’s homepage, he is teaching his kids about steampunk, Nathan Fillion, and how to grapple a zombie without getting bit.

Originally at: Blog Tips at ProBlogger

5 Simple Font Changes to Boost Readers, Comments, and Shares on Your Blog

Some, such as using shorter sentences, may actually improve your readability score. Others, like font choice and adequate white space, won’t impact your score but are every bit as important. As I said last month, it’s not the score that matters, it’s whether readers find your blog useful and engaging. This month’s tips will help you connect with readers … even if you have no interest in your numerical score.

To give you some examples of these principles at work, we’ll use blog posts about the past month’s most-blogged-about stories (rankings provided, as always, by Regator. (They are, in order: Bin Laden, Memorial Day, Donald Trump, Arnold Schwarzenegger, Lady Gaga, Oprah Winfrey, Cannes Film Festival, Rapture, Tornado, and Dominique Strauss-Kahn.) Here’s how you can start improving your readability right away:

1. Use fewer links

Some studies have shown that links in text reduce comprehension, even if they’re not clicked. The theory is that each time you are presented with a link, your brain pauses, ever so briefly, to assess the situation—to click or not to click? Those little decisions break your concentration and decrease comprehension.

The problem with eliminating all links is that linking can provide additional information, promote your old posts, support your opinion, and build community, among other things. So what to do?

Nicholas Carr suggests putting relevant links at the bottom of your posts rather than within it, which is a valid option. My advice would be to continue to use links but to do so sparingly, with the awareness that they do impact readability. Make sure each link you choose to use serves a purpose.

Examples: Compare CPJ’s “After bin Laden, a warning to foreign journalists,” which is less distracting because of its lack of links with the ACLU Blog of Rights post “The CIA Weighs In: Torture Did Not Help Find Bin Laden,” which features links that provide context and additional information.

2. Use clear language and avoid jargon

Avoiding jargon and using language that is as simple as possible will increase your potential audience. Even if your blog focuses on a niche that uses a lot of jargon or technical terms, such as business or the scientific community, consider whether saying the same thing in another way could help you expand your reach and readership.

Example: Storage Bits’s “Memorial Day 2011: defending the 9th” breaks down the U.S. Constitution’s ninth amendment into simple language and, in doing so, increases readability.

3. Proofread carefully before you publish

Nothing decreases readability like typos or grammatical errors. Everyone makes mistakes (mentioning typos in a post always scares me because that’s inevitably when something sneaks past you), but endeavor to make as few as possible because once you hit publish, your errors stick around on the internet.

Example: Bossip, which, it should be said, is a good blog that makes very few errors of this type, had a typo in its headline “Wait A Damn Mintue: Palin and Trump ‘Palling Around’ In NYC … Are They Joining Forces?“ and though they corrected the error, dozens of sites had linked to the incorrect version before it could be fixed and those links live on in Google.

4. Put thought into your font choice

The serif vs. sans-serif debate has been raging for as long as typography has been studied. (Alex Poole wrote a brilliant post based on his review of more than fifty studies.) Historically, serif fonts have been considered more readable in print but many argue that sans-serif fonts work best online.

Given the lack of a truly conclusive answer, I’m not going to advise you to definitively go with one over the other, but I will advise you to give it some thought. It not only impacts readability but also the general feel and aesthetic of your site. Consider not only serif vs. sans-serif but also line spacing, font size, and the aesthetics of specific fonts. Try timing yourself reading the same text in several different fonts with various spacing options and sizes to see which is fastest and easiest to read.

Example: There are countless font size/spacing/type combinations but start by comparing Gawker’s “Schwarzenegger Son Didn’t Know the Truth Until This Week,“ which uses larger, airier serif fonts, with LAist’s “Oops, He Did it Again: Schwarzenegger Not Being Investigated by Attorney General,” which uses smaller, more tightly spaced sans serif fonts.

5. Use active rather than passive voice

To remind the non grammar nerds among us: In sentences written in the active voice, the subject of the sentence is doing the action. For example: “Wombats write gardening blogs.” In the passive version, “Gardening blogs are written by wombats” (please note that the accuracy of these sentences cannot be guaranteed), the target of the action becomes the subject. So why should you avoid passive voice? Because in most cases, it will tighten your writing and make your sentences clearer, thus improving readability.

A recent Northumbria University study found that less educated readers may struggle to understand passive sentences when compared to active sentences. That’s not to say there isn’t a time and a place for passive voice. It’s useful when you either don’t know or are trying to avoid stating who performed an action (e.g., “The bank was robbed”).

Example: PSFK’s “Lady Gaga And The Future Of Music Albums“ uses active voice throughout the first paragraph but switches to passive for the second paragraph’s first sentence because it would be difficult to accurately list all of the individuals involved in arranging Lady Gaga’s products, events, deals, and appearances.

6. Write to communicate, not to impress

I’m not advocating for the dumbing down of language, but I am encouraging you to use the words that do the best job of communicating your message, regardless of whether you know a longer, fancier way of saying something. Don’t say “utilize” instead of “use” just to try to sound impressive. A writer’s goal is to communicate effectively. We’d all do well to remind ourselves of that every so often.

Example: PopWatch’s “Oprah gives her email out to everyone in the free world!“ uses straightforward language without sounding as though they’ve attempted to dumb it down.

7. Don’t justify text

Text with a ragged right margin is generally considered to be more readable than fully justified text. It provides more consistent spacing between letters and words, increases white space, and allows the eye to keep its place more easily. Unless you have a strong opinion about using justified text for its aesthetic appeal, go with flush-left text with a ragged right margin for readability.

Example: Compare Film School Rejects’s justified “Who Should Have Won Cannes 2011: The (Unbelievably Prestigious) FSR Awards” with 24 Frames’s flush left “Cannes 2011: A spell of conflict, and then (some) resolution” to see how justification impacts readability.

8. Use colors that are easily readable

For visual appeal, you may choose another palette, but for contrast and readability, black text on a white background is your best bet. If you’re going to use colored backgrounds and text, be cautious. Color combinations from opposite ends of the color spectrum quickly fatigue the eyes causing color “vibrations”, as do colors that don’t provide enough contrast.

Keep in mind that certain combinations also make your site less accessible to your colorblind readers. There are a number of sites that show you how your site would look to colorblind visitors—it is estimated that as many as 10% of men are colorblind so it’s not an insignificant concern.

Example: Though opposite, Good’s black on white “’I Don’t Understand’: How Rapture Believers Are Taking It” and Geekologie’s white on black “That Nutjob: Rapture Happened ‘Spiritually’, Apocalypse Still Slated For October 21st” are both high-contrast and accessible.

9. Use as many words as you need, and not one more

Example: Need to Know’s “Twisted logic: What tornadoes don’t have to do with global warming” is a good example of concise writing.

10. Keep sentences and paragraphs short

Reading from an illuminated screen is more taxing on the eyes than reading from a printed page and slows reading by as much as 30%. So avoid large blocks of text whenever possible, keep text scannable by using short sentences and subheadings, and allow for ample white space.

Example: The Two-Way’s post “In Goodbye Note, Strauss-Kahn Denies Accusations” illustrates a number of the points we’ve talked about here by featuring high-contrast text with a ragged right margin, short paragraphs, ample white space, and a large serif font.

Will you be making any changes to improve readability based on these tips? Tell us about it in the comments!

Kimberly Turner is a cofounder of Regator.com, Regator for iPhone and the brand-new Regator Breaking News service for journalists and bloggers. She is also an award-winning print journalist. You can find her on Twitter @kimber_regator.

Originally at: Blog Tips at ProBlogger

Blogosphere Trends + Improving Readability

One of the hardest tasks a blogger can face is getting readers to stick around. In actual fact, its one of the most important things you’ll ever learn to do. Why? Because unless those visitors delve deeper into your site you are essentially wasting your time with all that amazing content, social media effort, and SEO work.

Bloggers often forget that we need to use things like design, layout, colors, format, and so on to help visitors delve further in to our sites.

In this post I’m going to show you eight blog home pages that make readers click deeper. Hopefully it will give you some ideas for your own.

8 Home pages that draw readers deeper

I wanted to start off by letting you know that each of these pages was chosen for a different reason. Now, I’m not saying that these are the best blog home pages in the world. What I am saying is that each one does something extremely well that encourages new visitors to become more loyal readers.

1. Mashable

Mashable is one of the world’s biggest blogs and has a massively high page views. The main reason they are able to do this is through social proofed elements of their layout. Let me explain.

Social proof is where you provide some kind of assurance that other people have used your service. Testimonials, for example, are a common form of social proof. These things reduce anxiety in the reader but also serve to encourage a group mentality whereby people want to be involved in what other people are doing. It’s just human nature.

Mashable is all about social media and you see items like the “most shared this week” and the number of Facebook “likes” featuring prominently. The “buzz” this creates gets people to go deeper in to the site—people want to read articles that hundreds of others found interesting.

2. Digital Photography School

Digital Photography School is Old Man Rowse’s biggest blog. It has hundreds of thousands of subscribers and is one of the most heavily community-based blogs you’ll ever read. The activity in the comments and the forums is really quite wonderful.

I remember when Darren first released the new DPS design; I was blown away by how efficient and enticing it was. The old site was a straight up one column blog but this is a multi-level blog that divides the areas up by different sections of interest. Want to read about photography? Just go to that section. Want to read about equipment? Go over there.

This is a fantastic way to ensure photographers find areas of interest at the home page. It gives very little room for people to get bored and move on.

3. Huffington Post

Huffington Post. The blog turned worldwide news source. Sigh. Whatever you might say about the quality of the news that comes out of the site, the layout is extremely captivating. And it’s not because it’s pretty. Here is an example of a site on which the visuals aren’t necessarily pleasing, but they are very effective.

The area of the home page above the fold is dedicated to the most shocking current story as well as a pop up bar that asks you to get involved. It also uses a series of highly placed headers to show you what news is trending at the moment. Again, this is done to capitalize on people’s need to know what other people are interested in.

Scroll further down the home page and you see more engaging items like author profile photos to build loyalty, huge comment counts on featured articles and a mix of featured articles from different topics.

4. Zen Habits

Leo from Zen Habits is one of the nicest guys in the world. A few years ago he gave me some free advertising space and helped me launch a new blog. His new design is totally minimal and fits in extremely well with the branding of the site. Lots of space.

This type of strategy works extremely well for a blog with amazing content. Why? Because it is entirely focused on that content. You read that first amazing article and you feel compelled to delve deeper.

This is a brave design that takes a lot of courage because if each and every post that appears on the homepage is not amazing, you will see a lot of people drop off.

5. Smart Passive Income

Speaking of nice guys, Pat from Smart Passive Income is one of the nicest. Recently when I was setting up my podcasts he gave me a lot of time-saving tips. And that is a big theme in Pat’s design: help.

See the top level of menu items? Each one has a sub heading that gives you more information about what to expect inside. I remember the first time I visited Pat’s site, I spent ages clicking through each menu item to browse the contents. That is something I don’t normally do. The navigation is extremely “sticky”.

Similarly, there is a little space below the menu where Pat gives little random messages or tips. This takes the “tutorial” vibe of his site even further and definitely makes the experience feel more personal and intimate.

6. Tumblr

The guys at Tumblr are extremely good at design. In my article on the 12 Best About Us Pages I confessed that I thought theirs was the best one of the lot. And while the blog homepage isn’t right up to that standard, it is still worth a look.

The reason I included Tumblr in this list is because they use simple graphical elements to draw the eye down. Each post is very simple and usually only includes a picture or a bit of text. And each alternating post has a different background. Mixed with the fact that the emphasis is on showing which staff member wrote each post and you have an extremely addictive blog home page.

7. Fail Blog

Fail Blog, in case you have been living under a rock, is part of the LOL Cat empire. These guys build sites with funny pictures of cats and dogs and people getting hurt and make a small (read: large) fortune out of it.

Again, the homepage design is not beautiful, but it is extremely addictive. You can navigate through all their sites from the top as well as getting in on the action by voting for the best fails. They also have a little “random fail” generator, which is the kind of gimmick people on this site love to use to waste more of their day.

One of the cleverest ideas here is the fact that every can have a go at re-captioning the fails. This builds on the community in a massive way by getting everyone interacting with each fail multiple times. People write new captions and then come back to see what other people are saying about it.

8. The Onion

The Onion is quite literally one of the funniest websites on the Internet. And aside from hilarious content, great titles, and a home page that lets you see a plethora of content all at once, one thing they do really well is have an interactive and changing header that gives you access to new information.

Normally blogs just have a static header but this one moves and changes based on what’s going on at the blog. Sure, they still have the same logo and colors to keep the branding recognizable but they also use the variation to get people involved in new areas. Very clever.

Lessons to apply to your own blog

So what are the take-aways from these eight blogs home pages? What are some concrete things you can apply to your own blog today to increase the amount of pages people view?

• Focus on social proof.
  Make sure your homepage always has elements that relate to social proof. Use testimonials, popular articles, high comment counts, and social media followers to show that your blog is busy. This is something that you should never underestimate.
• Know your audience.
  It is really important to know who is coming to your home page and why. Are they coming for this topic or that topic? Do they want to read articles or listen to podcasts? Make sure your navigation allows them to find what they want instantly.
• Let your story show.
  Make sure you use photos or text to tell your story. Let people become loyal to you and your message. Tumblr does this with staff profiles, Pat does this by showing himself with his baby, etc. You want to make sure people feel like you are different from everyone else they’ve seen today.

As I mentioned in the post about the best about us pages, it is a really good idea to occasionally take a look at what the big guys in the industry are doing. Quite often they are doing it for a reason. The most important thing, however, is to make sure you don’t leave it as an idea but apply it to your own blog right away.

What draws you in?

I’d like to open up the floor now and find out what parts of a website’s home page draw you in deeper? Is it something to do with the layout, the content, the colors—or something totally different? Please leave a comment and let me know.

The Blog Tyrant hasn’t revealed his name yet but we know that he is a 25-year-old guy from Australia who works from home and has sold several blogs for around the $20,000 mark. Now he’s teaching you how to dominate your blog. Subscribe by email to get his free eBook on capturing 120% more email subscribers overnight or follow him on Facebook.

Originally at: Blog Tips at ProBlogger

8 Strategic Blog Home Pages that Draw Readers Deeper

After almost three years of blogging, and about the same time spent discovering my addiction to graphic design, I’ve come to realize that both of my passion go hand in hand. Blogging and design is a match made in heaven. And my favorite project to work on? Logos, of course.

Sure, I’ve made designs for both online and offline business, but when a blogger knocks at my mail box, I give them special priority. That’s because, in truth, designing a blog logo is one of the trickiest things to do. Of course there would always be clients who’re easy to deal with and just give me free reign in creating the design (not recommended!), but more often than not, bloggers are particularly nitpicky (as you should be) at every step in the process. And I don’t blame them. I’ve been there, done that—I actually used my previous blog as a guinea pig for countless logo experiments.

In this post, I want to cover all the bases with regards to designing a blog logo—from its importance to a blog, to the process of creating your own. Even if you’re already happy with the logo you have right now, who knows? Within the next few months or years, you might revamp your blog or create a new blog altogether—and then, this guide ought to be useful.

What’s the big deal with a blog logo?

I know a lot of non-believers out there. These bloggers do away with logos and rely on other branding techniques such as their name as a brand (e.g. the blogs of Seth Godin and Matt Cutts). These cases are exceptions to the rule. If you are Matt Cutts or Seth Godin, would you even need a logo to begin with? In reality, the blogosphere is split on this issue. While some bloggers consider their own logo a requirement for branding, for others, it doesn’t really add any value.

At the end of the day, I think it’s a matter of personal choice whether or not you think a logo is something you want on your blog. But eventually, most bloggers realize they need to have one to help build their blogs and their reputations, for a number of reasons:

Branding

Among the sea of blogs out there, being noticed can be a challenge—especially for new blogs. And it won’t make it any easier if you just leave your blog’s name in plain text as your header. A logo is also useful once you start developing products and services, as using a logo in your ebook or videos, for example, looks much more credible than just using your domain name.

Recognition

Blogs gain popularity the moment they’re recognized and remembered by an audience. This is where logos play an important role—they represent you, and make it easier for readers to connect to your blog.

Authority

Okay, maybe logo isn’t much of a factor to your authority. Though that doesn’t mean it should be completely set aside. In terms of authority, I think a good logo should act as an important symbol of your authority and credibility.

The makings of a great blog logo

There’s no concrete formula for creating a great blog logo.

Most of the time, it’s just the blogger’s and/or the designer’s discretion that comes into play. Being both a blogger and a designer gave me a good perspective on this issue, and based on the clients I’ve handled, these criteria have proven to be standard for every blog logo design.

A color scheme that works

Don’t just randomly use any color you believe is nice. Aside from the aesthetic value, remember that your logo has to be coordinated with your blog theme. Make sure you use not only the right color, but the right shade as well. Otherwise, it may seem a bit out of place or, as I said, uncoordinated.

There are some bloggers who do it the other way around: they start with a logo, then build their blog. I guess that makes you freer to conceptualize the logo. But of course, if this is the case, you have to consider the theme you plan on using for the blog anyway.

By the way, if you’re not good at making color schemes, try Adobe Kuler.

Good typography

Blog logos usually follow the symbol-and-text design style, since they’re also used as the header image. This is why you’ll need one good, stand-out, typographical font. Of course, the type of font that’ll be suitable will vary with your blog niche (personal blogs tend to have more artsy fonts, while professional blogs tend to go for bolder, simpler typefaces) and your personal preferences. I suggest that you steer away from complicated fonts like grunge or macabre options unless that’s really the image you want to portray.

An original concept

This might sound obvious, but you have no idea how often bloggers want to replicate a logo of an A-list blogger. Some of the bloggers who want to emulate a popular blog’s logo seem to think that, as a prerequisite to being great, you have to look like someone who’s already great. But really, when did someone ever achieve greatness through imitation?

Good resolution

Always ask for your logo to be created at high resolution. That you if you want to make it smaller, you can just resize the original logo. The trouble arises when the resolution is poor, the logo’s too small, and it gets pixelized every time you make it bigger. Not a good thing!

Conveys your blog’s or your personality

It’s easy to get carried away by designing for the sake of an awesome design. But never forget that your logo is not a painting: it’s there to serve a purpose, and that is to be a symbol of your blog.

On creating your blog logo

Okay, so now that we’re done with the reasons and essentials of logo-making, it’s now time to get into the meat of the story—making the logo itself. You have two ways to make this happen. You can either do it yourself and take full control over what happens to your logo, or hire a designer to do it for you.

Whichever way you choose, I have prepared a set of guidelines that’ll make the process a bit easier—or at the very least, familiar—so you’ll know what to do and what not to.

The do-it-yourself (DIY) logo guide

A cold, hard truth first: you’ll need, at the very least, basic design and editing skills to do this. In my experience, bloggers who goes this route either have no spare funds to pay for the design service, or they’re confident that they can create the logo without professional help.

If you have only the most basic design skills, don’t worry. Who says logos should be complicated, or loaded with effects? they don’t! Simplicity is your best asset. If you have average-to-above average design skills, lucky you! However, if you don’t have any knowledge at all in the field of design, don’t lose hope yet. There are many fool-proof design software products out there: just search for a few basic tutorials, and you’ll get the hang of it.

Here are the steps you’ll need to follow to design your own logo:

Step 1. Get hold of a Photoshop or a similar product

If you don’t have one, be resourceful and look for free online alternatives. Just Google for “free online alternatives for Photoshop” and you’ll soon find a ton of them.

Step 2. Conceptualize

What do you want your logo to look and feel like? If you’re stuck for ideas (like most clients I’ve met), it helps to check out competitor sites. Not that you should copy them, but this can help to get your creative juices flowing. Consider the elements of your design, the font you want to use, the colors you want to use, and even the logo’s dimensions—especially if you’ll use it as your header.

Step 3. Check for originality

This is the step even designers often forget. While this step is a no-brainer, it’s very important. You wouldn’t want to be accused of being a copy-cat, would you?

Step 4. Execute the design

This could be the hardest part, especially if you have no or little knowledge of design. Here’s a little tip though: create the logo one section at a time. Execute your symbol first, before you start thinking about the text, or vice versa. Make sure you use a good font. If you desire certain effects or elements, you can always Google for tutorials (it never fails to amaze me how people frustrate themselves with software when they could so easily just Google for a tutorial!).

Be sure to save the file every now and then. There’s nothing more frustrating about creating a design than losing unsaved changes, or worse: losing the whole file. Back-ups help too. Once you’re done, convert the logo to .png or .gif image files. These are the files that are best for use on the Web.

In creating your own design, you are obviously in full control of everything. The down-side is that your blog logo design is limited to your own designing ability (or lack thereof). Back when I ran a blogging tips blog, I never paid a cent to designers. I did everything on my own, and that’s how I acquired the skills of logo design. Who knows, you might end up on the same path too!

The hire-a-designer logo guide

If you don’t trust yourself with anything that has to do with art and design, I guess it’s best to leave these things in the hands of good designers. Of course, you’ll need to have some funds to take this route.

It’s a common misconception that hiring a designer means that you need to shell out hundreds of bucks. In reality, the competition in the design industry makes the pricing competitive. In fact, you can have your own professional logo designed for under $100. So really, if you believe a great logo is a great investment (which is true), then justifying the fee isn’t really an issue.

If you plan on hiring a designer, or using the services of a design company, here are a few pointers that you should consider:

Always check the designer’s portfolio samples

Designers often use a set of styles that can be seen in action through their portfolio. It’s best if you check their previous work to ensure that you can trust them to make your logo to a standard that you’ll be happy with.

Ask to see client testimonials

From a designer’s perspective, I’d say trust the portfolio more than the testimonial. We all know stories on how testimonials can sometimes be manipulated, though there are of course designers that have genuinely good feedback for their excellent service. Nevertheless, it’s at least a good thing to make sure that clients speak highly of the designer. If you can, see if you can find any familiar names (or research them) to make sure that the testimonials are authentic.

Read the design policy, and terms and conditions

How will the designer create your design? How fast will they design it? What are the packages or offerings involved? What are the terms for revisions? Before you order, make sure that you know how the designer operates and how much the finished product will cost you (watch out for hidden fees!). If it’s a good design service then you don’t need to dig around their pages to figure out how the process will work. It should be transparent.

When you order, be specific about details and/or instructions

There are still a number of clients out there who provide one or two sentences of “instructions” and then expect the designer to come up with a design that’ll blow their minds. Let’s face it: designers are not psychics! They only do what they’re told to do (because it’s all about what the client wants) and would hesitate to venture beyond those instructions. Of course, you can always say to your designer, “I’ll let you do whatever you want,” but that’s the most frustrating instruction ever! It’s always better if you have a clear vision for your logo. It makes our job easier, it speeds up the process, and it so much lessens the need for revisions.

If you can’t tell the designer what to do, at the very least tell them what not to do

Okay, so maybe you’re really out of ideas. There’s one thing a designer will at least be grateful for—if you remind him or her of the things you don’t want to see in your logo. Then at least they’ll be aware of the major no-no’s of the design and can avoid obvious mistakes.

For revisions, make up your mind, and be nitpicky

It’s stressful if a client keeps on changing his or her mind about the design. First, it’s counter-productive. But you’ll also be very lucky if the design service offers unlimited revisions—if not, ongoing revisions will likely cost you extra. Be detail-specific if you ask for revisions. Trust me: your designer will want to get the job done to your satsifaction as soon as possible.

Happy with your design?

Thank your designer, and give them a testimonial. Not happy with your design? Perhaps you’ve chosen a design service that offer a second concept re-design, or a 100% refund policy. Again, this explains why it’s better to pick design services that are credible, reachable, and accountable.

Put your logo first

Whether you design it yourself or hire someone to help, a good blog logo can deliver a lot of benefits in the long run. It doesn’t really have to be expensive—all that matters is that you get to build a symbol of what your blog is all about.

Last but not least, remember that logos do not posses any magical abilities, so don’t expect that having one will immediately catapult you to success. You need to work hard for your logo and brand to become known, not the other way around.

If you have any logo-making stories, insights, of nightmares, I’d love to here about them in the comments.

Liane (blogger of 3 years) is now the Founder and Team Head of the Blog Design Team, the design service behind every blog and blog businesses. And btw, she’s just 18 :) Follow her in Twitter @HeyLiane.

Originally at: Blog Tips at ProBlogger

The Ultimate Guide to Creating Your Blog Logo

Over the past four years, my business has completed over 500 custom blog projects and through that experience, we’ve learned the ins and outs of a what contributes to a successful blog design.

Today, I wanted to share the five key factors I believe you should consider before hiring a blog designer. Thinking about these five factors in advance will help you make the most of your experience.

1. What are your goals for the project?

This sounds like an obvious question, but being able to communicate clearly your reasons for wanting a blog design will be extremely helpful for your designer, and will contribute to a more successful project.

I recommend having one or two main goals or objectives. Then, if necessary, create a subset of several more. For example, when I ask potential clients what their goals are for their projects, it isn’t usual for the blogger to respond with a really abstract answer: “I want my blog to look better,” or “I want my blog to be more visible.” Neither of these goals are specific enough to help us create a great blog design, so it’s my job to ask more specific questions at that point.

Get a head start by really thinking about what your goals are for the blog design. If it’s a new blog, you may have specific goals around branding either yourself or your blog business. If you’re redesigning an existing blog, you may have goals such as increasing the number of daily opt-ins to your email list, or changing the layout so your visitors are able to read the content they want more easily.

Again, the more specific you can be with your goals, the more successful your project is going to be.

2. Which sites do you like? What do you like about them?

Having a list of sites and blogs that you like and can reference is a huge help to your designer. This doesn’t mean that you have to have examples of sites that you want to copy, or sites that you like everything about—actually, the contrary is true. The best thing to do is gather sites that you like specific elements of. For example, you could really like the header of one site, the color scheme of another site, and the footer of yet another site.

I recommend having a list of at least three to five sites that you like. As with my first point, the more specific you are with what you like about the sites, the better. If you like the header of a site, think about what it is that you like about the header. There are usually multiple elements within the header of the site; you may like the position of the logo, or the way the navigation looks, or where the RSS icon is located, or that it’s tilted sideways, and so on.

3. What’s your budget?

Have a budget in mind for your project—this may determine who you hire. There are many possibilities for designing a blog interface, and a wide range of pricing options.

The least expensive option is to go with a premium WordPress theme that closely suits your needs. Expect to pay in the range of $50-$150 USD. For improved branding, you can also have a custom logo designed, which will usually cost you around $300 USD.

There are other options, such as 99designs.com, that can be less expensive than engaging a design agency or even a well-known freelance designer. The upside is that you’ll get good value for your money, but you will also have to put a lot more effort into preparing a great design brief, creating a layout description, and giving feedback on designs. A reasonable price to pay on 99designs for a custom blog design is around $1100 USD.

Going with a custom design firm or a well-known freelancer is going to be more expensive, but you will have the experience of working with a professional, and can expect customer service to be top notch. I would recommend speaking with at least three different agencies or designers before you select one. This way, you’ll get to know the process, get an idea of what they charge, and have a feel for who understands your needs and who doesn’t. For a professional custom blog design, I’d expect to pay a minimum of $3,500—more likely, closer to $5,000 USD.

4. What’s your timeline?

The timeline for the creation of a custom blog design comes down the schedule of the person or company doing the creative work. Designers usually have lead times of at least a couple weeks for starting new projects. For example, we estimate that a custom WordPress blog will usually take eight to 12 weeks from start to finish. If you need it quicker than that, you can expect to pay extra for rush delivery.

Some individual freelancers may be able to complete a project faster, and options like 99designs.com can also be quicker. The best advice here is to plan as far in advance as possible, get multiple quotes, and choose the one that works for your timeline.

5. Which sites has the designer created that you like?

There is no doubt that you have selected several possible designers for your project, and that you’ve selected them at least in part because of their past work. It’s important that you can identify which sites they’ve done that you like, and what you like about them, for referencing purposes when you are speaking with the designer.

Conclusion

Whichever route you choose to go through—agency, freelancer, 99designs.com—just remember that the more thought and work you put into the project before approaching designers, the more successful your project is going to be. Getting a custom blog designed can be a headache or a great experience, but fortunately you can do a lot to influence which way the project goes.

Josh Mullineaux is a co-founder of Highlighter.com and Unique Blog Designs.

Originally at: Blog Tips at ProBlogger

Prepare for a Custom Blog Redesign in 5 Simple Steps

My strategy with blog design is like this. I generally aim towards a completely customized blog design that will give my blog a distinct look and brand – but before I work towards that I almost always start with a more affordable option because I like to test to see whether the blog is going to work or not.

As a result I’ve always been on the look out for great themes and when Chris Pearson and Brian Clark started DIYthemes and released the Thesis theme I was keen to test it.

I used Thesis as the first theme on TwiTip and have been very happy with it.

I’m actually about to release a complete overhaul of the design of that blog (completely custom) but in the year or so since TwiTip’s release I’ve been more than satisfied with Thesis. It’s been easy to use, it’s set up really well by default for Search Engine Optimization and it’s been easy to add extra things in (like advertising spots etc).

I never did much with changing much of the default design on TwiTip but many bloggers use Thesis as the basis for quite impressive customizations. You wouldn’t know it to look at but blogs like Chris Brogan, CopyBlogger, Laughing Squid and Rae Hoffman all use Thesis as the basis for their blog design.

The new update for Thesis (you get all these updates for free if you’ve already got it) takes the version up to 1.6. It includes new navigation menus with drop down menus and the ability to change colors throughout the themes without having to get into the code.

I’m told also that Thesis 2.0 is also being worked on and promises to be a fantastic update.

PS: here’s a cool video that shows just some of what Thesis is like to use – in it Chris Pearson plays around with changing the default layout in a number of ways to shot you how you can begin to customize it.

Originally at: Blog Tips at ProBlogger

Thesis Theme for WordPress Upgrades to Version 1.6

The irony of this is that I’m a self confessed dud when it comes to blog design. These days I hire others to do custom designs for my blog – but of course this doesn’t come cheap.

A recent survey here on ProBlogger showed that 79% of readers here use free themes or design their blogs themselves – but what if you want something more unique and/or don’t have the ability to design a blog or tweak a free theme?

I had all these questions buzzing around in my head recently when I paid a visit to local design marketplace site 99designs. I didn’t expect anything to come out of the conversation but what did come out of it excited me because it could meet a need that I see many of our readers having.

What 99designs have put together is a way to run a competition to have a new WordPress blog design created for your blog for as little as $369.

Now before I go any further – $369 is out of many bloggers leagues – but it is certainly a cheaper option than hiring a designer for $2000-$3000 to do a custom job for you. It’s not going to be for everyone but is sure to be an attractive option for those looking for a mid priced design.

The process to run a competition is simple. Here’s how 99designs describe it:

1. Set your budget and requirements

Tell us your budget and what you want designed, and we will post it on 99designs.com

2. Designers will create designs just for you

Designers from around the world will compete to create the best looking design just for you. Most projects get over 20 different design concepts to choose from. Rate the designers you like, eliminate the ones you don’t like.

3. Choose your favorite design

Pick your favorite design as the winner. Show it off to your friends! The winning design is yours to keep forever.

4. We code and install your theme (optional extra)

Through our partner, Thinktank Media, we’ll have your new WordPress theme up and running on your blog in 5 working days. Our themes are coded on the Sandbox theme, so they’re compatible with both WordPress.org and WordPress.com blogs!

They also have a 100% money back guarantee if you run a competition and don’t find a design that you like.

Keep in mind that what you’re running the competition for is the ‘design’ – to have it coded and/or installed you either need to choose to pay extra for these options or do that part yourself.

I hope those of you looking to find a new design for your WordPress blog find this useful! Check it out here.

Originally at: Blog Tips at ProBlogger

Run a Competition to Find Your Next WordPress Blog Design

61% of our readers are using free themes in some way – either using a default theme that the blog came with (11%), downloading a free template (21%) or taking a free theme and tweaking it (29%).

18% of our readers are designing their blogs completely on their own and while the market for premium themes does seem to be growing only 13% of you have paid for a theme.

The lowest response of all was for people to pay for someone else to design a blog for them (8%). That brings the total of those paying for their design in some way to 21%.

Total Votes at the time of publishing these results: 2513

Originally at: Blog Tips at ProBlogger

79% of Bloggers Pay Nothing for their Blog Design

Each week two WordPress themes are featured and readers are asked to vote for their favorite. While obviously the site’s about selling WP themes it’s also kind of fun and will be interesting to see what themes win each week. The winner gets put into the theme store once the week’s results are in.

Nice idea and the first two themes up for your vote are pretty nice themes too.

Originally at: Blog Tips at ProBlogger

Theme Wars – Where WP Themes ‘Battle’

In my previous post, I talked about what I do when commissioning custom WordPress theme design. It left where the job started. In this post, I’ll talk about the steps that follow – working with the designer towards a complete and functional theme, reviewing it and finalizing the project.

Reviewing prototypes

The first thing the designer needs to send me are prototypes of the website. These are non-functional documents (images). The designer isn’t creating a real web page for that, but rather using a drawing tool. Prototyping is a creative process. It’s when the web designer’s creative abilities get to shine.

Let the designer design, don’t do a review by committee

If you were a graphics designer, you’d have probably built your theme yourself. You’re probably not, so you asked a professional designer to help. The problem is, people don’t know how to review what they get so we start asking for feedback from others. The wife, our friends and colleagues all have something to say. Then, we compile that ‘rejects list’ and send to the designer. What we’ve done right now is make sure the designer can’t do anything.

Graphics design is a creative process and produces subjective results. Any given design will always generate criticism. If our objective is to come up with a design that makes everyone happy, we’ll end up with a pale design that has no character and no impact. Our site will not be memorable and will have no branding.

My suggestion is – leave the creative work to the designer and concentrate my efforts on functionality.

For WPML, these are the issues I raised during the prototyping stage:

1. Make the top banner smaller and consume less page real estate.
2. Make the text background white so it’s easier to read.
3. Add a search box and language selector and integrate them in the top banner.
4. Make the screen shots in the features page larger.

Create a detailed theme checklist

As the designer is building your theme, take the time to compile a comprehensive checklist of items you’re going to check. When get the first delivery, it’s like a new toy. You’ll want to play with it and show it around. It will be very helpful if you have a checklist to go through for each delivery, so nothing gets left out.

Here is my list:

• All pages are HTML clean. To verify this, I review the theme in Firefox and use the HTML Validator extension. It displays the validation status of every page viewed so you can tell right away where there’s a problem.
• Pages look the same in Firefox and IE7. Even if all pages are 100% HTML valid, they might display differently in different browsers (due to different CSS defaults).
  Check the home page (if it’s a the blog’s index or if it’s a special page).
• Check samples of different templates (check for both enabled and disabled comments).
• Check a post with and without comments.
• Check a category page.
• Check a tag page.
• Check the search results page (and make sure that the search box is placed where it should).
• Sidebar supports widgets.
• Comments are threaded and properly coded (when I click on ‘reply to comment, the JS kicks in and the reply box is displayed under the comment).
• Use the site navigation and see that I can get to any page.

Just to illustrate what I mean by testing on different browsers, have a look at these two screen shots:

Menu problem on IE7 - incorrect Z order of floating menu

After correcting the Z-order - menus display correctly on IE7 and FF

These two shots were taken from a page that is 100% valid XHTML. No errors and no warnings. Still you can see that the navigation is completely broken on the top image and looks fine on the bottom one. This happened due to a weird IE7 bug which mixes z-order for elements if a page has more than one relative position blocks.

When the designer is ready with a new version the the theme, I review it in two stages. First on their server and then on my. If there are obvious errors, I like to see them immediately on their server before spending time uploading and installing it on my.

Logo graphics

An important part of the design is the logo. The logo that comes with the theme is great, but you also need to use it in other places. I use my logo graphics for business cards, banner ads and even in plugins. For this to work, you need to request the logo in a way that is independent of the rest of the theme design. I ask for the graphics as a high resolution transparent PNG (Portable Network Graphics).

Then, when the designer sends me the logo, I put it on different backgrounds and magnify. This way, any artifacts are easier to spot. For starters, try while, black and red. If your transparent logo shows strange edges, it means that the transparency isn’t right and it needs fixing.

My logo includes the graphics itself and some text. I ask to get them separately, so that I can use either one or the other. Also remember to take note of the font type used in your logo. You’ll need that when creating printed material with it.

Wrap up

A custom theme for your blog will give it an identity. Like any other design project, it has its risks. When defined and managed properly, this can be a fun thing to do and produce excellent results that will bring your blog to the next level.

I hope that these tips help. Tell us about your experience getting custom design work.

This post was written by Amir Helzer, founder of WPML, a mega-plugin that aims to turn WordPress into a fully featured multilingual content management system.

Originally at: Blog Tips at ProBlogger

Designing a Custom WordPress Theme – Working with a Designer [PART 2]

When you’re designing your blog all sorts of options are open to you – starting with a free theme (that you can later edit), through a premium customizable theme (like Thesis or Revolution2) and ending with a custom theme, created just for your site.

In January, Web Designer Matt Brett talked here about how to redesign a blog (and part 2). These posts covered the design goals, functionality and implementation. I’d like to talk about the process of working with the designer – the person who’s going to create your theme.

If you’re thinking about getting a custom theme, following these steps can make the process shorter, more productive and more enjoyable for both you and the designer.

1) State what you need and define the scope of the work

We’ll start with a list of everything that we need from this design:

A WordPress theme – sounds obvious, but you don’t want the designer to supply you just the PSD files, or a HTML file that you can turn into a theme yourself, right? Specify which version of WordPress you’re going to use it with.

Logo – a professionally designed logo can be expensive by itself, so make sure it’s included. When you ask for a logo, remember that you’ll also want to use it in printed material (like business cards or in magazines). This means asking for a high resolution version of your logo with transparent background.

Copyright – make sure it’s crystal clear that you have full copyright and exclusivity. This implies that the designer cannot use anything that violates the rights of others.

The discussion about copyright should clearly mention back-links. Web designers often give away free themes in exchange for credit links. If you want to link back to your designer’s site, that’s great, but you should decide that. You can instruct the designer to get your approval for any outgoing link placed in the theme.

Testing – ask the designers to supply a preview of your theme on their server. Normally, you can’t test their work on your live site. You might need to supply contents for this, or just do with the standard Lorem Ipsum.

2) WordPress theme basics – which elements to ask for

WordPress is evolving and theme design is more than just putting HTML in pages. You need to specify what kind of functionality you expect to get from your website.

List everything that you know you need. Here is what I told my designer when we started:

My design should include:

• Front page
• ‘Regular’ internal pages – for general purpose texts.
• ‘Features’ internal pages – these pages should have a unique template that lets me highlight special features.
• Posts (with threaded comments)
• Category pages
• Search

The design should have site-wide navigation including top tabs with drop-down menus, breadcrumbs trail navigation and context-dependent sidebar navigation. There should also be room reserved for the language switcher (inside the header).

The sidebar should be widget ready. Comments in posts and pages must support threading. Every page in the website must be HTML clean (pass HTML validation).

This list doesn’t tell the designer how I want the site to look, it just lists which things I need. Since she was doing a redesign for an existing site, I didn’t need to explain much about the contents for each page. If you’re getting a theme for a new site, there’s more explaining to do.

3) Prototypes come before the design

Even though you’ve chosen great designers, they’re not mind-readers. Ask the designer to provide prototypes before building any HTML or coding the theme. This way, you can approve the design concept before too much work has been put into it.

A prototype is normally delivered as an image (JPEG or PNG). During your work on the prototype, you need to take care of all the design issues. This includes the color scheme, look and feel, layout and content arrangement.

When you’ve accepted the prototype, know that this is how your site will appear. There’s not much room for design changes later on in the process. The designer’s job changes from design to implementation.

4) Payment and delivery terms

Last, but not least, before the project kicks off, you should agree on both payment and delivery terms.

Design work is not like building a railroad. You can’t pay per mile. However, there are some checkpoint on the way:

• Prototype / wireframe design
• Working draft
• Completed and polished design

Both you and the designer would feel better if payment is split per delivery. You can make an initial payment, release payment when each milestone is met and the final payment is left for when the work completes and is fully reviewed.

Ready to begin your custom theme design? Here’s a quick checklist of what we talked about:

1. Project overview
2. Detailed scope of work
3. Payment and delivery terms

In the next part of this post (tomorrow), we’ll talk about how to help the design go smoothly and make sure you’re getting everything you asked for.

This post was written by Amir Helzer, founder of WPML, a mega-plugin that aims to turn WordPress into a fully featured multilingual content management system.

Originally at: Blog Tips at ProBlogger

Designing a Custom WordPress Theme – Working with a Designer

I’ve been using Thesis on TwiTip since I started that blog back in November and have been very satisfied with it.

Chris has just launched version 1.5 of Thesis – a significant update upon the previous one. You can get a personal video tour of Thesis and many of the options and features that it has here.

Why I love Thesis?

I’m not a designer – I am hopeless on anything related to design.

For my two main blogs (ProBlogger and Digital Photography School) I’ve hired designers to come up with custom designs for my blogs. I intend to do this for TwiTip also at some point but while I’ve been building up the audience for that blog I wanted a clean and easy to use theme that would allow me to do a little customization.

Keep in mind I’m hopeless on design – so it had to be very easy to use. I also wanted something affordable to get me through the start up phase of the blog so that I could get it earning some money to help me pay for a custom design.

Thesis hit the mark for me. It’s easy to use, it’s a clean design in its default form and it has loads of customization options (see the video linked to above to see some of them). The other bonus of Thesis is that it’s well coded for SEO. TwiTip already ranks very well in Google, some of the credit for that is the coding of Thesis.

The other bonus with Thesis is the community of bloggers that has sprung up around it. They have a forum where there’s heaps of good information on how to use and customize Thesis.

Thesis costs $87 for a personal license or $164 for a developers license (where you can use it on as many blogs as you like).

If you’re in the market for a theme for your WordPress blog Thesis is a theme that you’ll want to consider.

Originally at: Blog Tips at ProBlogger

Thesis WordPress Theme Version 1.5 Launches!

If you’re a Thesis user (like me) you may have had some issues recently when upgrading to version 1.4. The issues affected a minority of Thesis users, and required reverting to an old version of Thesis for the sites to function while Chris Pearson troubleshot the issue – on his customer’s servers, free of charge. Chris was very responsive and issued a patch the same day (1.4.1), followed by another patch over the weekend (1.4.2). My hat’s off to Chris for providing what can only be called unparalleled customer support in a difficult situation.

This experience brings me to the larger issue – how do you ensure everything on your blog still works after an upgrade? This isn’t the first time I’ve had an issue upgrading – and I’m certainly not the first WordPress user to experience hiccups during the upgrade process either. We all occasionally have issues when we upgrade plugins, install a new plugin or upgrade WordPress itself.

Perhaps the most sinister are those issues where everything looks like it’s working fine. Sometimes after an upgrade I won’t even notice an issue until days later, and I’ll have to go back through my plugins one at a time to see what originally caused the problem.

Until recently, I checked for problems after an upgrade with the old blogger favorite “randomly click around and see if anything looks broken” strategy. The weakness of this strategy is the propensity to miss errors. I decided I needed a way to be more certain that everything went smoothly, and borrowed a couple concepts from my background in software engineering to help: Unit Tests and Regression Testing.

Unit Tests and Regression Testing

Units tests are simple, single function tests done to ensure every part of the software does what it is supposed to. If the test fails, you know exactly where the problem is and can fix it. Likewise, for my blog, each unit test checks for a specific piece of blog functionality.

In software development, a test might work at the time I first run it – but down the road I may change something that causes the test to fail. Repeating the tests whenever any change is made is called regression testing. In my years of software development, I’ve learned that a new change can cause software to react in ways we may not expect. Upgrading a plugin may cause another plugin to fail, or perhaps cause errors in your RSS subscriptions (which happened to me). For this reason, whenever I upgrade or install anything new to my blog, it is important I retest everything, every time – even if the change appears unrelated.

Blog Unit Tests

With that background, here is a handy checklist to review every time you install new plugins or themes, or upgrade any part of your blog. Some tests are especially relevant when installing a new theme, while some should be reviewed carefully in cases of plugin installs and upgrades. Since you won’t know exactly what is affected by each change, it’s important to go through the entire list every time. This list gives you specific checks you can run through in 15-30 minutes and know that your installation is successful. I use WordPress – but this list should apply regardless of your blog or CMS platform.

Note: When running these tests, be sure to force a refresh and clear your browser cache before beginning so you are seeing the current version of your site. If this sounds like Greek to you, here’s a brief explanation of forcing refreshes.

1. Index page
   1. Title of the page. Is it what you want it to be? Are site name and tag line in the order you desire?
   2. Site name. Is it present? Is it clickable (if you want it to be)?
   3. Description/tag line. Is it present? Is it clickable (if you want it to be)?
   4. Header image. Does clicking on it return you to the home page? Do you want it to?
   5. Favicon. Is your favicon still present? This is a sinister one, as browsers sometimes cache these even if you are forcing a refresh.
   6. Excerpts, Thumbnails and Full Posts. Is the index showing excerpts or full posts the way you want it to? If applicable, are thumbnails and featured posts where they should be?
   7. Post Titles/Permalinks. Does clicking on a post title take you to the blog post?
   8. Comment links. Are the correct comment counts displayed? Does clicking the link take you to the appropriate comment form?
   9. Categories/Tags. Are category and tag links displayed? Do you want them to be?
   10. Meta description. View your page source. Look for <meta name=”description” content=”[...]” />. Is the value in the [...] what you expect it to be? See SEO Tips for Blogs for a detailed discussion of why this is important. You may, optionally, want to repeat this test on single post pages.
2. Index sidebar (s), navigation links and footer
   1. Widget enabled theme. Are all the widgets present?
   2. Widget order. Are the widgets in the order they should be?
   3. Links in widgets the sidebar. Does clicking a link take you where you expect it to? Appropriate pages, external sites, etc? Do the links open in a new window, or the current window?
   4. Site wide navigation (if applicable). Are all the links present? Are they in the order desired? Click a couple. Do the links work? Do the links open in a new window, or the current window?
3. Archive pages – tags, categories, sitemap, and date based
   
   1. Index page tests. Repeat all the same tests as the index page. Spot check one category, one tag and one month archive as applicable. If you have a sitemap, check that as well.
4. Single Post pages
   1. Title bar. Is the post title and site name in the order desired? Does it show everything you want? Post Title, Category, Site Name, Tag Line?
   2. Post Title. Is the post title present? Is it clickable (or not) depending on what you want?
   3. Comment links. Do you want a link to the comment form displayed near the post title? Are the correct comment counts displayed? Does clicking that link take you to the appropriate comment form?
   4. Next/Previous post links. Are they displayed? Before, after, or both? Are they nofollowed or dofollow based on your preference?
   5. Page layout. Are sidebars, navigation links and footer present? Repeat the checks described under #2 above, Index sidebar (s), navigation links and footer .
   6. Categories and tags. Are categories displayed (or hidden) as desired? How about tags? Are they clickable? Are they nofollow or follow based on your preference?
   7. Breadcrumbs. If you have breadcrumbs, are they present and appropriate for the navigation you desire?
   8. Comment and Trackbacks: run through the list below.
5. Comment and Trackbacks
   1. Comment form. Is your comment form present?
   2. Comments. Are comments displayed? Are the comment counts accurate? Do the gravatars work, if desired?
   3. Trackbacks. Is the trackback link present? Do you want it to be? Are your trackbacks listed?
   4. Test comment. Submit a test comment. Does your comment submit? Is it held in a moderation queue?
   5. Comment subscriptions. Subscribe to comments option
      1. Comment feed. Subscribe to a comment feed – do you see all the comments? When you submit/approve a new comment, does it update?
      2. Subscribe by email. If applicable, try subscribing by email and then submitting another comment – are you notified via email?
6. Regular pages
   1. Comments on pages. Do you have comments enabled? Do you want them to be? Trackbacks?
   2. Sidebars. Are sidebars present? Do you want them to be?
   3. Page hierarchy. Is the hierarchy displayed the way you want it to be? How about your permalink?
   4. Repeat all the tests for the single post pages.
7. Images and image links
   1. Images. Navigate to a page or blog post with images hosted on your blog. Do your images load? Check the alt text and title text on the images – are they what you want them to be?
   2. Larger image. Does clicking the image bring up the large version (if applicable)? Is the link nofollow or follow based on your preference?
8. RSS feed
   1. New post. Publish a test post – does it appear in your feed? (You are subscribed to your own feed, right?)
   2. RSS Link. Double check the RSS link – is it pointing to your feed?
9. Errors and Redirects
   1. 404 page. Type in an address that does not exist. Review the 404 page. Is it the way you want it to be?
   2. Redirects. Have you redirected posts or pages in the past? Spot check a few. A couple internal posts, a couple internal pages, and a couple external links.
10. Contact form (if applicable)
    1. Send a test email. Send yourself a test email to ensure your contact form still works. Do you receive the email? Are all the fields present?
    2. Confirmation. Do you see an appropriate confirmation shown to the user on the site after submission? If applicable, is a confirmation email sent to the submitter?

This is only a partial list – but it’s a great starting point. If you have specific plugins installed such as CommentLuv, or various search plugins, be sure to check all of them individually as well. If you have a plugin that generates your sitemap, and you upgrade it – that’s a good time to go and double check that your sitemap page still loads appropriately.

What do you think? What tips do you have for ensuring upgrades go smoothly?

This is a guest post from Sid Savara, who writes about personal development and personal productivity at SidSavara.com. If you’re struggling to get through everything in your RSS reader and inbox, you should definitely click through to learn How to Effectively Read 12,853 Articles, Forum Topics & Blog Posts a Week.

Originally at: Blog Tips at ProBlogger

How To Sleep Better After an Upgrade – Blog Unit Testing