Showing posts with label tuesday think tank. Show all posts
Showing posts with label tuesday think tank. Show all posts

09 October 2007

Use Google Calendar to organize your life

I admit that I'm not the greatest at time management; considering that I often find myself "distracted by shiny objects" - usually at the worst time, but one thing that I've always loved using are online calendars. In fact, I started to use a computer-based calendar back around 2000, using Microsoft Outlook to list the various activities that I was in.

Even when I was in college, I'd kept using Outlook to keep track of where I was and what I was going to be doing during the day. I even had a Palm Pilot (which disappeared one day on me, unfortunately) where I'd sync the contents of my Outlook calendar with the organizer. However, I went away from using Outlook's calendar when I left college and fell into the routine workday habit.

Now, I've rediscovered using calendars, and have started to use Google's calendar, aptly named Google Calendar. If you haven't used it before, there isn't a lot to learn to get to use it like a pro. You can have your own private calendar, make a calendar that you can share with your friends, have any variety of public calendars listed, and even make a public calendar for yourself.

Obviously, when you start to use it, you will be asked to give some basic information - your name (just put in whatever you want; it's what's used for the name of your main calendar), location, and timezone (if you want to use a timezone without changing your country, simply check the display all timezones box). Click Continue to proceed.

The first thing that you will see is this week's calendar, with each day split into its 24 hours. You have a variety of views that you can choose from - Today, This Week, This Month, the Next x Days (you can change this in the settings), and the Agenda. At the left, you have this month's calendar laid out for you to have a glance at - if you have an event on a certain day, it will be marked in bold. However, since we've not made any events (in this calendar, at least), you won't see any dates in bold.

Creating events couldn't be any easier than Google have made it - to make an all day event, simply click in the gray bar below the date, or if you are in month view, click on that day. When you're in Day, Week or Next x Days mode, you can also click and drag to make an event that has a set time. Just as an example, I'm going to make an event for Tuesday 9th October from 6.30-10.30AM. I simply click and drag from 6.30 to 10.30, and up pops up this little bubble -

If you want to add details to the event right away, you can simply click edit event details » and you can add information about the item like location, a description, and have control over the guest list; however, more on that later. When you make an event in the calendar view, if you words such as "at" or "in", the calendar will recognize the next portion of your entry as the location. Since I'm not creative in any sort, I'm just going to use Google's example of Breakfast at Tiffany's, and click Create Event to book the event, which makes it pop up in the calendar, like this -

Has the event changed dates or times? All you need to do is, instead of manually changing the date and time, just drag the box to the new time, or if the event got longer or shorter, just drag the bottom of the event's box up or down to change the length of the event.

Calendar Settings

There are a number of settings you can change with regards to your calendar. From the front page, you can change the color of the calendar's display, and have access to the full settings for that calendar. All you have to do is click the little down-arrow next to your calendar's name, which brings up this menu -

In the Calendar Settings page, you can change a number of settings for your calendar, including making a description, changing its name, setting a location and customizing the timezone. At the bottom are two sets of addresses which you can use in order to view your calendar in another program that accepts xml or ical calendars, or view your calendar in html.

The other page I will cover right here is the Notifications page. Here you can adjust the settings for how you want to be notified about events, or remove default reminders. You can also set notifications for invitations you send or receive, and if you wish to be notified on your mobile, have the notifications sent directly to you. It's all fairly straightforward, and here is what it looks like -

There are also the overall settings that you can change by clicking on the Settings link in the upper right. Here, you have options to change the look of your calendars, set the formats of times, dates, and the week. There are a couple of interesting items on this page - first is the Location field - that doesn't set your location in your calendar, but allows you to view the weather for your area. This is only available if you are in the US.

The Calendars tab allows you to change calendars that you have, and calendars that you are viewing, along with being able to add public calendars to your view. The Mobile Setup tab is where you can input your phone details if you wish to have notifications sent to you via SMS; normal rates apply. Click here for a list of supported carriers.

Sharing Calendars

If you want to share your calendar with a friend, it's down right simple. All you have to is click on Share this Calendar in the drop down on the front page, which takes you to the Share this calendar page.

All you have to do to share the calendar with a friend is put in their email address under person, set their permission and then Add them. They'll receive an email inviting them to add your calendar to theirs. Here you can also set the public sharing options. If you share your calendar publicly, then it can be searched out by all people and visible by anyone out there.

Adding Public Calendars

While sharing your calendar might be an unwise move, there are a lot of useful calendars that you can add to your calendar for reminders of TV Shows, Holidays, sport schedules, just search for it and you'll likely find it. Google have put together a list of some of the most common calendars, and you can access them by clicking on the Add link on the left hand side and clicking on Add a public calendar, which brings up the "top pick" calendars:

Of course, there are quicker ways to do things than just clicking. ;)

Keyboard Shortcuts

Like most Google products, calendar has its own set of keyboard shortcuts that make the service easier to navigate. Here is a handy table for you cut out and keep (note that there is no help key to make a list appear)

KeyFunction
cCreate Event
qQuick Add
dDaily View
wWeekly View
mMonthy View
xCustom View
aAgenda View
p or jGo to Previous Timeframe
n or kGo to Next Timeframe
tGo to Today (in current view)
sCalendar Settings
/Search


Alternatives

If you're not one for Google knowing your agenda, would like to have your calendar available offline (through Google's syncing options), or prefer to simply do all of your calendar management offline, there are a couple of programs that you can use for your calendar.

The first one is the one I mentioned at the start - Microsoft Outlook. I'll only recommend this option if you already have Office installed on your system; there's no point in buying the full suite of applications when you only want to use a portion of the functionality that is available to you. Also, Outlook is definitely harder to use than Google Calendar.

If you would like to use your Google Calendar both online and offline, you can pick up a free piece of software from SourceForge called GCALDaemon. Download it here (you will have to have the Java Runtime Environment installed). The folks at Lifehacker have also put together a how-to for the software.

Another option available for both Windows and Linux users is Rainlendar - it is a simple calendar that sits on your desktop, always available for you. They also have a pro version which includes support for Google Calendar. You can find out more information about the product here.

