How to design a good looking user friendly Blog?

3 Comments

Many bloggers rush through selecting their blog design elements without much thought when they first start. But the reality is design is core to your blog's brand and readership. Blog design does not require artistic training or high level skill. It requires strategic thought, target your blog's goals and target audience before start blogging.

My simple tips is, review the blog's you read frequently to become familiar with your options. Consider which blogs you like and which elements of those blogs attract your attention. Make a list of those elements you want and those that you don't want.

Here is some of my Blog design tips that you don't have to be a skilled designer to follow.

Blog layout

This includes factors like columns, sidebar, header and footer. Use simple and common layout for your Blog this will help peoples to navigate easily.

Color scheme

Which colors do you want to use on your blog? How do they render on different types of devices? Are these colors associated with your brand? Are they consistent with your offline collateral and your retail establishments? Ask your self and find out.

Font

They are the written voice of your web site and should be consistent with your brand image and comfortable for your target audience to read. Text that is difficult to read can harm your traffic building efforts.

Font size

Remember you want your readers to be able to see your text. Therefore, if people over 40 are an important segment of your target audience, use a big, easy-to-read font or provide an option to select a larger size.

Font color

It is critical to keep font color easy-on-the-eyes. Too many colors confuse and some combinations will just turn visitors off and drive them away.

Backgrounds

What colors or images do you want to use as a background on your blog? This is the stage dressing for your site. Warm colors project a human focus while cool colors are associated with technology. But you might don't want the background to attract so much attention that it distracts from your content.

Lists and block quotes

Numbered and bulleted lists are important tools for organizing and presenting content. Block quotes identify other sources of information. Style them and spice up your contents.

RSS and Email Options

Do you offer readers these choices? If so, will they receive the full text of your blog or do they need to click through and come to your site? You should add this features in your Blog.

Social sharing features

How do you want to present social media in your blog? Do you want to encourage readers to share your content? Then you should add this features in your Blog.

Mobile presentation

With increased mobile usage, does your blog render in a readable fashion on a mobile device? If not, it is a good idea to add this, especially with the increasing usage trends.

I will continue writing about Blog design so, stay tuned. I may have missed some more Important things on Blog design. Lets discuss them in comment section. Smile :).

Continue Reading »

Are you Optimizing your Blog/Website for Mobile users?

1 Comments

Google recently told on a blog post that, the rankings of search results on mobile devices will be affected by the optimization of websites for such devices. In other words, the more your content and website design is optimized for mobile devices, the higher your site will rank for mobile users.

It makes sense, after all it would be bad for Google to serve a search result that would be poorly visualized on the device of the user, isn't it?

A quote from the article:
Smartphone users are a significant and fast growing segment of Internet users, and at Google we want them to experience the full richness of the web. As part of our efforts to improve the mobile web, we published our recommendations and the most common configuration mistakes.

Avoiding these mistakes helps your smartphone users engage with your site fully and helps searchers find what they are looking for faster. To improve the search experience for smartphone users and address their pain points, we plan to roll out several ranking changes in the near future that address sites that are misconfigured for smartphone users.

Google also has a page on developers section where it highlights the most common mistakes when optimizing Blog/Website for mobile devices. They are:

  -Unplayable videos
  -Faulty redirects
  -Smartphone-only 404s
  -App download interstitials
  -Irrelevant cross-linking
  -Page speed

If you are not testing your Blog/Website on mobile devices, now it is a good time to get started.

Continue Reading »

How you can make your Blog successful?

6 Comments

Starting a Blog become easy and common now, every one making a Blog with ease and writing on it. Building a Blog is not a problem but, making a 'Successful Blog' might become a problem. Today I have some tips for you to make your Blog successful. You might already know some of them, then you should apply them properly in your blog.

Content

If you offer well written, original, easy to understand information, spiced up with good imagery then the chances of getting quality links, social media exposure and high spots in SERPs are bigger. Content is the King! you know.

Basic SEO

You don't have to be a SEO expert to rank your site high on Google search. Just several things to remember here:

 - Include meta title tags

 - Optimal and natural usage of keywords

 - Provide good article titles

 - Proper usage of Heading tags

 - Include sitemap

 - Use Google Webmaster Tools and Google Analytics to gain insight on what works for you and what's not

 - Always avoid duplicate contents

 * Read the Google SEO Starter Guide

