Develop blog into anticipatory reading machine

We use Google every day, many times a day and even a single search every hour. Facebook has more views, more engagement and more users. The reason of their ultimate user engagement is far greater than a normal Facebook or Google user knows. These web apps had turned to be an anticipatory tool for their users.
Again searched on Google and found the definition of Anticipatory:

Happening, performed, or felt in anticipation of something.

The Google and Facebook are two most popular websites visited today, top two ranked by Alexa and with most users in the world. A simple search bar is not enough for being at first, or ideas like Facebook wasn't new, many social networks were their before Facebook. Even I read on a Magazine that a university student made first Social Networking site with most basic features like news feed, chatting etc but failed at a stage.

Instead what's going on right now, lets discuss how to reach there.

KISS (Keep it simple stupid)

Anticipatory word has a deep meaning in sense of developing an art of code.

A user just clicks on a search bar of Google and many times he never types a word but suggestions helps him out. Every keyword embraces the user towards every search. Then with every keyword typed, user sees a bunch of results live which helps him understand what is going on here. This whole process tells us about rule of KISS.

To engage a user towards a blog, content is king but not the only reason to run a blog. Mashable is one the top news blog listed in my feed reader. If you read Mashable on web or mobile app you will find that you are more engaged with the content. The reason behind is that blog should be content oriented, when user is able to read the content more finely.

What matters is the color scheme, font family and font size that is being used. Keeping the color scheme eye friendly and simple helps the most. A good font family is that doesn't need a eye focus to understand and good font size is to have a proper ratio of font size with respect to the screen size.

The sidebar should be simple enough that doesn't overcomes the content. If the width of sidebar with respect to content is greater than 40% in a desktop screen, then there is a problem I guess because then probability of user getting distracted by sidebar are more. Often blogs have right sidebar but some have left sidebar too, to let user attract towards the content instead of sidebar, make the sidebar relatively small than content.

Parallax effects never attracts a user but a designer only. The bad relation of scrolling towards bottom while background moving upwards distracts too much. User become more engaged in watching the background instead the content in between. Simple background colors are best in these scenarios. While have a large portion of screen animating also distracts users (in some cases).

The idea of KISS is not new, designers are following them for years. However designs are still not following the rule,user never engaged with a mobile site due to lots of ads and less or no content to read above the fold. A good app is when user never have to scroll it on load.

A blog can follow KISS in many ways:

• Content is not enough, be content oriented.
• Sidebar with relatively less width than content.
• Simple, readable and visible combination of font and colors.
• Keep the content above fold.
• Ads makes the party over before 11, so use them on specific areas only.

Idea of great sidebar

My idea is of a great sidebar is not full of ads, but a great content to be recommended. Sidebar in sense of development comes under <aside> tag.

Don't use HTML to define how your content looks like, use it to define what is your content about.

The <aside> tag defines some content aside from the content it is placed in. Aside tag could contain ads, popular posts, email subscription, social integration etc. However, I think the side should be more productive than we think today. Every post displays sidebar, we should be able to give reader something other than the content.

Today Mashable shows recent posts to its sidebar. If user is done with reading article or completed the purpose on the page, then give him a reason to stay and read more. Often people are interested in recent publishes by the blog, show them what you got.

The user interaction with sidebar becomes more great if the user never sees the blank or end of sidebar. The sidebar content might end-up at some point due to more height of content than sidebar. 

See the Pen Responsive Sticky Sidebar by Darren (@jamesdarren) on CodePen.

The above demo illustrates how can we develop a productive sidebar with a few lines of codes. Other solution is to make the last element of sidebar sticky, that could be a subscription box or ad.

The greater the user will see advertistment, greater the chances the ad will be clicked. Similar action will be witnessed with any widget you stick on scroll.

Relevancy matters

Your blog content should be relevant to your blog's niche. Every blog post may be unique than previous one but user might want to read more content relevant like this. Often relevant posts are shown below post with titles like "You might also like" or "Related posts". These titles are not enough, the links should be relevant too.

When I redesigned my blog last time, I aimed to be more relevant so what I actually did was showing post of each label by post. I created an array of all labels and using a while loop I loaded posts of each label. I had label for relevancy which is most common way of sorting the post according to a niche.

Display of labels and categories is not enough, we need to move forward. Neither related post is enough, today we can earn more with native ads which shows relevant around web, normally displayed as 'Related articles around web'. 

We need to be relevant with searches reader makes. Blogger (CMS) JSON or XML feeds allows you to search through the feeds, the result is sorted by relevancy by default. Relevancy is calculated how much times a word is repeated across an article. However we can sort articles by date. Read more about Blogger feeds here.

Speed up

Reading is a learning process, make it seamless. The Next Web has tackled with speed solution correctly, what they've done is: once a user is on article page, then clicking on recent articles' link will not reload the page, but will load the content asynchronously and display it. 

Every time the page reloads, it request HTML and all the resources from server which is a time taking process. But what if we request only the data need to be replaced on a page. Angular and jQuery's AJAX methods are amazing and easy to use. Read the last article I published about Javascript promises, it is about async process undergoes on a web page.

I shared about live searching trend about year back. You can read the article for more, but the point again is the speed. The live searching process make the searching more fast and seemless. No more reloading takes place in searching simple query. Further you can integrate Google's custom search into your blog which works much better than ordinary search bars.

The above image is the screenshot from this blog, I don't know if the design is changed by time but this is the current design.

One more way to reduce the time is not to load the unnecessary images, or if there are too many images on page, then load them asynchronously. You should know that setting the image to visibility hidden or display to none will not stop the loading of image, browser will still load it. This is kind of back end but loading from server can be done front end.

Be discussion oriented

People like interactions, sharing and discussions. Discussion meant comments, forums and even contacting via emails. The author could share facts as well as opinions, perhaps reader want to know more about the topic then comments are most favourable way to put the reader into. 

Rich commenting systems comes to the rescue first. These systems helps user to stay connected to discussions, every comment notification reaches user and perhaps reply may hit the article. A good author is the one who replies to constructive emails and build a healthy discussion.

Comments are not only options, emails are good one too. Emails allow a private room for the two people. If reader have something that is important and couldn't possible then emails are there to rescue. Further emails allow you to add media and attach files which is a plus point of contacting via email.

The most active and popular way of generating a discussion is social media, this is where most people stay online. A public discussion could be generated on a Facebook page but people often under estimate Twitter which is quite negative sign. Twitter is better discussion oriented tool, just download Twitter app or Twitter deck and stay connected to a large audience.

What's more?

These factors according to me helps the most to turn a blog into a anticipatory reading machine. A reader becomes loyal when finds relevant content and content of interest. Your content will be useful when the design and development of blog (with respect to coding) is done correctly and in a way that it engages user more and more.