The last option is for those of us who like using Mozilla products like Firefox and Thunderbird - Sunbird & Lightning. If you already use Thunderbird, you can download the Lightning Add-on (or extension) and integrate all the features of Sunbird into Thunderbird. If you don't have Thunderbird or your Thunderbird is already pretty chock-a-block with extensions and accounts, there is Sunbird, which is a standalone program.

Like the two previous options, you can integrate your Google Calendar into the program through the use of another extension called Google Calendar Provider. Click here for more information on these options.

Further Reading
In the companion post to this, Snoskred will talk about time management and she has some great tips that you really should follow. :)

Her post should be up sometime in the next few hours; I'll have a link to it when it's up.

It is now up. You can read her tips on Time Management - Tuesday Think Tank

Tips and Tricks for Google Calendar
Rock Your Google Reader in 18 Ways
Stopdesign | Google Calendar tips
Geek to Live: Black belt scheduling with Google Calendar

Previously in the Tuesday Think Tank
21st August: RSS
14 Reasons Readers Unsubscribe From Your Blog
Tuesday Think Tank: All About RSS

28th August: Blog Templates
Blog Design - Open Your Eyes.
Demystifying Blogger Template Editing

4th September: Nofollow
Spam, Spiders And Do Follow, Oh My!
Say No! to Nofollow

11th September: Site Meters
Do NOT Rely On Your Site Meter.
Track Your Visitors with Google Analytics

18th September: Technorati
Technorati - Sending Out An SOS
The Ups (and Downs) of Technorati

25th September: Google Reader
Google Reader Can Make Your Life Easier - Here's How.
Improving your Google Reader Experience

2nd October: HTML
Basic HTML for Bloggers.
Some HTML Tips & Tricks

Over to you
Do you use a computer-based calendar for your organization? If so, which one do you use?

Also, do you have some tips that would make using any of these calendars easier?

Of course, if you have something that you'd like for Snoskred and myself to discuss, we are definitely open for suggestions. You can leave a comment or send an email to me, or contact Snos via her contact page

If you've liked what you've read, you can stumble the post using your toolbar or the link below.

02 October 2007

Some HTML Tips & Tricks

One of the most mystifying things about being a blogger is understanding the language that your site is written in. I don't mean the language of your content, but rather the language that the actual page is written. The language which makes text look like this or this - HTML.

HTML stands for Hypertext Markup Language and was created in the late 1980s by engineers at CERN, who were the creators of the World Wide Web. The actual specification has gone through lots of changes over the last two decades. The latest specification to be released was version 4.01, which was released in 1999. However, other languages have started to appear which use HTML as their basis.

On the surface, it can all sound confusing, but I'm going to show you how to do some neat tricks with HTML that will allow you to maximize the potential of the language itself. When I put a sample of HTML down, it will look like this -

Typewriter text: Tag - <tt>Typewriter text</tt>
I'll also give a table later on to show you how to get characters such as the less than and greater than symbol into your text, without your browser confusing it for actual, bona-fide HTML.

Adding text to images

Something that you see quite often when it comes to a web page is when you see an image, and put your mouse over it, you see this -

- that is the result of using the "title" property for an image. You can also use the "alt" property, which is good for disabled accessibility, but the text you put there might not appear in some browsers unless the image cannot load. Also, it is technically correct to not show the "alt" property in a tooltip, something which I've just learnt while writing this. The "title" property can also be used for a wide variety of tags. To add "alt" or "title" to an image tag, simply use this code:

<img src="http://address.of.image.net/img/sub/img.png" title="You can place the title of the image here." alt="Alt text is useful for disabled access, but also if your image doesn't load as some browsers will display the alt text in place of the image." />

The result would look something like this; put your mouse over each image to show the title and/or alt information. Let me know in the comments which information you wind up seeing. ;)

If you can see this image's text, you are viewing the ALT information.



As I mentioned, you can also place the title information (also called an "attribute") in a wide variety of tags. For example, you can put the title into a link by doing this -

<a href="http://hyper.link.net/page/blog?p=3292" title="Put a page title or possibly a snarky comment here ;)">click here to begin</a>

It will look like this - click here to begin.

You can also make sections of text show a title by using the following code (I'm going to add a bit of extra code to my example which will make it stand out from the rest of the text) -

<span style="text-decoration:overline" title="This means that you can see it">hover to see a secret message!</span>

The result is this - Hover to see a secret message!.

CSS Primer

That last example brings us neatly to another topic that has become quite prevalent in blogs nowadays: using CSS to change the look of your page. The key in the last example is the

If you use Blogger, you've certainly logged into your blog's template and seen this -

- then wondered what in the world does all that garbeldy-gook mean? Well, it is called CSS, or Cascading Style Sheets. They have been a part of HTML for many years, but were first officially implemented for use on the web in the mid-90s. Now, it is a common way of telling your browser how to show a page to you.

With CSS, there is an almost-endless variety of things that you can do to a page using CSS, including putting items into certain places, setting the width of a page element, and even changing the look of the text in your page, as I did in the example above. In fact, changing the look of your font is one of the most common, and easiest, things you can do with CSS.

For example, if you wanted to have (and this is not an example I'd recommend you actually do, it's just for demonstration purposes ;)) text that was about an inch high, with a line through it, and blinking red, with the font as Comic Sans. Here's how you'd do it:

<span style="font-size:400%;text-decoration:line-through blink;color:rgb(255,0,0);font-family:'comic sans ms'">Use smaller numbers, and don't use blink</span>

Here's how it would look (warning, you might want to put on glasses!)

Seriously, change some numbers and don't use blink, ok?

Now, if you haven't been blinded by that, here's an example of changing the alignment, width and height of a section, causing a scrollbar to appear. The text comes from the automatic complaint letter generator, but first the code I'm going to use. Since the text I'm using is longer than a couple of words, I will use the "div" tag instead of the "span" tag:

<div style="text-align:justify;width:338px;height:325px;overflow:auto">Put really long chunk of text here</div>

