Years ago, internet users were primarily technical or geeky people. But today, all kinds of people are seen on the internet: young and old, techie and non techie. Also, people’s attention times have reduced drastically and the more time you spend on internet, the more you know where to find what you are looking for. In my observation, anyone who is active online for about an year becomes oblivious to advertisements and ‘tricky’ url’s.
Web 2.0 is not a fancy term! If you look at web-design trends, you’ll notice that there has been a real shift in the way websites are designed today compared to how they were five years back. The exact definition of Web 2.0 is still being debated, but to me, it means only one thing: “simplicity”.

In this post, I will outline some of the most important design strategies for making your blog web 2.0 compatible, and in turn user-friendly. Make sure to read the disclaimer at the end!

1.0. Layout

Guiding principle: KISS.
Keep It Simple, Stupid! Blogs must designed to look clean, functional and free of non-essential elements.

1.1. Cut the flab:

Few years ago, when blogging was new, there was this over-zealous trend to ‘show everything you have on the front page’ (I did that too back in 2004!). It has changed; everybody now knows what blogs are, they know the elements: Blog posts, Archives, About, Contact, Pictures, Pages, Features, Links etc. If someone needs to look at old blog entries or contact you, they know there will be a facility to do that. Provide these facilities in a separate page because showing everything on the front page will only create a mess. Your ‘blog friends list’ is too long? make a separate page. Plenty of ‘awards’? dedicate a gallery. Like to share photos from your recent trip? Make a section for photos! usw.

1.2. Choosing a skeleton:

Blog templates are gravitating towards a one or two column layout. Why? Here is what I think. In the previous days of 640×480 or 800×600 resolution monitors, you could see content on a site without moving your eyes much. However now, with the wide screen resolutions, if you try to read a horizontal line from left edge to the right, you could be turning your neck around as if watching a tennis match. Anything beyond 2 columns could potentially confuse your visitor, and even a microsecond is a lot. If you want to use a third column, try to dedicate it to something exclusive – such as a picture gallery.

1.3. Positioning:

You could have a website flushed to the left, right or aligned centrally. Few years ago, websites were mostly left aligned since centering was not as easily accomplished as it is today. With XHTML and CSS 2, absolute and relative positioning is easy to do. Center aligned blogs also give me a sense of balance and add to the ease of navigation. Also, since you have gotten rid of unwanted elements, there is more space. So why not leave a liberal margin on the sides.

1.4. Content placement:

Almost all people start reading from the top left and move towards the bottom right. Left to right is the most prevalent system in the world and newspapers, magazines etc. are designed with that in mind. Personally, if I don’t find anything content-y in the top-left 20% of the screen area, I almost surf away. This excludes the header and sidebar, since our eyes are trained to assume them after looking at hundreds of blogs. In my mind, when I look at a blog, I go: “Header, check!” “Sidebar, check!” … if “Content” is not the second or third thing in sight, I am discouraged from paying further attention. Seriously, who would want to hide their content?

Further Reading: Current Web style

2.0. Color, graphics and typography

Guiding principle: Stronger, simpler, bigger, honest.

Mozilla.com,
WordPress.org,
The Apple Blog,
Brave New Traveler

2.1. Typography:

Bigger is better! Let me revisit the blurb above on screen resolutions. With bigger screen areas, users see many things when they open a blog. Ergonomics states that I must be able to view the content comfortably from my chair without having to arch my neck and narrow my eyes. The solution? Keep with times, use bigger text and clearer fonts. Serif fonts (e.g. Times New Roman) or Monospace (e.g. Courier) are not the easiest to read, so switch to sans-Serif (e.g. Arial, Verdana, etc). Use of an exotic font is pointless because it won’t be displayed on other people’s computers and the browser will simply default to its settings.

2.2. Use of graphics:

Jarring graphics and aimless animations must go regardless how cute they are. Web 2.0 is all about functionality, so use simple but functional graphics and garbage the rest. Vivid graphics are used to bring attention to a particular matter. There is also a huge leap towards standardization of icons, for example we all mostly know the following icons:

