Information Design: Beginners Blog Design
Today, blogs are one of the most effective and used online communication tools.
Blogs help large and small companies communicate directly and transparently with their customers in a way that is direct as well as offering an exhaustion and confrontation pipe for topics ranging from politics to technology.
Blogs can be tools of personal reflection, journey logs, or tools for the publication of new online magazines and grassroots publications, providing very low maintenance costs and maximum ease of use.
But for a blog to be effective, its design and “look and feel” must not reflect the personal aesthetic preferences of the author but should rather provide a very rational and well-thought-out solution that characterizes the site while making it very accessible and easy to read and navigate.
To design a blog means to sit down and plan the blog's “look and feel”, that is the most superficial and immediately visible of this new tool of digital communication.
But how do you go about it?
Nonetheless, we have all gotten accustomed to thinking that design is a creative and irrational process; the best way to design a killer blog is really very little connected with finding new creative ideas while being deeply intertwined with the content organization's rationale and from the ease of access to the same.
How rapidly can I see what this site is about, and what are the best things I can find inside of it?
Information Design
Unknown to most, but decisive for anyone who wants to make her visual communication approach effective, basic Information Design principles can be used to plan the layout of any serious professional blog without risk of losing time.
Information Design suggests looking at the design of information in terms of efficiency and accessibility (readability - comprehension).
To make information highly legible, accessible, navigable, and easily understood is the goal of the Information Designer who radically breaks away from the traditional graphic design approach of making things look “nice”.
Blog Design Elements
Overall Page Layout
The most important thing to do on this front is the one of making visual organization of your blog page in a way that can best facilitate the reader into finding the following essential content components:
· Your blog’s name
· Your blog topic
· The blog author’s name - and info about her
· Content themes and topics covered by the blog
· How to contact the blog newsroom (email, Skype, phone, fax, etc.)
· Where you are located on planet earth
· Most recent, most popular content
· Search box facility
· Subscription box to get your news automatically via email or RSS
It is important that these components do not fight with each other for visual supremacy on your blog page, but that they are arranged in a way that makes them behave as educated, discrete, and easy-to-find blog components.
Color - Background
On this front, it is always a good idea to start in a humble, moderate fashion, by focusing your best efforts on making your blog pages appear simple, well-organized, clean, and easy to navigate.
Backgrounds that utilize photographic images, visual decorations, or other graphic elements must be firmly avoided.
Using appropriate color-matching combinations, you may also find some strikingly impactful color solutions, but be aware that most popular blogs are almost always written with black text on a white background.
Remember: the cleaner and the more legible, the better.
Line Length
Probably unnoticed and not even marginally considered by most traditional site designers, here is one of the most critical variables to determine the effective legibility of content on a page: line length.
Once you go beyond ten or twelve words per line, reading your content becomes increasingly difficult for the reader. The longer the line length is, the harder it is for the reader’s eye to go to the next line once she reaches the end of a line of text.
Shortline length looks good, easy, and unintimidating, and makes reading on-screen as good or better than reading on paper.
Fonts — Typefaces
The choice of which typefaces or fonts to use in the design blog should again be driven by usability and accessibility factors.
It is, in fact, more important that all your readers can correctly see your blog pages, just as they were designed, rather than using special fonts or typefaces that a significant part of your web readers will not be able to see as you had planned (mostly because their computer does not have the same fonts, browser or operating system you yourself have).
To overcome such issues, it is a good idea to start designing your blog while using rather standard and highly popular and compatible typefaces such as Arial, Verdana, or Times which are widely supported by almost all devices connected to the Web.
Alignment
The key to making blog pages look clean, elegant, and well organized is most often novice designers' greatest nightmare. Page layout is a difficult art, and unless you have been trained at it, your best efforts will always fall short of anything barely acceptable.
To avoid this, one simple approach to blog page design is one of distributing weights evenly across the page while making sure that each and every page component is properly aligned with one or more elements of the page.
The more elements on your blog page are aligned across common invisible margins, the more clean and well-organized your blog page will look.
Chunking
Chunking is an approach to the formatting of the text that strives to “modularize” contents into the greatest number of meaningful text blocks possible. Similarly to what is done in poetry, each concept and idea is given greater space to be read and understood.
There is no packing of paragraphs into long blocks of text that know no pause. There is no saving in having less digital screen space used.
Both traditional blogging and the new burst-messaging tools like Twitter reflect this efficiency expressed by short bursts of information delivered just in time and with the maximum ease of access.
And so differently from traditional books and magazines that often publish multi-paragraph contents in one unbroken text block, your intent will be the one of separating in clearly separate elements all those ideas and concepts that provide a valuable information unit.
The “rationale” behind this approach is research that shows that online readers have a very reduced attention span and that they do not read pages like traditional newspaper articles or books, but they rather prefer to scan rapidly the left margin of the content provided, looking for interesting content hooks which may or may not confirm the relevance of the article to their specific interests.
A must-abide rule to use when wanting to chunk content effectively is the one of never going to the next line after a period. Either you proceed on the same line with the following sentence, or you leave an empty line and start a new paragraph below.
Bolding and Linking
In order to facilitate readers scanning page contents, it is a great idea to use some “bolding” to highlight the first three or four words of content paragraphs that are particularly important.
In contrast with traditional editorial and formatting approaches where bolding is used in the middle of sentences to emphasize relevant content elements, my personal suggestion is to use bold to again highlight the opening words of critical paragraphs.
It should be rather obvious that this approach needs to be used with moderation and editorial intelligence, as applying it to each and every paragraph would make it absolutely useless.
In place of the above approach to bolding, it is sometimes possible to use links, which are also very effective in highlighting a short set of keywords at the beginning of relevant paragraphs while providing extended info, reference, and support for what is written.
One thing that should never be done is to use the “underlining” style for any web content since this formatting style has become a standard in communicating to the user that the words underlined are in fact a link. Therefore, the use of underlining for purely formatting purposes is a mortal sin that should be avoided like a disease.
Titles and Titling
Titles are, without a shadow of a doubt, one of the most powerful tools an online publisher has to influence traffic, visibility, relevance, and conversions.
Unfortunately, very few online publishers have yet arrived at the full understanding that the web is like an infinite library of information, which, unless it is very properly labeled, it will be read only by your close circle of friends.
To learn the science of titling determines the difference that exists between blogs used as personal diaries from those used for professional communication.
To learn the foundations of how to write effective titles for the web, every time you need to write a title for a blog post I strongly suggest you follow this rather simple test. Use the first three or four words (not more) of your title to do a search on Google.
If the Google search results you obtain are in line with the topic you are covering in your blog post, you did a good job. If, on the other hand, the search results that show up have nothing to do with the topic you are writing about, go back to square one and try again.
Spacing
Content spacing is another important factor in increasing the legibility and accessibility of your blog content while helping it look more professional. What is important to do in this respect is to keep the different sections of an article clearly separated one from the other.
In other words, this means that subtitles and section headers always need to be placed in asymmetrical mode, leaving significantly more space above any section title so that these are visually matched to the contents that follow them instead of floating ambiguously in between two separate sections.
Text Justification
Since most blog publishing tools and services do not provide a reliable facility to hyphenate text on blog pages, it is highly recommended to set a “ragged” justification in order to avoid unnatural and ugly-looking spaces between words in your posts.
In other words, your text should not be “justified” on both the left and right margin, as some books and publications do, but should leave the right side of the text to be a bit longer or shorter on each line.
Recommendations
The beauty and elegance of your blog will be determined much more by rational and pragmatical “legibility” choices, like many of the ones I have listed here above, than by your esoteric search for “creative beauty”.
It is only through a very high attention to detail and to the sensitivity of the user that the beauty of your blog will emerge spontaneously.
I know there would be so much more to say, for example, relative to the use of images or to the size of fonts, but for now, it will suffice to say that the above are only the foundation components over which to take immediate control on the path to effectively designing a blog.
If your goal is to leverage the ease of use and publishing power of blogs to create a professional communication tool on the web that gives credibility, visibility, and maybe further revenues, start working on these foundation principles until you are in full control of them.
Be smart, be independent, be good.
Further Info
· Jakob Nielsen
https://web.archive.org/web/20080415040645/http://www.useit.com/
· Edward Tufte
http://www.edwardtufte.com/tufte/
· Clement Mok
http://clementmok.com/
· Karen Schriver
https://web.archive.org/web/20080307112312/http://informationdesign.org/special/schriver_interview.php
· Diventa Boss Di Te Stesso
http://www.slideshare.net/RobinGood/be-your-own-boss/
Originally written in Italian by Robin Good for 7th Floor magazine - revised and extended edition here published by Master New Media on April 27th 2007 as: “Information Design: Beginner Blog Design”
Robin Good