And now, here it is in practice; I've added centering tags for viewing purposes:

Based on Gov. John Q. Public V's response to my previous letter, I believe it's safe to say that Gov. Public shows a complete lack of foresight. You see, I undeniably believe that Gov. Public has managed to elude any direct ties to specific acts of negligence -- no small feat considering her history. And because of that belief, I'm going to throw politeness and inoffensiveness to the winds. In this letter, I'm going to be as rude and crude as I know how, to reinforce the point that Gov. Public says that choleric creeps aren't ever antihumanist. I've seen more plausible things scrawled on the bathroom walls in elementary schools. She is typical of obscene cretins in her wild invocations to the irrational, the magic, and the fantastic to dramatize her codices. Easy as it may seem to carve solutions that are neither quasi-hectoring nor frowzy, it is far more difficult to give Gov. Public a rhadamanthine warning not to concoct labels for people, objects, and behaviors in order to manipulate the public's opinion of them. I have seen and heard enough. Now, it is time to fight the warped, distorted, misshapen, unwholesome monstrosity that her quips have become.

If Gov. Public had lived the short, sickly, miserable life of a chattel serf in the ages "before technocracy" she wouldn't be so keen to deflect attention from her unwillingness to support policies that benefit the average citizen. Maybe she'd even begin to realize that if you want to hide something from her, you just have to put it in a book. She maintains that she is the ultimate authority on what's right and what's wrong. Even if this were so, Gov. Public would still be disorderly. But our path is set. By this, I mean that in order to call a spade a spade, we must stop this insanity. I myself consider that requirement a small price to pay because someone has been giving Gov. Public's brain a very thorough washing, and now Gov. Public is trying to do the same to us.

I appreciate feedback and other people's views on subjects. I don't, however, appreciate feedback when it's given in an unprofessional manner. I got off on a tangent. An equal but opposite observation is that Gov. Public has a strategy. Her strategy is to twist the truth. Wherever you encounter that strategy, you are dealing with Gov. Public. I cannot promise not to be angry at her. I do promise, however, to try to keep my anger under control, to keep it from leading me -- as it leads Gov. Public -- to achieve total world domination. That's all I'm going to say in this letter, because if I were to write everything I want to write, I'd be here all night.


In the further reading section, you will find some links to sites that give you every single property that you can use CSS with. Trust me on this, I've used them quite often when working on blog templates. ;)

Making HTML code appear

You'll notice that throughout this post, you've been able to see the actual HTML to use in a page written out for you. There is a secret to getting it to show up; that is called using an "escape character". If you've worked on some computer systems in the past, you may be familiar with the use of the backslash to get things to appear. In HTML, it is almost the same thing, but there is a specific way that you have to write it out for it to work.

All of these characters start with an ampersand (&) and end with a semicolon. The letters in between determine the character that will appear. Below is a table with some of the more common escape characters used in HTML.
Escape CharacterOutput
&amp;&
&quot;"
&lt;<
&gt;>
&nbsp;* 
&euro;
&oslash;ø

*&nbsp; creates a single space. This is useful if you want to have multiple spaces between words.


There are at least 300 characters you can make with these escape codes. You can view the full list here.

Further Reading

In the companion post to this, Snoskred gives you some good Basic HTML for Bloggers. She has some great information about some of the more important bits of code you will use as a blogger.

There are many great resources out there for learning HTML and CSS. First, here are some useful links for learning HTML (nicked from Snoskred's post, with her permission ;))

HTML Reference:
If you know nothing about HTML, this is where you start
Getting Started Tutorial
HTML Code Tutorial
HTML Help
HTML Tutorials At W3
HTML Goodies
HTML Dog
Learn HTML And CSS
Learn Basic HTML For Your Website
Web Safe Color Chart
Non-dithering colors

CSS Reference:
All CSS Properties Listed Alphabetically
CSS Reference at W3 Schools
Mashable: CSS Toolbox, 22 Tools for Working with CSS (there are some great resources there, definitely have a look!)
How to Style an Unordered List with CSS

Previously in the Tuesday Think Tank
21st August: RSS
14 Reasons Readers Unsubscribe From Your Blog
Tuesday Think Tank: All About RSS

28th August: Blog Templates
Blog Design - Open Your Eyes.
Demystifying Blogger Template Editing

4th September: Nofollow
Spam, Spiders And Do Follow, Oh My!
Say No! to Nofollow

11th September: Site Meters
Do NOT Rely On Your Site Meter.
Track Your Visitors with Google Analytics

18th September: Technorati
Technorati - Sending Out An SOS
The Ups (and Downs) of Technorati

25th September: Google Reader
Google Reader Can Make Your Life Easier - Here's How.
Improving your Google Reader Experience

Over to you!

HTML isn't that hard to learn, and if there's something that you're trying to figure out and would like looked at, feel free to comment here.

As always, if you have something that is on your mind that you would like to have explained in a future Tuesday Think Tank, contact either myself or Snoskred via email or in the comments and we'll post about it.

Lastly, if you like what you've read, you can Stumble the post, either using the toolbar or the link below.

25 September 2007

Improving your Google Reader Experience

Over the last few weeks, one thing that would keep me from actually reading blogs was the way I was reading them. For as long as I can remember, my Google Reader just read "100+" for the number of unread items (note that this was before they started counting to 1,000). To make matters worse, I'd add feeds left, right and center, and just dump them into the main list of feeds.

Sure, I did have some folders, such as one for feeds from the newspaper, one called "new-nablopomo", and one called new-blogz. The trend would be that I'd read the items in the folder, and then get further down the list, only reading one or two of the blogs from down there.

I had reached, as Meg puts it, "feed bankruptcy," something she's had to redeclare recently. I was missing lots of items in my feeds, and I would get bogged down in the knowledge that there were all these feeds needing to be read.

However, there were a few problems with how I was reading feeds in my Google Reader. The first of which is that I just had way too many feeds in there - before I started paring it down, I was at 141 feeds, almost all of them not in any folders whatsoever. Among those feeds, I had five in particular - feeds from scam sites - which were giving me an average of over 200 new posts a day.

If you add in the fact that the Bumpzee feeds I subscribe to - Australian Blogs, No Nofollow, and US Blogs - provide nearly 300 new posts a day on their own, I had over 500 new posts a day. I also felt that I had to read every last post in a feed, which contributed to me feeling snowed in with the feeds.

What did I do?

There are three things that I did to improve my use of Google Reader - unsubscribing, using folders, and changing how I read.

Unsubscribing

As I had mentioned, before I started on this, I had 141 feeds, which was way too many. I had to unsubscribe from quite a few blogs. Most of the feeds that I unsubscribed from are ones that I hadn't been reading, for a variety of reasons - either they didn't update anymore, they've moved, or I've just lost touch with them. A great guide to some of the reasons why I unsubscribed from a lot of blogs can be found in Snoskred's 14 reasons readers unsubscribe.

I'm now down to (after adding some new feeds over the last few weeks) 113 feeds. I'm also taking it easy on adding every single blog I come across that I like now. ;)