2.3. Color scheme:

For a long time, color scheme was under rated. I remember back in 2003 I had designed my website with a color scheme called Agni (Fire) which is not very different form what you see today. I entered into a web design contest but I was disqualified since they thought that the colors were ‘too bright and funky’. Thankfully the internet has some sense of fashion now. Bolder colors are increasingly used now: blues, oranges and greens are everywhere you go. In addition, the color scheme can being used as a tool to separate various parts of your blog. People often have a distinct header and a distinct sidebar – either marked by a graphic or a colored separator. I like this kind of ‘fencing’ since my eyes can jump to the relevant portion quickly. Don’t be shy of using strong colors, gradients, lines and boxes to separate content in Web 2.0.

2.4. White space:

Since you have a bigger screen and you got rid of unnecessary elements from your page, this is an excellent opportunity to use liberal amounts of whitespace. Note that white-space is not necessarily white. It takes the color of the background (often white or a light color). The more the white space, the easier it is for your eyes to move.

The same goes for line spacing – have your lines sufficiently spaced. For example, reading something that is as tightly spaced as this paragraph will strain your eyes, or you might lose the line altogether. It is also hard to highlight or bring certain text to attention. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in dolor sed nulla faucibus semper. Ut rhoncus libero in lectus accumsan ultricies. Suspendisse vehicula tempor sollicitudin. Curabitur a nisi lectus, eget consequat justo. Aliquam in sapien eu diam gravida rhoncus. Aliquam libero nibh, dapibus ut suscipit et, scelerisque in leo. Maecenas ut erat sapien, quis scelerisque erat. Sed tempor molestie turpis et ullamcorper. Duis euismod ipsum semper elit mattis egestas. Suspendisse quis dui feugiat elit vulputate laoreet id sit amet massa. Donec eu eros lectus. Sed cursus risus et purus pretium non viverra tellus iaculis. Morbi ac ligula ut magna facilisis mollis et ut mauris.

2.5. CSS is the new God

Unbelievable things can be achieved using CSS. It can be used to create rich layer effects, text effects, boxes and separators and can manage a host of other things like your links and navigation. Most implementations use CSS but find a way to go beyond the normal, superimpose a translucent layer over a picture maybe?

Further Reading: CSS Zen Garden, Visual design, 9 Essential principles,

3.0. Navigation

Guiding principle: Simple and accessible

3.1. Navigation menu

…is either placed on top of the blog just below the header or on top of the sidebar if you want it there. In any case, the navigation menu must be clearly visible and among the first things you notice. Think from a users perspective – do you want to list everything under the sun in your navigation menu? Probably not. Most of us are happy with links to basic pages like ‘contact’, ‘about’, or so. Drop-down’s are great, but I always wonder if a blog really needs detailed navigation menus like that. If you have a copyright policy or an awards page, think whether it’s worth including it on the most prominent piece of real estate on your blog. You can always have sub menus for such stuff – that’s what the sidebar or footer is for. List your categories, awards, links etc there and spare the visitor of a complicated navigation menu.

Navigation menu must be complimented by an appropriate title for the destination page. If you click on ‘Contact Me’ in the navigation menu, the destination page better say ‘Contact Me’ right on top. Web 2.0 is about honesty and simplicity together. Leave the tricky menus, cloaked url’s and dishonest stuff for websites selling phentermine, cialis or free porn.

3.2. Navigation Links

Another aspect of honesty is to ensure that the user has clear and full information before s/he clicks a link. Inserting advertisements in your text will only fool your visitors once. Similarly, stay away from masking the link url with some text in the browser’s status bar. Such tricks will discourage repeat visitors, and will also reduce the credibility of links to other websites that you cite in your blog post. Its a good idea (but lot of work) to use the ‘title’ element for your links so that the user can mouseover and get information about the link. I use a distinct icon to indicate links to external websites. It looks like this:

