TO BUILD EXTRAORDINARY LINKS.
The Part of Content Marketing Everyone Skips Over
Before you even start reading an article, blog post, infographic, or anything else online, you’ve already made a few critical assumptions about it. These assumptions quickly become facts in your mind, and it’s VERY unlikely they’ll ever change.
The reason behind this is the same one that’s responsible for people going to important meetings wearing suits, not t-shirts.
In terms of content, as well as many other things, presentation is vital. Design is what sets your content apart before it’s even read. Because the majority of content producers skim over this, you’ll be at a huge advantage if you make design a priority.
For link building, it’s simple. People won’t link to your content unless:
- They’ve actually read it
- They trust it
- The actual content itself interests them (this is what most blogs talk about in terms of content marketing)
I know there are other components, but this is just a simplification to make a point.
Content design is responsible for the first and helps immensely with the second.
There are many components of great content design, but one area I won’t be covering is the overall design of your website. My goal is to leave you with a few actionable takeaways that you can apply to your content today, not to yell at you for having web design.
Font Type
Your body font’s main goal is to make sure your content gets read. If it looks like crap, or if it’s fancy, then people will be less likely to read your content, and as a result, they won’t share or link to it.
But at the same time, you don’t have to go with Georgia, Arial, or whatever else comes up when you Google “most readable font”. Readable is a huge priority, but uniqueness is another important goal.
For example, my blog uses the font Museo. I find it very readable (if you don’t, then I’m going to feel like an idiot…), but I also think that it’s distinctly different than most other body fonts you’ll find on the Web.
Notice that I said body font; you want your main font to be readable, but your headers to ideally be somewhat fancy. They still need to be read, but they should also be (dare I say it) pretty.
The reason for this is because beautiful, fancy header fonts can portray a sense of trust about you, your website, and overall, your brand.
But don’t have more than 3 total fonts on your site. Any more than that can confuse your readers as to what category of words they’re reading.
ACTIONABLE TIP: Sign up for an account on Typekit (a library of fonts), something that I use on all my sites, including this blog. There are 1000s to choose from and it’s super easy to add them to your site. All you have to do is:
- Choose your font
- Add it to your Kit Editor (one click)
- Copy & paste the CSS the Kit Editor provides you into your stylesheet
- Profit
OK, there’s no step 4, but I had to add that (even though there’s no ??? for #3)…
Font Size
I won’t spend too much time on this, just because it’s pretty straightforward, but avoid making your font small. Remember: your goal is to get your content read, not to strain your reader’s eyes.
Ideally, shoot for a body font size of 12-16. Header font sizes can vary, just because I’ve seen some seriously huge headers work as well as smaller ones, but bigger sizes usually look better as long as it doesn’t look weird in your theme (definitely use your own judgement here).
ACTIONABLE TIP: Use the Stylebot chrome extension to live test different font sizes. You can also use this tool to test margin size, font type, font color, and much more.
Graphics
Images in your content send off good or bad signals whether you like it or not. Here are a few things to consider when adding an image:
- The border – is the transition from page to image ugly or sexy?
- The background – Is the background color on an image white, or is it transparent so it fits right in with the page without a border?
- The quality – Does it have definition or is it pixelated?
- Originality – have they seen this diagram on 20 other posts on this topic?
A few other bad signals include watermarks, copyrights, and anything that shows that image isn’t actually yours (which is an issue in itself).
A few things I do to make my images more professional is that I always:
- Make the background of an image transparent (when appropriate) with a few clicks in Photoshop (I know it’s expensive, so this isn’t doable for most).
- Add a border if a transparent background isn’t appropriate or possible.
- Find unique images whenever possible. If I’m going to use someone else’s images (with their permission), my goal is to have it not seen anywhere else (which helps with originality).
- When I’m serious about that piece of content, I sketch what I want the graphic to look like and pay my designer to create it.
ACTIONABLE TIP: Easy things you can do right now are adding borders to your images, making sure they’re high quality (no pixelization), and finding unique ones.
Spacing
Few realize how important spacing your content out is. Big blocks of text is an immediate turn off for a reader, and can send them elsewhere on the Web before they even read the first sentence.
Utilize the concept of chunking by, you guessed it, chunking your content into readable sizes. Even if you’re talking about the same thing for 6-8 sentences, break it up into 2 paragraphs (or more).
You don’t have to go Derek Halpern style by making almost all paragraphs only a sentence, but overall, strategically splitting up your content into chunks is something you need to implement right now.
ACTIONABLE TIP: Scan your top content for crowded areas and big blocks of text. Try splitting it up a few different ways and deciding which one is best.
Creative HTML/CSS Tricks
You can stop there, but I usually like to go further by implementing a few unique HTML/CSS tricks on important content (it can be time consuming, which is why I said on important content).
For example, you can see here that I made the font different colors for the different variables I was describing above. Simple things like that can send a message to your readers that you take your content seriously.
ACTIONABLE TIP: Take note of simple HTML/CSS tweaks that you like on other sites. You should also try to step back and think about how this affected your view of that article/brand.
Conclusion
Content design is subtle, but it can make a huge difference in terms of links & shares. Don’t be like most and try to ignore it, thinking the actual content by itself is the only thing that matters. Make it your secret weapon.
What other content design topics did I miss? I’d love to hear your thoughts in the comments below. I love having discussions with you guys because you’re so intelligent, so please start it and allow me to continue it!
Also – make sure you follow me on Twitter @pointblankseo. I tweet link building & content gems on a daily basis.
This post was written by...
Jon Cooper – who has written 117 posts on Point Blank SEO.
Jon Cooper+ is an SEO consultant from Tarpon Springs, FL who specializes in link building. For more information on him and Point Blank SEO, visit the about page. Follow him on Twitter.
cutting edge link building tips.
I think this stage where your creatives and UI guys should come into play working with your content writers. “Packaging” it well is always an element of good marketing.
Right on, Jon!
Gary
Thanks Gary! Totally agree. Getting more minds involved with your content is always a great thing.
Great points!
Another point is that if the design itself is so good that it can get additional links from the design community rather than the content even.
-Kurt
Great point Kurt! Because most design blogs are worth their weight in links (yup, just coined that phrase), a few links from them can have a huge impact on your rankings.
Good post Jon. I like that you creatively seek out new fonts, don’t settle for boring, and think about design and UI instead of just focusing on the written word and the image/graphic. It’s an important ability to be able to (or have others helping) consider all these factors for a site.
Do you think you could write a future post on experminations with fonts and your newer design and how they’ve affected bounce rate and other site data?
I wish I could, but I don’t know how telling that data would be, seeing that when I changed fonts/design and what not, I changed a ton of other things, so I couldn’t really pinpoint it on 1 factor.
Jon:
While I agree with almost everything you’re saying here, trust and authority of the blog/site owner trumps everything – including design. Take Blumenthal’s Blog, for example. It looks like it was designed in 1997. He breaks every rule you’ve outlined here and yet he has one of the most popular blogs in the local SEO circles. Why? Because he has authority and people trust him. People who have obtained his status can pretty much get away with anything in terms of content design.
Still, though, he’s the exception and not the rule:)
Travis Van Slooten
Thanks for pointing that example out Travis! These will definitely pop up, but as you said, they’re the acception, not the rule.
Glad you stopped by and left a comment!
Would you mind looking at one of my sites and making suggestions for font changes? I understand this is a major part of content and I’ve tried a few things that all look terrible.
Ben – use this tool: http://www.pearsonified.com/typography/. It’ll definitely help!
Jon dude… love the post!
I’d like to add line height too. A cousin of spacing – line height or the distance between lines of the same paragraph is paramount as well to readability. You’ve got yours right. I tend to instinctively go with about 60-75% the height of the letters as the line height.
CSS here: http://www.w3schools.com/cssref/pr_dim_line-height.asp
Also, just mimic most well done newspapers or books. They often get line height perfect. Also, notice how
-Dan
+1 this! Definitely another one worth addressing.
Thanks for stopping by Dan
Obviously the design of a site plays a major role to it’s personnality and being unique in every possible ways tremedously helps for getting links. But a content marketer has to concentrate on its work, content marketing, not design. And a serious blogger should not dig to much in UI/UX, hire a freelance to create a unique experience for your readers.
Anyway, actionnable tips for content marketers are always appreciated. When using customs fonts, I would recommend FontSquirrel’s font-face generator instead of TypeKit or Google Fonts : http://www.fontsquirrel.com/fontface/generator – pick a free font that can be used on the web and use the font-generator. Really easy and keep the site really fast.
Tip : don’t forget to only keep the useful characters in the font-generator when possible.
Hi Baptiste!
Definitely agree, but for some, hiring freelancers isn’t an option and for others it would just make sense to make a few of these simple tweaks themselves.
Great tool, checking it out right now and it looks quite handy. Might be using this in the future!
Great post Jon. It really is the little things that make a difference. Thanks for the Typekit suggestion!
Glad to help Sam, thanks for stopping by!
Hi Jon
very valid points. There are some blogs out there in our industry that haven’t paid too much attention (if any at all) to design – a couple (well one in particular) hurts my eyes just trying to read it as the font is really bad and blurry.
Again thanks for the tips and suggestions.
Exactly Chris – imagine how many visitors that blog has lost just because they’re making it hard for them to read their stuff!
Thanks for the comment!
Hi Jon!
These are really great actionable tips! I thought I’d mention about Google Web Fonts (http://www.google.com/webfonts) as well being an alternative to TypeKit.
Another thing to consider when choosing the right font size is the width of your main content container. If it’s very wide e.g. 800px+ or full-width, smaller fonts might render unsightly (a long horizontal line of words scares me).
Turning download links into buttons if applicable would benefit the content’s presentation too as well as integrating basic jQuery/js into the piece, e.g. smooth scrolling, accordions and sliders, that would totally make a difference (and link-worthy – example: http://pointblankseo.com/link-building-strategies).
Getting users to your site is already a challenge, but keeping them engaged, lowering your bounce rate and ultimately converting them into followers is a bigger challenge.
Cheers!
p.s. I’ve always perceived black-font-on-grey background as the most readable of all layouts when it comes to content presentation particularly for lengthy content. I find white BG too glaring (and further dread those that use lightly shaded fonts on them). Love the grainy texture on this site.
For packaging bigger pieces of content such as white papers, case studies, comprehensive guides, etc do you have a recommended format ie. PDF versus HTML and which allows for better packaging (not worried about crawl-ability, etc.)?
Museo looks good mate,
Interesting and a very helpful post
Thanks Jon for the tips and great tutorials. It’s a pleasure to learn from you, it’s a pleasure to read your articles. already those are a great example of what great content means!