Using folders

I also started to make use of the folder option. Up until I did this, there were only a few feeds separated from the rest - job site feeds, feeds from my newspaper, and newer blogs that I was reading. Now, having finally finished sorting the rest of my feeds into folders, I have 16 separate folders with anywhere from two feeds up to about 15 feeds in them.

I have folders for Aussie blogs that I read, blogs about Blogging, foodie blogs, life improvement blogs, sport blogs, photoblogs, and a couple of special folders.

The first special folder that I made is called "Frequently-updated" - that folder is for the feeds that have a lot of posts every day; in my case - Lifehacker, Neatorama, Mashable! and English Russia. I've also set aside a folder specifically for the bumpzee feeds so that they don't get forgotten and that I don't get bogged down by seeing one single folder with a lot of unread posts. The last special folder is called Zzz-iftime, which is for blogs that I read, but aren't updated too often or are blogs I tend to leave go for a variety of reasons.

Changing my reading habits

The biggest thing that I've done to improve my use of Reader is by simply changing how I read through feeds. It used to be that I read every single post in what is known as "expanded" view - viewing every item in its entirety. This is a strategy that does not work at all when you have feeds that give you dozens of new posts a day.

The contents of my "frequently-updated" folder in list view.

I made the decision one day to start using list view to view the really busy folders - frequently-updated and bumpzee. That way, I can simply have a look at each item's headline and, if it piques my interest, I just click on the headline to view that article. When I'm done reading that folder, I just hit Shift+a to mark the whole folder read, and that's that.

Viewing an item in its native environment thanks to GPE.

One of the best tools that I have found that helps my reading is a script for Greasemonkey called GPE - Google Reader Preview Enhanced (I haven't been able to get to the site, so you may have issues as well). What this script does is lets you open the actual entry right in Google Reader. This is great for the blogs where the owner has chosen to only allow a partial feed of their site; it's also great if you want to comment on a blog post you like.

The biggest drawback that I've had with this script is that it keeps breaking down so that the keyboard shortcut doesn't work; otherwise, I'd be able to use shift+v to open the post. In fact, the script was just updated so that it works again. Yay! Hmm...or not...there's a new version on the way though, so hopefully it will stick (or I just need to restart my firefox... :))

The last secret...

There is one more secret that I've been using for quite a while now to help me be a more efficient reader in Reader. It's a secret that is, for most of us, right under our fingertips most of the time.

Keyboard Shortcuts.


Google Reader keyboard shortcuts, visible anytime by typing in a question-mark.