Blogs have huge amounts of information catalogued in them and unless there is a good way to access older information, nobody will see it. Therefore, rich and relevant internal links are encouraged in blog posts. Trackbacks will ensure that even the older and relevant content is still connected to current posts. Use of ‘Previous-Next’, ‘Older post-Newer post’, ‘On this blog a month ago’, ‘Recent posts’ and such features increase the interconnectedness and accessibility of your posts.

4.0. Content delivery

Guiding principle: No discrimination
The days of Internet Explorer for windows as THE browser are long gone. There are a number of operating systems and plethora of browsers available for people to choose from. Even my mother prefers Firefox.

4.1. Compatibility in multiple environments

Anybody can design a website these days really, but what keeps the web-designer’s job is his/her knowledge of cross-browser compatibility. Do not assume what you see on your screen will be the same as what others see because most likely that won’t happen. Although your design may be perfect, remember that the browsers are not. Each browser uses an ‘engine’ to render web pages and their interpretation of your CSS definitions is never the same.

Do you blog about technology or does your blog attract lot of people who are top level managers? It might be worthwhile to make a ‘mobile’ version of your page to display it properly on handheld devices such as blackberry, iphone, ipod or other cellphones.

4.2. Using javascript, flash, and other features

Fancy features enrich browsing experience, but they must be used precisely for that: to enhance content delivery, not to deliver the content itself. Minimise or avoid the use of anything beyond XHTML and PHP to deliver information. Javascripts are quirky on several browsers, and flash may be slow loading. Try browsing your blog with javascript, images and flash turned off – are the users missing essential content? Information is to be conveyed in a clean and simple manner in Web 2.0 so critical content must never depend on alien scripts.

4.3. Accessibility

Several people (including me) often turn off images while browsing on a slow speed internet connection. To ensure that a user does not miss on important stuff, use less graphics and even if you do, always have an ALT text for every image. This is mandatory for XHTML compliance too.

If you are an accessibility freak (which I am not), try adding keyboard accessibility features.

- – -

Disclaimer

That’s all I have in my bag today. Hope these tips help you create a better user experience on your blog.

These tips are merely some guidelines that emerged from my observations and readings and by no means are the rules for a perfect website. Depending on the content you may use some or all of the above features. As long as you are keeping everything simple and clear, I will like your site.

Further Reading: What is Web 2.0?, Web 2.0 design guide,

Feedback

Please let me know what you think about this article. If you have suggestions to see something improved on my blog, I’ll be happy to hear them! Thanks!

For 4 consecutive days by 4 different bloggers, my website got awarded an “Award” each, which is really cool! The last time I remember getting awards was back in 2001-02 when I had a static website and there was no trace of blogs or other interactive web elements we see today (oh I almost sound like a grandfather.)

So a big jar of honey to my following blogmates: Gopinath (Butterfly award), Mavin (Proximity award), Odzer (Butterfly award) and Kiran (Friendship bracelet.)

: : :

I am so lazy these days! In other funny story, last night I had a fantastic dream in which I was working as a double agent in one of those terrorist groups. Unfortunately, I made a mistake and the leader of that group suspected that there was something strange going on in his group. I swore to sacrifice my life and destroy India and pledged my allegiance to the group’s cause. Then he sent me to fight a ‘big’ enemy and I was alone in that skirmish. I couldn’t understand who my opponent was but as the enemy came closer, I discovered that it was a giant mosquito. I pointed my weapon towards the monster sized mosquito and felt a very sharp pain on my leg.

Then I woke up and swatted (swot?) the mosquito who had just bitten my leg.

: : :

Didyouknow didyouknow didyouknow? This is post # 250 on this blog!

: : :

Finally, an unrelated image:

Toronto downtown from Gardiner Expressway on a cloudy day. In the center is the CN Tower.

Step One:

Step Two:

Step Three:

Finished Product:

What the hell is he trying to say?:
This website so far was a mix (cocktail) of personal blog, travelogs, pictures, photos, and everything else I could find. One fine day (obviously, it wasn’t in St. Petersburg) I sat down to think (yes that happens too!) the purpose of my blog and I was left with a clueless expression on my face. I therefore decided to carve out the Travelogs as a separate blog before it took over rest of my blogging. Note: I had started blogging on June 5, 2007.

