This guest post is by Mark Anderson of Andertoons.com.
This guest post is by Gab Goldenberg of The Advanced SEO Book.
In the last instalment of the Blog Design for ROI series, I discussed the importance of showering attention on your community using design elements.
The fourth commandment of blog design for ROI is to make your posts easy to read. This ensures that your message gets across even to first-time skimmers, which helps turn them into loyal readers (and post-sharers).
There are several elements that impact on the ease with which a post is read. The primary elements we’ll cover here are:
- a clear starting point and end point
- the number of words per line
- inline sidebars, pull quotes, blockquotes and image captions
- tables of contents (useful mainly for long posts)
- author credits.
Each individual blog post should have clear start and end points
The web 2.0 design trend contributed positively to web design practices in this regard, as it led many people to show rounded-corner graphics at the tops and bottoms of blog posts.
In itself, the roundness or squareness of the corners doesn’t matter. It’s the presence of the corner graphics that matters, because they indicate the beginning and end of the post.
You can see bottom-corner graphics in this old design of SEOBook.com’s blog:
In contrast to the above, it’s hard to distinguish where posts in WordPress’s Toolbox theme start and end, for lack of such graphic hints. Toolbox Theme, pictured below, uses large-font blue text links to show that a new post is starting.
If you didn’t know the site was a blog, though, you wouldn’t necessarily know that the links were the start of new posts, as I discovered in usability testing. Also, the blog’s name is only a little larger than the post titles. Using corner graphics clearly makes it easier to know when a post starts and ends.
That being said, the date, post categories and tags do help to distinguish the start and ends of posts. (And kudos to this theme’s designers for avoiding the calendar date icons, which are just distracting graphics.)
I’m not saying Toolbox is bad, it’s just that there’s an important improvement possible here. The flip-side is that the Toolbox theme gets some advantages from this light use of graphics, like fast loading times.
Line length and font size
Just as some forms of print are easier to read, so too it’s easier to read some particular text layouts online. For blogs, this means somewhere between 12-16 words per line, with about 12-point type.
Obviously this will vary a bit if you choose to accomodate older readers who typically prefer larger type (13 point of 14-point font sizes), but this rule is a good starting point.
Look at the legibility of my SEO blog‘s design in terms of the number of words per line, in the next image. There are a lot of words—20-22 words in each line!
In contrast, you’ll find that Problogger has 12-15 words per line.
These shorter lines are a lot more manageable and mentally rewarding, as readers feel that they are making progress more quickly.
It’s similar when kids choose a book with a large font and wide margins for their book report, so they can have done their homework (reading the book) in less time.
Besides your default post width and font size, which will determine post design, certain graphic elements also help readers speed through posts—and enjoy and understand them more…
Post-embedded sidebars, blockquotes, pull quotes, and image captions
Our blog posts need to be visually appealing not for the sake of art, but to help break up large sections of text into more manageable, bite-size pieces.
Pull quotes and blockquotes
Pull quotes and blockquotes, as well as post-embedded sidebars, help shorten some of the lines in your posts. This helps the reader feel like they’ll get through the post quickly.
In this, pull quotes are different from blockquotes, because blockquotes are typically complete paragraphs that are part of the main column of text. Smashing Magazine does a good job explaining the details of different quote types.
Blockquotes shorten a line by being indented, as you can see with the yellow line to the left of the content below.
Here’s what a post-embedded sidebar looks like (see the right-hand side of this picture), for those who haven’t yet seen one.
Do you see how the sidebar makes the main body of text narrower? This lets people to get through each line faster. It’s important also that the sidebar has a distinct appearance thanks to its grey background color. (You could use a border instead.)
Note: A post-embedded sidebar is different from the blog’s main sidebar.
The post-embedded sidebar offers information related to a specific post, such as biographical information on a person being interviewed, or background context on a story. The main sidebar is unrelated to a specific post and offers general information and navigation for the site overall.
Text tidbits: subheaders, bullets and image captions
I call these elements “text tidbits,” as they’re the little bits that get read most—they’re read by regular readers but also by skimmers who may skip other content, so that these tidbits are worth spending time on.
Since image captions are very highly read text tidbits, it’s important that blog themes include a caption element—even the basic grey background that is the default in WordPress.
In my personal experience, custom theme designs often forget to include a caption element. Words typed into the caption area of WordPress’ image uploader appear out of place, if they appear at all. This means visitors read fewer words, lowering the chances that they will become loyal readers.
Tables of contents
If you’re writing a long post with many sections, readers will find it useful to preview what the sections are. This way they can pick and choose what interests them.
Wikipedia of course, is the master of this technique:
The question of whether to follow Wikipedia’s approach of placing the table of contents as its own unique paragraph in the main body of text (as opposed to having the text wrap around it), is debatable.
On the one hand, this placement achieves the introduction’s goal, telling us what is to come. And this placement’s visual weight promotes use of the table of contents. On the other hand, a table of contents around which the main text wraps may prove less obtrusive while still communicating its point.
The answer to this question depends in part on the rest of your design, and so informal usability testing is the best way to choose which alignment option to choose.
Author profile information
It’s debatable where post authors should get credit for the post, but this matters both for new blogs and for blogs looking to encourage guest posting. On the one hand, leaving the bio to the end of the post rewards authors less—not every reader will read to the end. But placing too much content at the start of a post can be annoying for readers.
I’m in favour of a balanced approach: reward authors by showing the author’s photo and a one- or two- sentence bio with links at the start of a post. Then place a more expansive bio at the end for people who really must find out more.
The Fanciest Author Box plugin is an elegant way to create the more expansive bio:
The balanced approach benefits both the post author and the blog owner. When visitors see a respected, familiar face at the start of a post, they’re more likely to stay and read. And as I mentioned before, the use of images (regardless of what exactly they are) lightens a post and makes it more readable.
Blog post design pointers
When choosing graphic design options for your post, always aim to facilitate a quick read that will fully express your message. The more they absorb your message, the better for you and your blog’s ROI.
- Ensure people know where one post ends and the next starts, so that readers scanning homepages and archive pages can easily choose a post to read.
- Keep the line length down to 12-15 words to help visitors read more. Occasionally, make lines even shorter with some attractive pull quotes, sidebars, and blockquotes, as this helps move readers through your post.
- When writing long posts, offer a content preview in the form of a table of contents. That way people know if they’ll read something of interest from the very beginning.
- Post author credits are an important reward for encouraging guest posts, so share some love at the start—but save the whole personal bio for the end.
How does your blog post design stack up against these guidelines? Share your thoughts in the comments.
Gab Goldenberg wrote The Advanced SEO Book – and you can get a free chapter here. Gab and Internet Marketing Ninjas, the folks behind the Blog Design for ROI series here on Problogger, are offering to mail you a free print copy of the Blog Design for ROI guide as a small book. Get your free copy from seoroi.com/blog-design-for-
This guest post is by Gab Goldenberg, author of The Advanced SEO Book.
This is part 3 of Problogger’s Blog Design for ROI series. Today we’ll talk about integrating your community into your design. Since a blog is a form of social media, even if—or especially if—it’s a business blog, it only makes sense to design the blog in a way that will maximize interaction.
Let’s address the importance of interaction, though, before we delve into the details of design.
The skeptics amongst you may ask, “What are the benefits?” Heck, giving attention to others may attract trolls and other negative behaviour!
One of the great benefits is that an engaged community promotes your blog, providing word of mouth marketing. This includes social bookmarking and sharing, as well as regular links from your community members’ own sites. So you increase your social and SEO traffic. Plus building community is more enjoyable than manually requesting links and attention…
How do you show that you care about your community?
There are a number of ways to visually reinforce the importance of community on your blog, and they center around giving your community visual prominence and rewarding (“gamifying”) their behaviour.
Credit for the contribution: avatars
One easy way to do this is to use avatars—thumbnail pictures of your members that appear alongside their contributions.
If you accept guest posts, why make your guest authors anonymous? Instead, show their profile picture at the top of the posts they publish on your blog. (We’ll discuss this more in the next article in this series, on post design.) My friends at SEOmoz were some of the first people to do this:
Of course, this idea isn’t limited to post authors—most people comment and they are in fact the bulk of your community, so you should offer avatars to your commenters, as well.
Here’s what you want your blog comments area to look like:
What do you do for people who haven’t provided an avatar?
I’d suggest something generic that reflects your brand, perhaps with the text, “User hasn’t yet uploaded a profile picture.” The idea is that users will realize what they need to do to get the avatar to appear. (Note: avoid using the word “avatar” since not everyone knows what it means. “Profile picture” is clearer.)
SEOmoz gets this partly right by using their logo’s starshape icon, but they omit to specify why that’s appearing instead of human picture like other people’s. It’s a missed opportunity.
It is nonetheless a step up from the generic-and-distracting images provided by certain blog commenting/avatar systems.
Why limit yourself to just showing a person’s photo and name, though?
Awards, badges, and recognition
Since you want to encourage high quality participation, as well as helping people understand why they should visit a particular member’s profile page instead of clicking elsewhere, give your members titles (or “badges”) and display these alongside members’ profiles.
When I was in high school and really into hiphop, I used to frequent a forum, NobodySmiling, that did a good job of this, placing badges (in the shape of various trophies) for various achievements alongside members’ posts. In the screenshot below, you can see an excellent example of a site that recognizes user contributions.
The moderator MetiphOracle has his title, Moderator, displayed as well as multiple stars indicating his veteran-contributor status. Additionally, his post count, win-loss record (in hiphop battles), “Vicious rating” (how frequently other members clicked his Praise or Smite links, a pre-Facebook Like function), and two microphone awards are shown.
It’s also worth highlighting that most of the awards were accessible on the basis of merit—win ten rap battles and you got a bronze mic, for example. This is important, because if the awards are only hierarchical—that is, only one person can hold an award—then it can reduce motivation for newer members.
The site admins realized that this was a very popular feature and quickly added other awards for a variety of achievements.
That being said, being #1 (or in the top five or ten) is also very motivating to senior members—especially so if you make the achievement of that status a contest. That was the idea behind the belts, like the Vet Tourney award in the screenshot above.
You can take the idea even further though, and reward the best collaboration.
The crown award in the screenshot above went to the best crew—the group of rappers who beat other top crews in rap battles.
As someone who competed for (and won!) the crown, I can tell you that my friends and I spent hours talking on instant messenger about how we were going to do it. So the result of this kind of gamification of your community is that its members are no longer dependent on their interaction with you—they’re brought back to your blog repeatedly to interact amongst themselves, and the friendships they build.
You don’t specifically need different images for your reward badges though.
An easy way to start is to have some kind of general-purpose image on which you can overlay people’s titles. Below, SEOmoz have a gold-colour ribbon that appears below members’ answers in SEOmoz’s Q&A forum.
A simple way to do this without a lot of up-front coding work—and to see if you have enough traction in your blog’s readership to warrant the coding work—is to begin with a monthly community contest.
Offer prizes for different forms of interaction—the most comments, the best comment, the best comment by someone who never won before, and so on. Then, you can have a monthly announcement for the winners, and a page where you list current and past winners.
Help and encourage members to interact between themselves
Another thing I recall being rather practical and popular on NobodySmiling—and which is now found everywhere from Skype and MSN messenger to Facebook (though not yet Twitter)—is the list of members online. Essentially, this is an invitation to members to chat or private message with each other.
Where does the “members online now” block belong?
I’d venture to say that it’s becoming conventional to list a similar block—the Facebook Page Likers list—in the sidebar, so it’s probably a good idea to place this here. Using conventions on your blog requires less effort from your visitors.
A further way to help encourage the contact via your blog’s design is to make member contact information readily accessible. You can see this done on SEOmoz member profiles:
Another tool that’s not pictured there is a button that lets members send each other private messages within SEOmoz, similar to the way forum software handles membership interaction.
An even better way to display this is to make the person’s contact information available at the end of all their posts and comments. You can see in the screenshot from NobodySmiling that MetiphOracle’s accounts—MSN and others—were all linked below his posts.
This achieved a few things: it rewarded high levels of participation, provided recognition, and helped the members meet each other and interact.
“Without the cash for a national rollout, [Yelp co-founder Jeremy] Stoppelman decided to focus on making Yelp famous locally. With the help of a buzz-marketing guru he hired on a whim, Stoppelman decided to select a few dozen people—the most active reviewers on the site—and throw them an open-bar party. As a joke, he called the group the Yelp Elite Squad.
“[Yelp investor Max] Levchin thought the idea was crazy—”I was like, ‘Holy cr*p: We’re nowhere near profitability; this is ridiculous,'” he says—but 100 people showed up, and traffic to the site began to crawl up. Because the parties were reserved for prolific reviewers, they gave casual users a reason to use the site more and nonusers a reason to join Yelp.
By June 2005, Yelp had 12,000 reviewers, most of them in the Bay Area. In November, Stoppelman went back to the VCs and bagged $5 million from Bessemer Venture Partners. He used the money to throw more parties and to hire party planners—Yelp calls them community managers—in New York, Chicago, and Boston. The company now employs 40 of these people.”
Comments as forum posts—a way to encourage repeat and deeper interactions
Perhaps the most unique—and clever—form of tying a blog into a community that I’ve seen comes from the comic, Least I Could Do (NSFW Warning: sexual humour and scantily clad cartoon women).
Instead of using a common commenting system like Disqus, Least I Could Do (LICD) gets people to go to the forum to comment on blog posts.
The way the blog and forum are tied together is that blog posts are forum excerpts. In the screenshot below, you see that the Read More link (same as the Comments link) takes you to LICD’s forum.
The advantage of this approach is that forums comfortably hold longer discussions that are typically uncommon on blogs. Also, many of the community-oriented details described in this posts exists by default with forums (including easy member registration, avatars, recognition, member praise and thanks, and contact info links).
The disadvantage is that you need custom code to get your members’ avatars and other details to appear alongside their guest post author credits if you publish guest posts.
How to shower attention on your community
- Show avatars and usernames alongside contributions: Help people stand out as individuals. The more you do this, the more likely people will be to remember each other, and members will become friendly with one another faster.
- Visually recognize members:When people achieve certain contribution plateaus, when they get acknowledged by other community members, when they gain seniority, and when they outperform others, let them brag with badges that are visible on their member profiles.Pro tip: Make these badges embeddable on other sites so that members who are proud of their achievements can link back to your site to show off their badges.
- Encourage members to interact: Provide links to as many contact methods as they want to provide—Skype, MSN, social media profiles, personal sites, and so on. Also, show who’s online at the moment so it’s easy for people to draw their friends’ attention to particular discussions they want others to participate in.
Pro tip: Offer a chat room. It’s old-fashioned, but it works! Before there were live webinars, people had live events in chat rooms.
- Use forums for comments: Encourage a community to build around your posts by putting the spotlight on members, allowing longer discussions, and more.
What design techniques do you use to recognize and reward your blog’s loyal users? What other ideas have you seen on the web? Share your experiences with us in the comments, and check back next week for the next part in our series!
Gab Goldenberg wrote The Advanced SEO Book—and you can get a free chapter here. Gab and Internet Marketing Ninjas, the folks behind the Blog Design for ROI series here on Problogger, are offering to mail you a free print copy of the Blog Design for ROI guide as a small book. Get your free copy from seoroi.com/blog-design-for-
This guest post is by Gab Goldenberg, author of The Advanced SEO Book.
Previously in the Blog Design for ROI series, I discussed the importance of prioritizing your email optin form within your page layout.
The next best use of space in your design is to highlight your key content.
Why does highlighting your key content matter?
There are a few reasons why this is important.
- It helps convert one-off visitors into repeat visitors: If someone browses a few posts and realizes that they really enjoy the content, they’ll keep coming back for more. This is one reason why many blogs struggle to build a loyal following—they leave it to more-or-less random chance whether someone sees their best posts.
- It helps repeat readers keep digging into your archives: This way, they deepen their knowledge of the subject, and associate that education with you.
- This highlighting is also an easy, practical way to give visitors an idea of what you blog about.
When I say you should highlight key content, I don’t just mean posts, I mean your key posts and key blog categories. You can pick key categories either by popularity of the category’s posts and/or frequency of posting on that topic.
In the main content area
In this regard, I think ProBlogger’s design circa end of 2005 was a brilliant, successful approach to the problem:
Beneath the logo and banner ad, there are three visually dominant content blocks. The prominent position is one part of the story.
Another part of the success story here was the specific content featured.
- The first block, aptly entitled Introduction – Key Articles, featured core posts. It did something quite clever that went beyond that, though—after five specific posts, it offered a single link to drive people further into other posts—the Top 20 Posts at Problogger. And it offered a broad review of past experience—a summary of the best content, if you will—in the seventh link, Lessons I’ve Learnt.
- The second block, Tips and Hints – Toolbox, listed core categories on Problogger that still represent the blog’s topics accurately to this day—advice on publishing ads, blog design, writing and marketing.
- The third block, for miscellaneous items, provided valuable resources like interviews, case studies and tools, as well as miscellaneous info about ProBlogger like ProBlogger News, ProBlogger In The News and a Disclaimer.
I don’t know if it was deliberate at the time, but to me the content in those blocks is arranged in increasing order of expertise. Beginners can read, “What is a blog?” Intermediate bloggers can dig through the archives to satisfy their curiosity and deepen their knowledge. Experts can see interviews and case studies with particular details, as well as tools for for implementation.
In the sidebar
Another popular place—though probably less effective—to highlight a blog’s top content is the sidebar.
Here’s how Copyblogger did it back in the day.
And you’ll see that this is still where CopyBlogger highlights his top content today:
While CopyBlogger didn’t also link to category pages in 2006, you’ll see the design comes around and does this later, with the categories linked to above the Popular Articles section. Again, he enables people to go deeper into his subject matter and deepen their knowledge.
Email form + top content = win?
Another aspect which I like about Copyblogger’s positioning of the top content in the sidebar is that it’s right next to his email optin form.
One best practice for optin forms is to provide a [lightbox / popover] link to a sample email so people can preview what they’re signing up to. This advice comes from those well-known conversion experts, the Eisenberg brothers, founders of FutureNow. Here’s a look at their optin form.
Caveat: I said that I like this association of the email form with links to key content, because I think it’s similar to providing a sample newsletter as advocated by conversion rate gurus like the Eisenberg brothers. I haven’t tested it myself, though, so I don’t know if the analogy (sample newsletter link = top blog post links) holds true.
Raise ROI by highlighting your key content
After your email optin form, the most important element of your blog that you need to devote space to is your key content. It shows what you blog about, builds your loyal and subscribed audience, and helps people explore your archives.
Your key content is not just articles, but also categories and additional resources like tools and case studies.
Organizing the key content call-out by the intended audience’s degree of expertise is a practical way to make multiple audiences happy.
Placing the key content near your email optin form gives people a preview of what they’ll get in the newsletter, and may increase subscriptions.
I’d love to hear your thoughts on these tips in the comments. Have you tried these approaches? How did they work?
Next time, we’ll look at integrating the community you’ve built around your blog into the design of the blog itself. See you then!
Gab Goldenberg wrote The Advanced SEO Book – and you can get a free chapter here. Gab and Internet Marketing Ninjas, the folks behind the Blog Design for ROI series here on Problogger, are offering to mail you a free print copy of the Blog Design for ROI guide as a small book. Get your free copy from seoroi.com/blog-design-for-
This week on #blogchat on Twitter, we discussed the use of images in blog posts, and I thought that some of the advice we covered there might be useful for you too. So here are my top tips for using images in your blog posts.
1. Use an image per post
At Digital Photography School, I include an image at the top of every post.
This provides a visual point of interest that draws people to read the post. Whilst the audience is particularly visually oriented, I think this is true across the board. The web is filled with rich media, and great images now. So the more you can do to make text-based posts visually appealing, the better.
In fact, some of our most shared posts on dPS are composed almost entirely of images, with little to no text at all. Take a look at the stats on your blog for posts with images, and compare them with posts that don’t have images. You might find that the former do better with readers. They’ll almost certainly be more likely to be shared.
2. Use images to draw the eye
Using an image at the post’s top is a default for dPS, but we also often images later in posts, too. In this way, they act almost like sub-headings to draw people down the page, and keep them engaged throughout the post.
Not only do those later images catch attention, they provide visual respite for the visitor who is diligently reading through the whole post, from start to finish. So these images serve all kinds of readers—not just scanners.
I think the trick with this is to take care with the images you use. If the reader scans from the top image to a subsequent one, you may—or may not— want that subsequent image to jar for them. It’s important to choose those images carefully, so that they tell the story you want them to.
3. Use images for RSS
Images in your posts also grab the attention of users who are subscribed to your RSS feed. In that case, they can mean the difference between your post being read or ignored.
If you think images are eye-catching on your blog—which is already heavily designed and strongly visual, just imagine what they can do to get attention in a less designed, more texty environment.
4. Trust your instincts
I choose images for blog posts based on the feeling that the image gives me more than anything else. And I’ve really found this to work well.
Often here on ProBlogger, guest posters will send us generic clipart-style images to accompany their content, and we avoid publishing these.
The best images are the ones that evoke a feeling in you and your readers. Clip art probably won’t do that! What does are images that contain people. We’re human, and biology has preprogrammed us to look into each others’ eyes.
So I find that using images with people who are looking at the camera tend to be the most engaging.
5. Take your time
Images are important—and not just to those embracing Pinterest as a medium for growing their readership!
A good image is sometimes as important (if not more important) than a good title for a blog post. On dPS, sometimes I’ll take longer choosing the image for a post than writing the post itself.
You may not spend that much time on your image selection, but if you’re not paying much attention to it, I encourage you to build some time into your posting schedule over the next few weeks to source really strong, eye-catching, and engaging images. You never know how your readers will respond, but you might see longer visits, and more sharing of your content if you do.
Are you already using images on your blog? What types work best for you? Share your advice in the comments.
This guest post is by Rob Cubbon.
Psychologists have long been aware of the halo effect—a situation in which our judgment of a person’s character is influenced by our overall impression of them.
The same is true of websites. Rightly or wrongly, we judge a website first and foremost by the way it looks.
Think of your favorite blog and close your eyes for a second. Can you picture elements of the blog’s design (the logo, the colors) clearly? I bet you can; and I bet you like it!
So now that you know how crucial a blog’s design is to its success, how do you go about getting a great blog design if you’re not a designer?
What type of blog design do you require?
The first thing you need to decide is exactly what sort of blog design you require. Do you need:
- A small amount of customization of an existing theme: This would be the cheapest and simplest option—you could just have your logo tacked onto the Genesis Generate theme, for example.
- A fully customized child theme built on top of a solid theme framework: You might use Genesis or Thesis, with more unique features.
- A completely customized WordPress theme.
Either of the first two options would be sufficient for most blogs. A general rule would be the less you change a chosen theme, the less you’ll spend on design and the simpler the process will be.
I’ve had to “rescue” many blogs where someone has created a completely custom theme that the owner then finds unwieldy and difficult to work with. WordPress is the most ubiquitous CMS on the planet for a reason. The popular WordPress themes and theme frameworks are popular for a reason. Work with them rather than against them!
Working out the brief
Next, you must spend a good deal of time working out your brief. While a good designer will likely have their own questions to ask you, you’ll have trouble finding good designers if you don’t know what you want or need in the first place.
To begin, ask yourself which sites you admire. What is it about them you like? Is it the colors, the look and feel, the functionality? Visit them and answer these questions as specifically as you can.
Then, think about your own site. These are some of the major points you should include in your brief:
- What should it look like? Do you have any examples of websites you wish to emulate without copying?
- Who is your target audience? List the target readers’ ages, genders, geographic locationd, what sort of work do they do, etc.
- Would you like the site to be responsive to phones and tablets?
- Do you need a logo? What other logos do you like, or would like yours to be on a par with? Specify that you’d like the logo supplied as a small image, a large image, and in the original vector file format.
- Do you require any other design collateral? For example, business cards, email templates, a Twitter background, a Facebook page design, a YouTube channel background, etc.
- What functionality do you require? Do you want to be able to change around widgets such as featured posts, signup boxes, featured video, etc., on your home page as well as the sidebar(s)?
Don’t sacrifice user experience for design. Websites first and foremost need to work. So don’t get too complicated with the design brief. Simplicity is key.
Your brief should also include URLs of example websites you like and the specific parts of the sites you want to emulate on your blog.
Choosing a designer
Regardless of your budget, always try to find one person who can competently do all the work you require (design, development, email templates, logo design, etc.) if it is at all possible. You’ll win on two counts: simplicity and cost.
Once you start to get responses, you can begin to whittle them down. Some of the replies you get can be easily rejected. Other designers may have excellent portfolios but can be passed over because their skills aren’t appropriate. If a designer doesn’t have a blog design that you like in their portfolio, then it’s not a good idea to choose them.
If you have chosen a child theme on the Genesis theme framework, for example, you can specify this in the job description, and then only consider designers who have experience with Genesis.
Narrow the candidates down to a group of about five to ten, and then contact these designers with your brief. After they’ve reviewed it, they’ll be able to answer your questions about availability, timeframes, and costs. You will be able to remove more of them from consideration once you have this information.
At this point, check the the candidate’s references. Contact anyone who has previously employed their services and ask how the project went, as well as any other specific questions you’d answers to. This not only gives you peace of mind, it can also give you tips for working with particular designers.
Hopefully at the end of that process, you’ll be left with one or two designers who will be a perfect fit for you.
Working with contracts and copyright
Contracts and copyright are huge topics that vary enormously from country to country and from designer to designer.
If you are dealing with a designer through oDesk or other freelancing sites, you’ll use the contractual and payment arrangements there.
If you’ve contacted a designer privately, they’ll likely send through contracts in order to specify payment and work arrangements. Always read these contracts and suggest amendments, if necessary, to ensure the contracts specify exactly the deliverables and the timeframes expected of the designer.
Copyright ownership also needs to be covered. Copyright to designs tends to stay with the creator—the designer. This can be signed over for a fee, but that rarely happens. The work of the designer should only be used for the initially intended purposes, so don’t imagine you can repurpose a design for some other reason down the track.
Communicating with the designer
A good designer will ask you the right questions about the website you envisage, and will prepare and amend visuals of the home page and other pages in the site so you’ll know what you’re getting.
If you have chosen a designer online, there may be language, cultural, and geographical barriers to communication. This makes the initial brief writing and communication even more important. In these cases, you may want to start with the logo design to see how well you work together, and then move on to the website if that goes well.
But in all cases, make sure you and your designer agree on every detail of the brief and contracts, and understand the work involved.
What you can do
There are many elements that go towards creating a great looking blog, but if you can communicate the values of simplicity and clarity to the designer, you’ll be halfway there!
What about your tips? If you’ve ever worked with a designer to design a blog, we’d love to hear your thoughts in the comments.
Rob Cubbon is a web designer and blogger.
This guest post is by Anabelle of Read, Write, Live.
Have you ever woken up one day, looked at your blog’s header and other visual elements, and thought, “My, this is ugly!”
You need a visual redesign.
What to do?
There are two solutions to this problem: you hire a designer to work on your new visuals from scratch, or you try to do it yourself. The first solution can come at a cost, so cash-strapped bloggers can easily be tempted to try building their blog’s visual elements by themselves.
But what if, like me, you’re visually incompetent? I mean, really incompetent? You can’t draw a stick figure to save your life, and you know absolutely nothing about the basics of visual design. You’re a writer, after all, and writers are better off writing than playing around with pictures.
And yet, you can’t afford a designer, so you need to find a way, any way, to do it yourself.
In this article, I will share the lessons I have learned trying to redesign my blog visuals on my own—header, logo, and all.
Start with software that you understand
We’ve all tried to play with those complex professional photo and visual design programs. You load a picture or an empty canvas and you think “Wow, with all these great tools, I’m sure I can come up with something amazing!”
Well, not so much. After five minutes of trying to understand the functions of the program, you give up. This happened to me time and time again, until I discovered a nice little Mac app called Logoist.
Logoist is simple and has all the functions I need. I can use cliparts from its extensive library, add text, apply filters and effects and insert pictures and photos. Its interface is intuitive and it has a few tutorials to show you the ropes. It also has automatic grid lines that help align all your elements. This simplicity let me create more freely than any professional design program could.
There are a lot of apps and programs you can use for both Mac and PC. Some are free and most are reasonably priced. You don’t have to go for the $500 creative suite to get the job done.
Black and white are your friends
I’ve always worked under the principle that, when in doubt, you should take the simplest route. In visual design, black and white is a great base to start with.
A black and white design looks professional, clean, and easy to work with. You don’t have to worry about colors matching or clashing. You know your text and your visual elements will be readable on a computer screen, a tablet or a smartphone. Black and white reminds readers of printed paper, something that’s ubiquitous and familiar. It’s trustworthy.
But of course, black and white can become a little bland. To add variety, choose one (and when I say that, I really mean one) accent color for your sidebar widgets, for the picture in your logo, or for the blog title in your header.
For example, on my writer’s website, I decided to go with dark red. It’s a color I like, and I think it brings about the right amount of visual interest. On my blog, I count on the pictures inserted in my posts for a blast of color.
Play with fonts
For my blog’s header, I decided to keep everything simple and play with fonts rather than pictures or images. Each word of my title (Read, Write, Live) uses a different font that expresses something unique about that word.
“Read” is in a formal, serif type that you could find in a book or newspaper. “Write” is in a handwritten-looking font that illustrates the act of writing on paper and separates it visually the other two words. “Live” is in a bold, sans-serif font with unexpected lines. I added a small ornament (one of the cliparts in Logoist) in the middle for visual interest.
Here’s the logo version, with the first letter of each word:
Fonts are great because you can give personality to words and ideas before they are processed by the brain through reading. They leave an instant impression, and can make or break the viewer’s desire to read on.
A tool I love for choosing awesome fonts is Google Fonts. If you’re tired of Times New Roman and Comic Sans, Google Fonts has an impressive collection of independent, public domain fonts you can use.
Be yourself, be realistic
The most important thing when you’re stuck having to design your own visual elements without training is to be honest with yourself. If you don’t know how to use vector software, then don’t. There are a lot of solutions that are within your reach and your abilities.
You also need to be realistic: there is no substitute for a professional design. As much as a self-designed header and logo can fill in temporarily, as soon as you get a steady flow of readers, you’ll be expected to get some custom, professional visual design on your blog. But as a beginner or novice blogger, a handmade, simple header and minimal visual elements can go a long way
One last thing: remember to have fun. I can tell you that this kind of visual work can be absorbing and exciting when you really get into it. I didn’t know I could come up with something so attractive on my own. I was very proud of the results, and it got me compliments from readers too!
Have you ever tried to design your own visual elements? Do you have any other basic visual design tips you’d like to share with the visually incompetent among us? I’d love to hear from you!
This guest post is by Samuel of Internet Dreams.
I am a logo hunter! What that means is I almost always stop and look at a new site’s logo. Almost like shooting at it, but with my eyes!
Believe it or not, this now has a profound influence on whether or not I feel I am going to enjoy reading the new blog, or want to check out this new site.
The logo of a site is like the cover image on that new blockbuster movie on the block. As the design of a blog is important in a visitor’s eyes, the logo is that cherry to the top of the ice cream.
Because a logo can have a profound effect on a user, I decided to create beautiful looking logo for my blog. It was tough to think about how I was going to create it, though.
I thought of creating the logo myself, but I kept telling myself I wasn’t going to be able to create one I liked.
But that thought changed down the road, as you will read later on.
A novel solution
Many times, your creations, such as a new design or a new article, you won’t really like. This is fine, since the sense others get from seeing our creative projects is different from ours.
To solve the problem, I decided to hire a designer to design a new logo for me. Nope, the logo didn’t cost me a million bucks. All I did was get a design idea for only five dollars from fiverr.com.
I am not going to lie to you: I did not get a fully done, professional logo out of the box, just for five dollars! But I got the idea and the design layout from Fiverr, and it was worth every single penny.
I will show you step by step how to get this done, and how you can do this yourself without another designer’s help. Note that you will need to have some sort of knowledge of Photoshop to use this technique—but if you don’t, I’ve included some resources to help below.
1. Find a graphic designer using the reviews
This step could be the hardest part of the process. It’s important to make sure you hire a credible designer who gets the job done.
When I look for designers on Fiverr, I usually first send a message to the designer to gauge their interest. If they respond pretty quickly, I know the communication is going to be fine.
As you’re reviewing designers on Fiverr, look for the designer’s rating, and look at the reviews of that individual at the bottom of their profile.
2. Tell the designer what you are looking for.
You need to tell the designer what you want. Try to be as accurate as tell them as much as you can.
Tell them your ideas, because they will definitely need those ideas for their outline. But also tell them the colors and size you want, and give them some concept for the design—such as “excitement” or an object related to your blog.
This is the message I sent to the logo designer to explain what I was looking for:
Name: Internet Dreams
There will be no description for the logo. I prefer it be a text logo that is creative in a way. I really like a minimal design with the letters being the main focus. Design it dreamy in a way, but not too light either.
The color blue is the primary option. Experiment with different colors if you want. This is the website it is going on. Please try to make it stand out from that greybackground.
Message me with any questions, and thank you for doing this! :)
3. Don’t expect it to look perfect, since you’ll finish the design yourself.
You are paying this designer only five dollars. Don’t expect them to do the whole work and make a design worth hundreds like the other top logos out there. Remember, you get what you pay for on Fiverr.
I worked with the designer till the outline was exactly how I wanted it to be. This is how I received my “finished” logo from my Fiverr designer:
There’s not much color or texture in the initial design. But the concept of the design is what I really liked. So I took it from there myself!
4. Make the logo look professional with limited Photoshop skills
After receiving your initial design, always thank the designer for his fine job. A designer has certain skills in first thinking up the outline of a certain logo. So, thank him and give him a good review of his work.
Now, it’s your job to finalize the logo!
Don’t freak out, or think you have to be a Photoshop guru. All you are going to do from here is select a font that you like, and add it anywhere on your logo.
The cloud in my logo is what I added to make it more “dreamy.” Also I enhanced the look of the bubbles by using a free PSD created by a graphic artist.
If you don’t have great Photoshop skills, have a look at PsdTuts+. This is the website that I have learned many Photoshop skills from.
How’s your logo looking?
Nothing about this is hard. I am no expert in Photoshop, but I did learn some techniques along the way. Trust me: having a few basic skills in the use of Photoshop is worth it.
Your logo is the brand image of your blog. Many people will recognize your site by the logo you have on it. Not only the logo will be created by you, but also other aspects of the design of your blog will need to be enhanced, and you can do it with those basic skills.
If you do run into some problems on your end and do not feel comfortable to use Photoshop yourself, then that isn’t a problem either. There plenty of places on the internet where graphic designers are waiting to finish your work.
Or, just hire the same designer again from Fiverr, and let them finish the job. It’s your choice!
Have you done any designing yourself for your own blog? If you did, tell us how it went in the comments.
The online world can be a very complicated place. There is too much information all over! My name is Samuel and I own Internet Dreams. Internet Dreams is a place where you can engage and learn how to set up and succeed with your blog or site. Internet Dreams talks about SEO, blogging, social media, and much more….. Follow Internet Dreams on Facebook!
This guest post is by Ginny Soskey of Shareaholic.
A perfect blog post is hard to come by. Sometimes the mistakes are small, like a grammatical error, and other times the mistakes are so glaring that you just can’t look away.
You spend so much time coming up with post ideas, optimizing, editing, and promoting that you should make sure your posts are near perfect so your efforts don’t go to waste.
To help you make sure you’ve covered all your blogging bases before you hit “post,” I’ve created a handy infographic outlining the perfect post with some key learnings below:
It’s essential to start your post off with a great headline.
In Shareaholic’s publisher network, the most shared websites tend to optimize for keywords in their headlines, include headlines less than ten words, and stick to “list” and “how to” kinds of posts.
Think of your headline as a tweet—would you click through to the link if it showed up on your feed? Crafting a headline in the form of a tweet also ensures that your headline is short enough to be shared via Twitter.
People like to scan, and large blocks of text scare them off. Try to break up your copy with several sub-headers as it will make it easy for readers to digest your content. Having sub-headers will also help them to comprehend your post as the main points are brought immediately to their attention.
Numbers, bolded text or larger font size are all ways you can create sub-headings for your blog. If you have several authors for your blog, be sure to tell them how you want your sub-headers to be styled in your editorial guidelines.
3. Optimized copy
SEOmoz’s infographic of the perfectly optimized blog post will guide you to see where you should place your keywords throughout your post.
To identify your keywords in the first place, make sure to check your content analytics tool to see what organic keywords and topics are popular with your readers.
Having visual and interactive elements to your blog post is essential to engaging visitors on your blog. Find stock photos or Creative Commons Licensed material using Compfight or even create one of your own.
The best part about using visuals in your posts is that it’s easy to reuse them to promote your blog on Pinterest, which Shareaholic found to be the fifth largest traffic source in the world. Among our publisher network, we notice that websites with branded visuals get the most shares on Pinterest while along benefitting from the brand exposure of including their name in those shares.
5. Embedded CTAs
Ultimately, you want your readers to take some form of action from your blog. That could mean subscribing to your blog so they come back again, or maybe downloading an ebook or other offer from you.
Make it easy for them to do so by embedding a call to action (CTA) in your post. From what we see in our publisher network and on our own blog, CTAs above the fold do the best, as your readers don’t have to scroll to take action.
This is prime real estate on your blog, as it is displayed no matter which article your readers are viewing. Use this area to show off links to your social networks, subscriptions to your RSS feed and email list, and free downloads of white papers, infographics or badges.
One of my favorite plugins for the sidebar is Social Media Widget—it’s easy to customize and use for bloggers of any level. Having these buttons will help keep your readers connected with you long after they leave your article.
7. Social sharing tools
After you create content that people enjoy, you need to make sure it’s easy for them to share it through their social networks.
Make sure your social sharing tools are prominently displayed on each post. Also, you should choose social sharing buttons that your readers are likely to use—you can use content analytics to determine where people are sharing your content and then include those social networks in your sharing buttons.
8. Related content
It’s not always love at first “site”: it may take a few posts to convince your reader to share your content or subscribe to your blog.
A related content tool speeds up this process by engaging your current readers with suggested posts at the bottom of each article you publish. This is sure to increase your pageviews and improve your overall time on site.
As social media has gained popularity, commenting on a blog post has expanded from the real estate directly below the post to other networks like Facebook and Twitter. Commenting systems have evolved to accommodate to this change and one of my favorites is Livefyre—it works in realtime and integrates seamlessly with Facebook or Twitter.
Knowing how to optimize your layout for maximum pageviews and social shares is incredibly important to growing your blog. What are some of your favorite tools to help create a perfect blog post? Share your thoughts with us in the comments.
Ginny Soskey is a marketing manager at Shareaholic. Shareaholic creates social sharing, related content and content analytics tools for more than 200,000 websites, reaching 300 million people each month. You can keep up with Shareaholic on the Shareaholic blog to get more tips on blogging.