I'm a convert to using keyboard shortcuts. It was one of those extra features in Gmail that I said, well, that's nice, but not for me (and honestly I'm still lukewarm to Gmail keyboard shortcuts). However, with Reader, I find that it's a lot more efficient to flip through a list of items by using N and P (if you don't want to open them), or by using J and K (if you do want to open them).

Part of that comes from the fact that I am a big user of keyboard shortcuts in Thunderbird - most often it's using N & P (for unread messages) or B & F (for messages that are read), or one of the number keys to assign an item a color.

Another really handy thing that I can do with the shortcuts is make tagging posts easier. Say, for example, I saw a recipe that I wanted to try. Normally, I'd have to star it and leave it unread in order for it to get my attention. Now, all I do is type in the following - L , F, U, enter, enter. This generates the keyword fud2try and places that recipe into my own virtual recipe box, for me to try when I can scrape together the ingredients. Total amount of time taken - about 3 seconds.

I know that keyboard shortcuts won't be for all of you, but I suggest you take them for a spin before rejecting them out of hand. You might be surprised. :)

Further Reading

Pearl has posted some great links about Google Reader with Google Reader hacks-repository.
Alex Ionut. Chitu shares some of the numbers behind Google Reader
In the companion post to this, Snoskred takes up the techy side of Reader and shows how it can make your life easier.

Previously in the Tuesday Think Tank
21st August: RSS
14 Reasons Readers Unsubscribe From Your Blog
Tuesday Think Tank: All About RSS

28th August: Blog Templates
Blog Design - Open Your Eyes.
Demystifying Blogger Template Editing

4th September: Nofollow
Spam, Spiders And Do Follow, Oh My!
Say No! to Nofollow

11th September: Site Meters
Do NOT Rely On Your Site Meter.
Track Your Visitors with Google Analytics

18th September: Technorati
Technorati - Sending Out An SOS
The Ups (and Downs) of Technorati

Over to you
Do you have any tips that for making the Google Reader experience more efficient? What do you think should be added to Reader that isn't there already? I know that having the actual post time showing would be really handy. Your thoughts are always welcome.

Don't forget that if there is something you'd like to have covered in a future Tuesday Think Tank, feel free to contact either myself or Snoskred via the email links on our sites, or leave a comment with your request.

Lastly, if you like what you've read, feel free to stumble it using the links below or by using the toolbar. :)

18 September 2007

The Ups (and Downs) of Technorati

This week's Tuesday Think Tank came as the result of a request from Julie, who had some questions about Technorati and why her ranking has been changing recently. If you have something you want to have covered in a future Tuesday Think Tank, we always are willing to take suggestions; all you need to do is send an email to either myself or to Snoskred, and we will tackle your topic on a future Tuesday. :)

There really isn't a lot to explain technically when it comes to Technorati. The biggest thing is basically an explanation of how it all works.

Technorati is most often considered the way to gauge a blog's popularity. It works by counting both the number of blogs that it finds with links to your blog, and also the actual number of pages that link to your blog.

There are three different numbers that come as a result of Technorati's counting - Authority, Rank, and Reactions.

Authority and Rank are intertwined, one based on the other. Authority is simply the total number of blogs that have linked to your site, or to a page on your blog. In other words, no matter how many links a particular site may have to you, it will only count as one authority point. Rank is derived from authority and is simply where your blog's authority ranks among all blogs they have listed.

When you start a blog, it starts with an authority of 0 and a rank of somewhere around 8 million. As blogs start to link to you, the numbers do improve; however, to get into the top 100 blogs by Authority, you'll have to have close to 4,000 different blogs linking to you. To get into the top 100,000 (which would have gotten you a nice graph in the past, but recent changes have seen the dropping of that graph), you would need an authority of around 60.

The most important thing to know is that authority and rank are not permanent numbers; of course you do want them to improve over time, but after a while, specifically six months, they may begin to go down. The simple reason for this is that links listed on Technorati "expire" after that amount of time. While I'm not an expert in Technorati, the main reason would be that some of the links might be in posts, or they might be temporary links which go away (for example recent comments lists on dofollow blogs).

Reactions are simply all the links that go back to your blog. This includes links in blogs' links lists, links within posts, and links that come from other methods of linking, such as from the dofollow blogs.

If you want to see the daily "performance" of your blog's reaction, you can check out an image like this -

- which shows you the links over the last X days. The address to use is the following -

putting in your blog's url (minus the http://) and the number of days in the appropriate slots.

Of course, none of this works without Technorati finding the links on blogs.

How do they find links to my blog?

Technorati finds links like any other search engine would - through the use of spiders. It used to be that these spiders were fully-functional, seeing almost all the links that were on a page - including blogrolls, if you have them on your blog.

However, at one point in time in the last few months, they changed spiders to ones that are more in line with regular search engine spiders which cannot see JavaScript elements on a page. That means that if you're part of a BlogRolling blogroll (for example, the Blogger Chicks blogroll), links back to you on other blogs that are part of the network will not count towards your authority. If you're a part of a big blogroll and have experienced a drop off in your authority recently, that means that the six-month window has passed.

Another way that Technorati can find links to other blogs is by reading RSS feeds. If you ping them with a service such as Ping-o-Matic, and include your feed's address, Technorati will look at that, along with your blog, to find links you've put in posts.

A word of advice

Something that I've seen ever since joining up with Bumpzee are these "link trains" which are meant to increase both your PageRank and your Technorati Authority. You'll notice that I don't participate in them; at first it was because I was lazy, but then it was because I didn't see the value in linking to sites that I don't read (or in a lot of cases, never heard of), all in the name of possibly increasing my rankings (and supposedly my traffic).

The other part of the equation for that is that any gains that I'd see would be short-lived (for example, anyone who had participated in the exchange would not have their link to me counted on Technorati). Additionally, have updated their webmaster guidelines that these schemes are not good practice for you to follow as they feel that these types of links are not "proper" links.

Further Reading
In the companion post to this, Snoskred discusses the issues she's having and sends out an SOS.

Previously in the Tuesday Think Tank
14 Reasons Readers Unsubscribe From Your Blog
Tuesday Think Tank: All About RSS
Blog Design - Open Your Eyes.
Demystifying Blogger Template Editing
Spam, Spiders And Do Follow, Oh My!
Say No! to Nofollow
Do NOT Rely On Your Site Meter.
Track Your Visitors with Google Analytics

Over to You
Do you have any more questions about Technorati? (Other than the obvious one of why in the world their servers are so blasted slow, or don't work half the time.) Feel free to leave a comment.

If you've liked this post, feel free to Stumble it using the links below. :)

11 September 2007

Track Your Visitors with Google Analytics

One of the first things that bloggers do when they set up their blogs is set up some form of visitor tracking. A few of the more common trackers are Statcounter, Site Meter and Google Analytics.

Personally, I run all three counters on this blog, but mostly look at Statcounter's stats. It is useful to give me an overview of what is happening *right now* on my blog, and lets me see each individual visitor as they come into the blog.

Google Analytics is most useful to get an overview of your blog's trends, and it does not give you the information on individual visitors like most other counters do. There are a vast array of things that you can do with the data that Google Analytics picks up, but I'll explain some of the more common things that you can do.

Setting up the code

When you first start with Analytics, you will be sent through a seemingly lengthy sign-up process.

To start, you need to go to Google Analytics and sign in with your Google Account (if you don't already have one, you can sign up for one easily and for free).

You'll then be taken to the first page in the sign-up process. To move on, click Sign Up »

Then, you will be asked for some basic information about the page you wish to track - its address, the name you want to assign to the site, your country and your timezone. Click Continue » to proceed. In this example, I'll use the testing blog from a couple of weeks ago as the example.

Then, Google will ask you for your information. The only information that is required is the Country or territory. Again, click Continue » to move on.

The next step is reading through the Terms of Service. As always, be sure to read the whole thing, and if you're OK with the information that is being collected, how it is used, etc. Click Yes to agree to the terms, and then click Create New Account » to set your account up.

Now, you have to set up the tracking code in your blog. This does require you to have the ability to edit your template, and for you to use Javascript in your site. They recommend that you put the code right at the very end of your site's code, but you can place it anywhere on your page that you wish. Simply copy the code and place it in your blog's code. I won't show you how to do that here, but if you need assistance, let me know and I'll post about it. :)

After installing the code, you will be taken to the Analytics Settings page - here you will have access to all the sites you've set up tracking for; you can view the reports, edit settings, delete the tracker and check the status of your site's metering. When you first set up your site's code, the screen will look like the one below, with the status saying that the code is not verify. After you've installed your code and saved the page, you can click on Check Status to tell Google to check that the code is there.

This is the page that you will see after clicking on Check Status. When your code has been just put into your page, you will see that it is Waiting for Data. After about 24 hours, the staus will change to Receiving Data, and unless there is an error with your page, it will stay that way for as long as you have the tracking setup.

Exploring Your Data

So, now you've been receiving data for a while and want to do something with the data you're getting with your new tracker. This is really where the power of Google Analytics shows itself. This is also the point where I must depart from the testing blog and open the books of my own blog for you all to see, hehe ;)

When you go into the View Reports screen, you're taken to the Dashboard, where you are given an overview of the last month's activity on your site. An important thing to know about these reports is that in the default view, you will only see information through yesterday. However, you can change the date quite easily.

This is what the dashboard looks like -

The main graph is the number of visits. Below that, you will find six other types of data for your site. If you click on the links in that section, you will be taken to a page detailing that particular stat with daily breakdowns. The next four sections below that are movable. There, you see a pie chart detailing where traffic has come from for your site, a map of all of your visitors, a graph of the number of visitors to your site, and a list of the five most popular pages on your site.

To change the dates that you wish to look at for your stats, simply click on the date range in the upper right. This will bring down a calendar that allows you to click on the dates you wish to use for the stats. An additional feature that can come in handy is the Compare to Past checkbox. If you check that, you will be given a second set of dates. When you select a range of dates to look at with this option turned on, it will select the same amount of time previous to the period you selected to use. To confirm the date range, click Apply Range, and your stats will update to reflect the new timeframe.

Also, you can select dates by using the Timeline feature. You can drag the frame to move the dates you want to cover, and you can expand or contract to increase or decrease, respectively, the timeframe you want.

One of the most common things done by bloggers is to look at some of the unusual search terms that people used to get to their page. This is one of the best things about its ability to keep the data for thousands and thousands of visitors to your site - you can see all the keywords that have been used, and not just the ones from the number of visits or page views the counter is limited to.

To get to the list of keywords from the dashboard, click on Traffic Sources. That will bring you to the Traffic Sources Overview, which outlines where your traffic has come from. Here, you will see a list of the top five keywords that have been used to get to your site. To see all the keywords, just click on either "view full report" in the main section of the screen, or on Keywords in the left hand side.

On the Keywords report screen, you will see yet another line graph, showing you how many visitors came by via the use of keywords over your specified time frame. Along with that, you can see some statistics about the visitors which came in via keywords. Below that are the actual keywords; clicking on them will take you to a page charting that keyword's use over time.

The stats, from left to right are: total number of visits and percent of site total; Pages per visit; Average time on the site (the time that they had the site open); percentage of visitors who are new; and the bounce rate (percentage of visitors who viewed only one page and then left). These four have comparisons to the site average, with the percent difference between the site average and the average for that particular category.

For all the keywords, you can see the statistics for each category as well.

This is just one example of the information you can find using Google Analytics. My best advice would be to take some time and just have a look around. Below are all the different categories that you can look into with your Analytics account. There is almost no end to the information you can get.

How it all works in a nutshell

Basically, how most trackers work is by your browser having Javascript activated. When a page loads, it will see the javascript code and send the server information about your browser and system. Most of the time this will include your browser's information (as in the version you're running), your screen resolution, your Operating System, IP address, and the referrer.

Some counters do have code designed for users who have turned Javascript off, but you can never be sure that it does work for them.

Snoskred has a lot more on this in her companion post to this, but the reason that most of us do decide to run multiple counters on our sites is that they are notoriously unreliable. The count can vary widely from one to another, depending on the user's configuration, and how you've set up the code in your blog.

Further Reading
Google Analytics Official Blog
Unofficial Google Analytics Blog
27 Features that Make Google Analytics Best of the Breed
Google Analytics Tutorial on Squidoo

Previously in the Tuesday Think Tank
14 Reasons Readers Unsubscribe From Your Blog
Tuesday Think Tank: All About RSS
Blog Design - Open Your Eyes.
Demystifying Blogger Template Editing
Spam, Spiders And Do Follow, Oh My!
Say No! to Nofollow

Over to you

Have you used Google Analytics? What do you think about it? Do you prefer another counter such as Statcounter, or does GA do it for you? Let me know in the comments.

Also, if you like this post, feel free to Stumble It. ;)