This means that all you chums who have blogrolled me will have to update their links. Sorry guys!

Personal blog: http://priyank.com/weblog/ (Feed remains)
Travel blog: http://priyank.com/travel (New Feed)
Or simply link to Priyank.com

I expect this streamlining to yield miraculous results, a fortune perhaps.

always,
Priyank

We are thinking of organizing a blogger’s meet on Sunday, November 16^th somewhere in Thane / Mulund area. I live in Dombivli so this location is quite convenient for me (LOL) and people of central, harbour and some of western suburbs.

This is intended to be like a blog-family meet and we do not expect loads of absolutely random, unfamiliar faces (there are mainstream blogger’s meets for that kind of socialization.) So if you can make it that evening, please RSVP by Friday (November 14^th) to my email address, and we’ll all get in sync

mail at priyank dot com

I guess you are surprised by this constant use of ‘WE’. hmm…, since I am only a non-resident Mumbaikar, this whole affair is spearheaded by Nita.

cheers,
Priyank.

I am extremely reachable anyway

cheers,

Rant:
I registered priyank.com in September 1999, barely 6 months after I first started using a computer (after 12^th grade, kinda late). I remember the thrill of discovering Notepad on a black & white computer running windows 3.1 and DOS, the apprehension of using the mouse and 14-kbps shell access to text-only internet (no pictures, colors, graphics). Today, 8.5 years after losing my computer-virginity, I look back at those days with wonder and awe.

I created my first website in early 2000 and in all the time it existed, it has served no useful purpose to the world, other than to entertain myself.

A look at the Archives would reveal that the ‘blog’ part of this website was born only in June 2005, thats approx 2.7 years back. Till then, my website was a collection of static pages, seldom updated, and filled with stuff that fascinated me then

The last 8 years (18-26 years) were the formative years of who I am today and this is vividly reflected in my writings (wow that sounds like an elegant word). It has become my habit to read older posts and have a laugh Some of the things I blogged about two years ago were really immature and childish, and I’m sure that two years into the future I’d have the same opinion about today.

Apart from serving as a convenient online public journal to add on to my personal diary, I’ve made some wonderful contacts via this website all these years. Thanks for all the love showered by you, yes you reader, by means of the comment box, e-mail, chats and real world interactions. I admit, it has given me nothing but encouragement all along.

So let me invite you to join the party with me to celebrate an important milestone of this blog (and the website). Why? Because you are an essential part of it

cheers!

Rules:
1. Name the person with link who tagged you.
2. Complete the questionnaire without changing the questions.
3. Tag 6 or more people.

Lets start:

Q1. Are you happy/ satisfied with your blog, with its content and look?
Blog: Well. Considering the insignificant amount of time I spend on the verb called blogging, I must say I’m pretty satisfied. The idea of banging the keyboard churning out more clutter to the already overcrowded in cyberspace and expecting it to be read by strangers is funny.

Content: I know that I don’t have anything specific on my blog to offer. Marketing theories suggest that the customer (the reader in this case) should be the focus of everything… BUT I’m shamelessly self obsessed

Look: Yea! I LOVE this look. I’m all with straight line designs, bright colors and stuff (next post). I also love the stuff behind the scene, i.e. the code that I so passionately edited. Ok I should stop ranting more. PS: Checkout the themes – Agni and Prithvi. I’m making Jal and Aakash too.

Q2. Does your family know about your blog?
Yes sure they know. My mom dad read it once a couple of months and leave comments. My other relatives have either read it and have appreciated, or have concluded that I’m a nut. I do try to remind them once in a while by uploading pictures on my site and sending them a link

Q3. Do you feel embarrassed to let your friends know about your blog or you just consider it as a private thing?
Nah… I flaunt my blog every time I can! Actually not the blog per se, but the website itself. Link to my personal website is always a part of my e-mail signature. Not many people have/had their own domain names, so sometimes I get “wow your own domain?”…