Design

You want more and more visitors on your website, and you want them to stick with it more often. Except offering quality content you'll need some good looking unique design for your Blog. If you're serious about your Blog, Pay someone to design your Blog for you. It doesn't need to be very expensive, a simple, pretty enough, and unique look would be good for you.

Competitors

What ever you do, you have to be more innovative, original, have a better design, better content than your competitors. Simply try to beat the competition. Use them to learn what works for them, and what doesn’t.

Promotion

Promote your site whenever you have a chance to do it, but do not exaggerate (don't be a spammer). Also several things to remember here:

 - Use Facebook, Twitter, Google+, or any other social platform popular at the moment

 - Comment on other blogs related to your niche

 - Guest post frequently on well established blogs

 - Pay for ads if you really have to

This will certainly lead to significant exposure of your site.

Speed

Make your site load fast as much as possible. This is important from two aspects: user experience and a SEO factor. Several things to remember:

 - Use good server

 - Optimize your codes

 - Optimize the images

 - Use Image sprites

 - Use tools such as Google Speed, YSlow, Web Page Test, Pingdom

 - Avoid redirects

Read in details what Google and Yahoo have to say about it.

Subscribers

Capture e-mail addresses and get people to subscribe to your Blog feed early. Two-three years from now (if you're good) you might have 50k email list and 50k RSS Subcribers. And that will become a big valuable asset. Trust me.

Monetization

It is time to gather the fruits of your labor. I'll suggest don't do it early. Wait some time until your blog get on the track. There are basically three main methods to get money out of your Blog:

 - Placing ADS (CPC, CPM, CPA, CPV). Basically you need click, page view, action or video view in order to get paid.

 - Promoting affiliate products.

 - Selling you own products (ebooks, membership websites, services - design, coding, coaching, etc).

From the Editor

The most important tip would be that you do your experiments with everything I said above and come to your own conclusions about what works for you. Smile :)

Continue Reading »

Pure CSS Lavalamp Menu for Blogger

3 Comments

I think that you have already seen animated menus with the LavaLamp effect based on the jQuery plugin. Today I would like to tell and show you how to repeat same behavior, only with CSS3 without any JavaScript. I will use CSS3 transitions in our menu to animate elements.

Features

 - Simple but Stylish
 - Faster loading
 - Less usage of coding
 - Auto adjust with almost every blogger templates
 - Tested and runs with every latest Browsers
 - And more...............

 So, if you are ready, let's start.

DEMO

Add This Menu To Blogger

To add this Menu to your blogger blog follow below steps:
1. Go to Blogger Dashboard > Layout > Add a HTML/Javascript widget
2. Change the links and titles as your need and paste the below codes, Save and Drag the widget right below the header.

<style type="text/css">
.nav {
margin:auto;
overflow:hidden;
position:relative;
text-align:center;
width:500px
}
.nav a {
-moz-transition:.7s;
-ms-transition:.7s;
-o-transition:.7s;
-webkit-transition:.7s;
color:#393939;
display:block;
float:left;
font:25px Impact;
padding:1em 0 2em;
position:relative;
text-decoration:none;
transition:.7s;
width:25%
}
.nav a:hover {
color:#c6342e
}
.effect {
-moz-transition:.7s ease-in-out;
-ms-transition:.7s ease-in-out;
-o-transition:.7s ease-in-out;
-webkit-transition:.7s ease-in-out;
left:-12.5%;
position:absolute;
transition:.7s ease-in-out
}
.nav a:nth-child(1):hover ~ .effect {
left:12.5%
}
.nav a:nth-child(2):hover ~ .effect {
left:37.5%
}
.nav a:nth-child(3):hover ~ .effect {
left:62.5%
}
.nav a:nth-child(4):hover ~ .effect {
left:87.5%
}
.aslava-dot-nav:after {
background:#c6342e;
bottom:40px;
content:"";
display:block;
height:1px;
position:absolute;
width:100%
}
.aslava-dot-nav a:after {
background:#c6342e;
border-radius:100%;
bottom:38px;
content:"";
height:4px;
left:50%;
margin-left:-2px;
position:absolute;
width:4px
}
.aslava-dot-nav .effect {
background:#c6342e;
border-radius:100%;
bottom:36px;
height:10px;
margin-left:-5px;
width:10px
}
</style>

<div class="aslava-dot-nav nav">
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Gallery</a>
<a href="#">Contact</a>
<div class="effect"></div>
</div>

Compressed Edition

Here is the compressed edition of this Lavalamp menu for more faster loading perform-

<style type="text/css">
.nav{margin:auto;overflow:hidden;position:relative;text-align:center;width:500px}.nav a{-moz-transition:.7s;-ms-transition:.7s;-o-transition:.7s;-webkit-transition:.7s;color:#393939;display:block;float:left;font:25px Impact;padding:1em 0 2em;position:relative;text-decoration:none;transition:.7s;width:25%}.nav a:hover{color:#c6342e}.effect{-moz-transition:.7s ease-in-out;-ms-transition:.7s ease-in-out;-o-transition:.7s ease-in-out;-webkit-transition:.7s ease-in-out;left:-12.5%;position:absolute;transition:.7s ease-in-out}.nav a:nth-child(1):hover ~ .effect{left:12.5%}.nav a:nth-child(2):hover ~ .effect{left:37.5%}.nav a:nth-child(3):hover ~ .effect{left:62.5%}.nav a:nth-child(4):hover ~ .effect{left:87.5%}.aslava-dot-nav:after{background:#c6342e;bottom:40px;content:"";display:block;height:1px;position:absolute;width:100%}.aslava-dot-nav a:after{background:#c6342e;border-radius:100%;bottom:38px;content:"";height:4px;left:50%;margin-left:-2px;position:absolute;width:4px}.aslava-dot-nav .effect{background:#c6342e;border-radius:100%;bottom:36px;height:10px;margin-left:-5px;width:10px}
</style>
<div class="aslava-dot-nav nav">
<a href="#">Home</a>
<a href="#">About</a>
<a href="#">Gallery</a>
<a href="#">Contact</a>
<div class="effect"></div>
</div>

In this menu you can not add more than four links, but if you are advanced in CSS coding them you can modify this menu for adding as much link as you want.

Hope you enjoyed with our new CSS Lavalamp menu. Don't forget to offer thanks and leave a comment.  Smile :)

Continue Reading »

Smart Blogging for Your Online Success!

4 Comments

The typography of your blog can be particularly important if you are running a blog that appeals to a specific audience. If that audience typically has difficulty reading text on a screen, which is probably more common than you think, you can utilize the typography settings to make life easier on them and to get better readership for your content.

Increasing Font Size

There are some blogs out there that make a stylistic decision to go with a very small font size. It's important to remember that, when you make this choice, you are limiting your readership. A certain number of people are going to have so much difficulty reading a blog post that is in a small font size that they're just going to skip over your blog altogether and go somewhere else.

If you know someone who does have a difficult time reading off of a screen, go ahead and have them take a look at your blog and see if it's difficult for them to take in the content. Be particularly wary of problems that arise from words that have strings of the same or similar letters.

Color

Color is more than an aesthetic decision where blogs are concerned. Professional WordPress themes generally allow you to change the color of your background and of your text very easily. Pick colors that are easy to read. For example, it might seem like black on white is very easy to read, but dulling the background color to make it a bit more gray is a bit easier on people's eyes. This may make it easier for them to hang around for a while and read more of your content. Be wary of color combinations that are unfriendly to people with colorblindness. Blue on yellow or red on green would be examples.

Ask Your Readers

If you decide to try something different with your typography, be sure to ask your readers about it. Not only is it a good way to figure out whether or not you made a good decision, it's a great excuse to encourage some interaction on your blog. Be responsive to your visitor's opinions, but also stick to your instincts if you feel like you've made a good decision. Remember, there's always somebody on the Internet who has a complaint, so take the majority opinion into consideration more than the very vehement opinion of one particularly motivated individual.

About author
Anny Solway is a creative writer at ThemeFuse.com – a top provider of Premium WordPress Themes. She is passionate about studying online marketing industry and sharing informative tips.

Continue Reading »