Throughout 2013, we have heard about the growth of visual, design-led content. Whilst we still appreciate the importance of humble text-based content, it’s important not to fall behind on the significance of making content captivating by including visually appealing elements.
Whether this is simply an image or two, or the whole content itself is carefully designed with fancy fonts and icons, it’s vital to consider the layout of your content, and this is where editorial design comes in.
Whilst at University studying for my Journalism degree, I learned my fair share about newspaper and magazine design. I also noticed over the years that online journalism was beginning to replicate print materials by placing more of an emphasis on not just the words, but how they were formatted and how to make the content more appealing to the eyes of its readers.
Mistakes are still being made though. Huge streams of text with no imagery or formatting of any kind are still being posted to brands’ blogs, with the hope that it will work some sort of mysterious SEO magic.
The audience doesn’t seem to matter – but if you have any hope of continuing to drive traffic and more importantly engage with your customers, then their wants and needs should be imperative.
Simply put, they want you to make it as easy as possible to read and digest what you have put in front of them.
There’s little more frustrating when reading a blog post than having to squint with one eye and close the other in order to make the font legible. Perhaps that’s an over exaggeration, but you see my point –
Don’t fall at the first hurdle – stick to easy to read fonts like Arial or Tahoma. Be sure to include a suitable amount of headings, as well as bold, italic or underlining text where needed.
Another principle that I became more aware of whilst studying was the Inverted Triangle, a popular metaphor used by writers to show the priority of structuring text. Ever the radical, I decided to make my own for image placement in your blog posts:
Super-Interesting Introduction – A good image above, or beside your introduction says “Hey, look over here! This is super-interesting”. You can also get a bit creative and add text to the image in order to display some key information about your content. Total Film do this with their film reviews:
The Nitty-Gritty / Principle Points – The main body of your text will always be the chunkiest, so it needs to be broken up with visual content such as images, Infographics or videos. It’s often forgotten that a good image (or even graph if appropriate) adds a lot of strength to what you are saying.
The Summary and CTA (Call To Action) – It’s best to keep the summary clear of images, and to keep the text short. You can use Call To Action buttons, a la Koozai with the boxes we use for our free Whitepaper downloads:
Occasionally ignored, the alignment of your images is really important to make your blog post look good to the audience. If you centre your first image within the body of your text, then centre all of them. If aligning to the left or right, it is possible to alternate, but it’s really a case of how it looks when you publish the post. By mixing left and right alignment, it can create a confusing and messy look to your readers.
No matter which CMS you use, always preview the post before setting it live – if it looks disorganised due to the alignment of images against text, then fix it.
If you want to create even more dynamic visual elements to your posts, here are a few free tools to help you do so:
Want to create interactive images? This tool is great fun. Just sign up and upload (or import) images and you can pinpoint areas of the image to create links and descriptions.
2013 Talking Points is a great example of what you can do. Once you have created and saved your Thinglink, you can then use the supplied embed code to add it to your blog post.
One of my strongest memories of University was the Powerpoint presentations that made up my lectures. However, Powerpoint is a pretty nifty tool for adding text to images. The image below was created by adding the photo to a slide, and simply adding a filled text box with increased transparency.
That’s just a quick solution and with additional tools like SnagIt and Photoshop this could be taken even further. Powerpoint is also great for creating Slideshare Presentations which are great for summarising a longer blog post, or for showcasing key statistics within a post.
Infographics have made data sexy, and are a fantastic way of visualising technical information. Infogr.am is a free resource that lets you create interactive Infographics using premade templates. Although you are a little limited design wise (as opposed to hiring a designer to make it), you can still benefit from quite a few customisable options.
Maybe you’ve heard of it, maybe you haven’t, but HTML 5 is here to make the web experience cleaner and easier to view across devices. It has fast become the standard for websites, and vastly improves usability.
So what does this mean for your blog? Well, sites like Medium prove that your blog posts can look sexy with the right HTML 5 design. The white space is optimal for smaller devices to make the text clear and easy to read on mobile, and the large space at the top of the content optimises your opportunity to use beautiful imagery.
Whichever approach you take to making your blog articles more visually appealing, it is clear that content creators now need to cast a designer’s eye over their content before clicking Publish.
Do you have any tips or tools to add which help improve the look of blog posts? Let me know in the comments.