Q4. Did blogs cause positive changes in your thoughts?
Well, I don’t know about change in thoughts, but it does add different perspectives. I swore I’d never name anyone, but here it goes anyway: I eagerly await Mahendra’s new posts, they are always on diverse topics and well researched. Nita writes amazing stuff about contemporary topics that have an India angle (which I miss). Then I see Krish Ashok doing Jalsa showing Jilpa (I still need to recollect his definitions) and Cuckoo with something unusual and inspiring (except the poetry which I never understand). Nothing is as humorous as watching Rambodoc twist words and phrases. Now that I miss Himalayas, I see it through Mridula’s travel tales (poke: Spiti travelog is OVERDUE…). Gauri’s photos are always inspirational to my mediocre photography skills. Jerry feeds me with heavy objectivist philosophy. Arun is one Carnatak music guru. Oemar’s musings are random enough, but will make you pause and think. I must mention David’s and Paul’s blog factories that dispense global content (a pace I struggle to keep up with).
(See, I’m sure I missed many others. Thats why I was against writing names…)

If someone was curious enough to dig into the archives (no idea why would anyone do that), they’d find the phenomenal evolution that I have undergone since this And reading others’ stuff has got a lot to do with it.

Q5. Do you only open the blogs of those who comment on your blog or you love to go and discover more by yourself?
Apart from visiting the blogs of people who comment, I actively try to discover new ones.
If I put everything in a graphical form, I think that blogosphere is like a circular chain of chains. People have blog friends, those friends have their own friends, and so on. Its so interesting!

Q6. What does visitors counter mean to you? Do you care about putting it in your blog?
There were zooming numbers sometime back. But now I don’t trust the stats much. A conservative estimate suggests that 20% of my visitors are spammers. Then there are others who arrive here googling by mistake. Stats don’t matter (this phrase sounds familiar ).

Q7. Did you try to imagine your fellow bloggers and give them real pictures?
Nah. I did that once upon a time long long ago. It doesn’t work. Most people have a picture these days anyway, some don’t. And for valid safety reasons.

Q8. Do you think there is a real benefit for blogging?
For me? yes for sure. Once I launched a scathing attack on a bank for using fraudulent tactics and it got things fixed for me
For society? ditto.
I believe everyone should have a blog.

Q9. Do you think that bloggers’ society is isolated from real world or interacts with events?
Bloggers society? whats that? If it means the virtual sphere called blogosphere, then I can just laugh here

Q10. Does criticism annoy you or do you feel it’s a normal thing?
I get a kick out of criticism. Although overall I tend to avoid interpersonal conflicts.

Q11. Do you fear some political blogs and avoid them?
No opinion yet.

Q12. Did you get shocked by the arrest of some bloggers?
Nope, it was expected (and I’m not being judgemental).

Q13. Did you think about what will happen to your blog after you die?
Those who know me also know that I plan for all situations. I’m the Hari Seldon of this world my little room.

Q14. What do you like to hear? What’s the song you might like to put a link to, in your blog?
Usually I listen to Indian classical. Either that or soft rock and soul music. I don’t wanna put any link in my blog though. (This is a funny question!)

Who am I tagging?
Well nobody. Are there any volunteers?

Anyway, I tweaked a couple of blog features today, upgraded few plugins and re-coded some php snippets to new standards. Technology changes so rapidly, it’s incredible!

cheers!
(With the hope that I blog at least twice a week. There is so much happening!)

Finally! I was able to setup the weblog, with some of help and trying (in vain) to play around with MySQL vs PostgreSQL. The blog does work now, and I’m glad to have one on my website. This will, hopefully, give a dynamic look to my otherwise static website. I’m (in)famous for not updating the site for months together. Now I intend to update it regularly (and eventually contribute more junk to the already cluttered cyberspace)

Cheers !

Edit: July 18, 2011
Personal blog: http://priyank.com/weblog/
Travel blog: http://priyank.com/travel