04 September 2007

Say No! to Nofollow

One of the most controversial subjects in the world of blogging recently has been the growth of the use of something called "nofollow". However, there are ways to remove it from most parts of your blog.

The short story on nofollow is that it was created a couple of years ago by some of the folks at Google in an effort to prevent spam sites from getting legitimate value from a link left on another site. The primary example of this comes from comments left on blogs, a known target for spammers.

What makes nofollow so controversial is that, while it does prevent the spammers from reaping any benefit from their comment in the way of increased pagerank, it has the unintended consequence of not allowing other bloggers who leave legitimate comments on blogs the right of having the link made when they post the comment recognized by the search engine spiders as existing.

Therefore, a movement has come forth to stop the use of nofollow on blogs, through a variety of ways - most commonly for Bloger users is by removing the code from your template.

An important distinction should be made between the nofollow tag and other forms of instructions to robots. The nofollow tag only tells a robot to ignore the fact that the link exists - it can still go to the site, but the link will not count.

Removing nofollow

For almost all bloggers, it is relatively simple to remove nofollow from your blog. About the only system (that I know of) where you cannot remove nofollow from your blog at all is if you're on wordpress.com. The reason is that you need to use a plugin to remove nofollow and if you're on wordpress.com, you are not allowed to install plugins beyond what you are given by Wordpress itself.

On other platforms and sites, check below.

Blogger

In Blogger, it is relatively simple to remove nofollow from most of your blog. It is important to note that when you do remove nofollow, it is not removed from all aspects of your blog. The areas where nofollow will still exist are blogger comment pages (the page where you actually leave a comment), and any links within comments.

There is no way that I know of to remove nofollow from those two areas (for the first, I don't expect there ever to be a way devised since it is a page created and served by Google). If you do know how to remove nofollow from posted links in comments, leave me a comment ;)

To remove nofollow, you will need to go into the Edit HTML screen of your blog's dashboard, by going into Template -> Edit HTML

Then, the first thing that you need to do is save your template. It is unlikely that you will make a catastrophic error, but it is always advisable to back it up, just in case.

The next step you need to do is to click Expand Widget Templates.

After that, if you have Firefox 2.0+, this is really easy; other browsers, you will have to dig through the template to find it. I'll give you a pointer to where they are located though (the two occurrences are not that far apart actually).

Search in your template for nofollow - the first appearance should be in the comments section, in a tag that starts <a expr:href='data:comment.authorUrl; …. After that, you will find the first "rel='nofollow'". delete that, and then you can move on.

The next part of your template that will have nofollow is in the backlinks section. The text to look for this time is "<a expr:href='data:backlink.url'…. As with the comment section, simply delete "rel='nofollow'" from the tag.

Now, you can go ahead and save your template. Now, your commentators will be able to leave a link with their name and have it recognized by the spiders. :)

WordPress

There are a number of plugins that are available which remove nofollow from your independently-hosted WordPress blog (again, if you're on wordpress.com, you cannot remove nofollow since you cannot install plugins). I have only tried out one - Lucia's Linky Love, and it is a very comprehensive plugin.

You are able to control how many comments a person has before their name has nofollow removed, how many comments they must make for links left in the comments to be made dofollow, and lots more. However, it is slightly more complex than the other solutions.

See below for some alternative plugins to remove nofollow from your blog.

TypePad

I've never used TypePad (mostly because they require you to pay at least $4.95 per month for basic services), but there is a way to remove nofollow from your blog. You can read up on how to remove Nofollow in TypePad Comments, but if you're not hooked up with at least a Pro ($14.95 per month) account, you won't be able to do anything.

Movable Type

Again, I've not used MT, but it is a very common system to use for blogging. You can remove nofollow from your blog by reading about Disabling “nofollow” on Movable Type 3.3.

Making links Nofollow manually

There are some circumstances when you will want to set links as nofollow on their own. For example, when I was talking about paid comments on my blog, I linked to the sites in question, but made them nofollow. You will have your own sites and reasons for making them nofollow, but here is how to do it:

When you're making a link, instead of just leaving the link code as this -

<a href="linky">link text</a>

add "rel="nofollow"" after the "href" segment of the code, for example -

<a href="linky" rel="nofollow">link text</a>

What can I expect after I remove nofollow?

For the most part, you will not notice any difference between your blog before taking nofollow off, and after. However, if you do make it known that you have removed nofollow, you do open yourself up to receiving spam from paid commentators.

A paid commentator will go around a list of blogs which have taken nofollow off and leave comments which are quite generic, but on-topic enough to not raise a lot of suspicision. In the name field, where you would leave your blog's address, they leave the address of the blog (or website) they are advertising for.

Having said that, there are a lot of cool things that you can do with your blog after removing nofollow. If you're a member of Bumpzee, you can join the No Nofollow | I Follow | DoFollow Community. You can also put up one of the neat badges that are available, in order to signify that you do follow links now. Most importantly, you can let your readers know that you've made the decision by posting about it.

Further Reading

As always, there are tons of great resources on this matter out there to read. These are only a few of the better ones. :)

- Ultimate List of DoFollow & Nofollow Plugins - Banish Nofollow From Comments and Trackbacks - this is a list of almost all the plugins that you can use to remove Nofollow from your blog, along with instructions for other platforms
- Removing Nofollow from Blogger Styled Layouts - the "original" when it comes to directions on removing nofollow from a Blogger blog.
- Official Google Blog: Preventing comment Spam - this was where nofollow was first announced. Google all say that it has had a positive reaction, but take a look at the links below the article...
- 11 Reasons against nofollow - nonofollow.net gives 11 great reasons why we should not be using nofollow.
- Spam, Spiders And Do Follow, Oh My! - in the companion post to this, Snoskred discusses the ramifications of nofollow on you, as a reader, and as a blogger who interacts with your readers.

What do you think? Is it right that some bloggers are stuck with nofollow and no way to change it? Should it be easier to remove the function from blogs by making it a simple option in a blog's control panel?

If you've liked what you've read, feel free to stumble the post, or to make a note of it on your own blog. :)

28 August 2007

Demystifying Blogger Template Editing

One of the most common criticisms of Blogger templates is that they're somewhat plain. This is somewhat true, however, it is also one of the biggest misconceptions. If you know where to look, you will find that Blogger's templates (yes, even the ones in the Templates screen) are almost infinitely changeable to suit any style you might want to have for your blog.

The easiest way that you can change the look of your blog doesn't even involve changing templates - you can change the colors and fonts used on your blog by using the aptly-named Fonts and Colors screen in your blog's dashboard. There, you can change literally anything from the color to the text on your page to the color people see when they put their mouse over a link. Each template will have a different set of items that can be changed; for example, on my template (tictac blue) - I can change the text colors, but the background color is set.

When you first view the Fonts and Colors section, you will see the list of changeable elements on the top, and your blog on the bottom. The really cool thing is that when you change something in the top, it is automatically reflected in the bottom half of the screen. These changes, unless you click Save Changes, are only seen by you - not by people who happen to visit your blog at the time.

If you don't like the changes you've made, you can clear the edits you've made, reverting your blog back to how it was when you started, or you can revert it back to the default colors for your template. However, note that this will revert all the colors to the defaults set out in the template code.

You can also use the Shuffle blog colors link to take the colors that you've used already and shuffle them up. To be honest, I think you'd be better off manually choosing colors than using shuffle - I've done it a couple of times and haven't liked the resulting look.



Something that deserves some special attention is the section in the middle where you select colors. There are two "special" groups of colors that blogger puts in to give you a bit of an assist - Colors from your blog and Colors that match your blog. To the right of that is a set of 65 colors which are generally good colors for a blog.

To the right of that is the Edit color hex code box - that's if you have a specific color you've chosen - likely from one of the great color-picking sites out there - and have a hex code for it. The range of colors that you can have in hex goes from #000000 - black to #ffffff - white, with all other colors represented in between.

Further down the list of items that you can change, you will begin to see some Font-related items - generally, Text font, Page Header, etc. Here, Blogger gives you a choice of six basic "universal" fonts to choose from - Arial, Courier, Georgia, Times (New Roman), Trebuchet (MS), and Verdana. While these fonts are alright, a couple of them are somewhat plain to me - Arial and Courier. Arial is one of those "I see it everywhere" fonts, and Courier makes things look like a typewriter generated it.

Aside from the actual typeface, Blogger give you the option of setting it to bold and/or italic, and you can change the size of the font to be as small or as big as you want. Of course, though, you don't want to have your font so small or so large that it's unreadable by your visitors. ;)

Edit HTML

However, Fonts and Colors is just the tip of the iceberg when it comes to changing up your template. The quickest (and for a lot of folks, most intimidating) way to change your blog's look is by using the Edit HTML screen.

The reason I say that it can be intimidating is that this is the raw code that is used to build your blog's page. If you make a mistake, you can throw off the whole appearance of your blog. I know that even though I have experience in fixing blogs, I've made things disappear completely from blogs while editing templates!

The first thing that you should do when you're working on the edit HTML screen - especially if you're doing a major change to your blog's design - is Download the Full Template. This will give you a file that contains everything in the Edit Template box, so that if you do make a major mistake, you will be able to reupload your template from your computer and be back working again in almost no time.

In the future, I'll explore some of the more advanced features of the new "widget" based functions of Blogger code, but I'd like to feature some of the more common requests I get about templates.

Changing your blog's width

There are a variety of reasons why you would want to change the width of your blog - it might only be taking up a small part of your screen. You may have a header graphic that is too wide for your current template, causing it to "hang" over the rest of your blog.

One important thing to note is that all templates are different, so the exact text that you'll find in your code will be different to the code that I have. However, there are some key words that should be in all templates.

For this example, I'll use the code from my blog's template as it is today.



The section that contains my blog's width information is called "layout structure" - there are a number of subsections here that outline the styles of various parts of my blog.

The first section - #outer-wrapper - controls the overall width of the blog - on some templates, it may have a different name such as #content-wrapper. In general, the width of this section will be the largest number, as it is for the whole blog.

My template has a special background (to the left), so there is a separate #content-wrapper section to tell your browser that, while the blog is 847 pixels wide, the content can only be 763 pixels wide, otherwise it would cover the background image.

The next sections are based on the width set out in your outer or content wapper sections. #main (or #main-wrapper, #main_wrap) is the area covered by your blog's posts, and #sidebar (#sidebar-wrapper, #sidebar_wrap) is for the sidebar. If your template is a 3-column template, you will have two sidebar sections - called either left/right_wrap, or sidebar1/sidebar2_wrap.

Generally, the widths, along with the padding and margin numbers across the main and sidebar sections will add up to the width in the outer or content sections. In my example, there is actually a space of 4 pixels in the page somewhere.

To change the width of your blog, you need to make sure of a couple of things first - that you don't have a template like TicTac which has a background image that sets the width of the page to a specific dimension, and that you have an image of what you want your blog to look like.

For example, when I was editing a template from fixed widths to variable widths (you can check out what it looks like here; it is on a dark background), I sat down with a piece of paper and drew out the page as I wanted to see it. I then calculated the various percentages I'd have to use in order to make the page look good.

Another tip is to check your blog's stats to see what resolution your visitors are using - the vast majority of users now are on either 1024x768 or 1280x1024 pixel monitors, at least for my blog. You might have a situation where a majority of visitors are using 800x600. If that is the case, then you should design your blog to be around 785 pixels wide, so that people don't see the horizontal scrollbar.

Now that you've determined the width you want to set your blog, it's time to save your blog's template to your computer if you have not done so already. After saving, you can then begin your changes.

When I adjust a blog's template, I always start by changing the outer-wrapper or content-wrapper (the largest width in your template). That lays the foundation for the rest of your changes. For the purposes of this demonstration, I'll change the width in my blog to 1000 pixels.

This is what the blog looks like in preview, after just changing the outer-wrapper to 1000 pixels. You'll notice that the whole page has shifted to the left, but none of the content has moved.

The next change will be to make the content-wrapper 916 pixels wide (the reason is that the left and right sides are equally off-set by 42 pixels to accommodate the background graphic.

Here's what it looks like after that change. The main blog has not moved, but the sidebar has gone all the way to the right - that is caused by the bit of text in the sidebar code "float: right;" which tells the browser to put the sidebar as far right as is possible.

Next, I'll change the main section to be 635 pixels wide. (1000 - 84 - 259 (sidebar) - 20 (sidebar padding) == 637, then I rounded down to have a more "round" number).

This is what it now looks like - the main blog now runs into the area that used to be the sidebar, while the sidebar still has the end of the background image going straight down the middle of the graphic. All in all, it's not a good look. And even at 1024x768, there's a horizontal scrollbar - that can be attributed to the fact that the window isn't maximized, so there are a few extra pixels being taken up by the window border.

For comparison, this is what the page looks like at 800x600.

The important thing to note here is that if you were to have come to my blog while I was doing this experiment, you would not have noticed any changes. This is because I always, always preview any changes I make to my blog before saving the template. Since this was just an example of how to change your template, I can now go and click the Clear Edits button, and confirm that I want to discard all the unsaved changes.

Further Reading

These are a couple of guides for colors, you can put the hex figures into the colors and fonts screen under color hex code:

  • Hex Hub HTML Color Codes - they've got the colors split into different groups, such as warms, greens, blues and purples. There's also a color mixer, but it doesn't work in Firefox.
  • VisiBone Webmaster's Color Lab - here, you have what is known as the 216-color Webmaster's palette, or 216 colors that are "web-safe" - they allow you to see how a combination of colors works as each color you choose is set as the background and the foreground for any other colors you choose


For some more insight on how to put together your template, check out Snoskred's article Blog Design - Open Your Eyes.